Membuat ruang kerja
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
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.
Kecuali dinyatakan lain, konten di halaman ini dilisensikan berdasarkan Lisensi Creative Commons Attribution 4.0, sedangkan contoh kode dilisensikan berdasarkan Lisensi Apache 2.0. Untuk mengetahui informasi selengkapnya, lihat Kebijakan Situs Google Developers. Java adalah merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-09-11 UTC.
[[["Mudah dipahami","easyToUnderstand","thumb-up"],["Memecahkan masalah saya","solvedMyProblem","thumb-up"],["Lainnya","otherUp","thumb-up"]],[["Informasi yang saya butuhkan tidak ada","missingTheInformationINeed","thumb-down"],["Terlalu rumit/langkahnya terlalu banyak","tooComplicatedTooManySteps","thumb-down"],["Sudah usang","outOfDate","thumb-down"],["Masalah terjemahan","translationIssue","thumb-down"],["Masalah kode / contoh","samplesCodeIssue","thumb-down"],["Lainnya","otherDown","thumb-down"]],["Terakhir diperbarui pada 2025-09-11 UTC."],[],["Blockly workspaces, the UI for block programming, are injected into a designated `\u003cdiv\u003e` element called the \"injection div.\" This div can have a fixed or dynamic size, with Blockly elements resizing accordingly. Injection initializes the workspace UI and readies it for use. The `Blockly.inject()` function, which creates the workspace, accepts either the injection div's ID or the div itself. Workspace configuration, including layout and style, is set during the injection process.\n"]]
