Ruang kerja Blockly adalah komponen level tertinggi di Blockly. Ini adalah UI yang Anda gunakan untuk memprogram dengan blok.
Untuk informasi selengkapnya tentang ruang kerja dan subkomponennya, lihat glosarium visual.
div injeksi
Ruang kerja Blockly harus dimasukkan ke dalam <div>`, yang disebut "div
injeksi".
Div injeksi dapat diubah ukurannya secara statis atau dinamis. Elemen blockly dalam div memperbarui ukurannya ketika jendela berubah ukuran.
Cuplikan kode berikut menunjukkan HTML untuk div injeksi berukuran statis:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Injeksi
Injeksi membuat semua sub-elemen HTML yang membentuk UI ruang kerja. Library ini juga melakukan semua inisialisasi yang diperlukan agar ruang kerja siap digunakan.
Fungsi injeksi dapat menggunakan ID div injeksi, atau div injeksi 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 informasi selengkapnya tentang opsi konfigurasi, lihat Opsi konfigurasi.