Ruang kerja Blockly adalah komponen tingkat tertinggi Blockly. Ini adalah UI yang Anda gunakan untuk memprogram dengan blok.
Untuk mengetahui informasi selengkapnya tentang ruang kerja dan subkomponennya, lihat glosarium visual.
Divisi injeksi
Ruang kerja Blockly harus disisipkan ke dalam <div>, yang disebut "div penyisipan".
Penyisipan div dapat diukur secara statis atau
secara dinamis. Elemen Blockly dalam div memperbarui
ukurannya saat jendela diubah ukurannya.
Cuplikan kode berikut menunjukkan HTML untuk penyisipan berukuran statis
div:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Injeksi
Penyisipan membuat semua sub-elemen HTML yang membentuk UI ruang kerja. Selain itu, fungsi ini juga melakukan semua inisialisasi yang diperlukan untuk menyiapkan ruang kerja agar siap digunakan.
Fungsi injeksi dapat menggunakan ID injeksi div, atau
injeksi div itu sendiri:
// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });
// Passes the injection div.
const workspace = Blockly.inject(
document.getElementById('blocklyDiv'), { /* config */ });
Konfigurasi
Ruang kerja dapat dikonfigurasi dengan berbagai opsi (seperti tata letak dan gaya) selama injeksi.
Untuk mengetahui informasi selengkapnya tentang opsi konfigurasi, lihat Opsi konfigurasi.