Ruang kerja utama Blockly mungkin memiliki petak. Blok dapat dibuat agar pas ke petak, memungkinkan tata letak yang lebih bersih. Hal ini sangat membantu pada aplikasi yang lebih besar dengan beberapa pengelompokan kode yang tersebar di area yang luas.
Setelan petak ditentukan oleh objek yang merupakan bagian dari konfigurasi Blockly. Berikut ini contohnya:
var workspace = Blockly.inject('blocklyDiv', {toolbox: document.getElementById('toolbox'), grid: {spacing: 20, length: 3, colour: '#ccc', snap: true}, trashcan: true});
Spasi
Properti petak yang paling penting adalah spacing
yang menentukan jarak
antar-titik petak. Nilai defaultnya adalah 0, yang tidak menghasilkan petak.
Berikut adalah contoh spacing
yang ditetapkan ke 10, 20, dan 40:
Durasi
Properti length
adalah angka yang menentukan bentuk titik petak.
Panjang 0 menghasilkan petak yang tidak terlihat (tetapi masih juga yang dapat diikat), panjang 1 (nilai default) menghasilkan titik, panjang yang lebih panjang menghasilkan persilangan, dan panjang yang sama atau lebih besar dari spasi menghasilkan kertas
grafik. Berikut adalah contoh length
yang ditetapkan ke 1, 5, dan 20:
Warna
Properti colour
adalah string yang menetapkan warna titik.
Perhatikan ejaan dalam bahasa Inggris. Gunakan format yang kompatibel dengan CSS, termasuk #f00
,
#ff0000
, atau rgb(255, 0, 0)
. Nilai defaultnya adalah #888
.
Berikut adalah contoh colour
yang ditetapkan ke #000
, #ccc
, dan #f00
:
Snap
Properti snap
adalah boolean yang menetapkan apakah blok harus dipaskan ke
titik petak terdekat saat ditempatkan di ruang kerja. Nilai defaultnya adalah false
.