Ruang kerja Blockly adalah komponen level tertinggi di Blockly. Ini adalah UI yang yang Anda gunakan untuk memprogram blok.
Untuk informasi selengkapnya tentang ruang kerja dan subkomponennya, lihat panduan visualisasi glosarium.
Div injeksi
Ruang kerja Blockly harus dimasukkan ke dalam <div>
`, yang disebut "injeksi
div".
Div injeksi dapat diubah ukurannya secara statis atau secara dinamis. Elemen-elemen blok dalam div memperbarui ketika ukuran jendela berubah.
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 dari Workspace. Juga melakukan semua inisialisasi yang diperlukan untuk mendapatkan ruang kerja siap digunakan.
Fungsi injeksi dapat menggunakan ID div injeksi, 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 informasi selengkapnya tentang opsi konfigurasi, lihat Opsi konfigurasi.