Pembuatan ruang kerja

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.