การสร้างพื้นที่ทำงาน

พื้นที่ทำงานของ Blockly เป็นคอมโพเนนต์ระดับสูงสุดของ Blockly คือ UI ที่ ที่คุณใช้เขียนโปรแกรมด้วยการบล็อก

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับพื้นที่ทำงานและองค์ประกอบย่อย โปรดดูภาพ อภิธานศัพท์

div การแทรก

พื้นที่ทำงานแบบบล็อกต้องแทรกลงใน <div>" ซึ่งเรียกว่า "การแทรก div"

div การแทรกสามารถปรับขนาดแบบคงที่ หรือ แบบไดนามิก องค์ประกอบบล็อกภายใน div จะอัปเดตองค์ประกอบ เมื่อปรับขนาดหน้าต่าง

ข้อมูลโค้ดต่อไปนี้แสดง HTML สำหรับ div การแทรกขนาดคงที่

<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>

ฉีดยา

การแทรกจะสร้างองค์ประกอบย่อย HTML ทั้งหมดที่ประกอบขึ้นเป็น UI ของ Google Workspace ได้อย่างเต็มประสิทธิภาพ และทำการเริ่มต้นทั้งหมดที่จำเป็นเพื่อรับพื้นที่ทำงาน พร้อมใช้งานแล้ว

ฟังก์ชันการแทรกสามารถใช้ ID ของ div การแทรกหรือการแทรก div นั้น

// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });

// Passes the injection div.
const workspace = Blockly.inject(
    document.getElementById('blocklyDiv'), { /* config */ });

การกำหนดค่า

พื้นที่ทํางานสามารถกําหนดค่าได้หลายรายการ (เช่น การจัดหน้าและรูปแบบ) ระหว่างฉีดยา

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกการกำหนดค่า โปรดดู ตัวเลือกการกำหนดค่า