Blockly çalışma alanı, Blockly'nin en üst düzey bileşenidir. Kullanıcı arayüzü bloklarla programlamak için kullandığınız araçlardır.
Çalışma alanı ve alt bileşenleri hakkında daha fazla bilgi için görsel sözlüğü.
Yerleştirme div
Blockly çalışma alanının, "yerleştirme" adı verilen bir <div>"e yerleştirilmesi gerekir
div" ekleyin.
Yerleştirme div öğesi statik olarak veya dinamik olarak ayarlayın. Div içindeki bloklu öğeler, boyutunu değiştirebilirsiniz.
Aşağıdaki kod snippet'i, statik olarak boyutlandırılmış bir yerleştirme div öğesine ilişkin HTML'yi gösterir:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Enjeksiyon
Ekleme, bir çalışmayacaktır. Ayrıca, çalışma alanını almak için gereken tüm başlatma hazır olduğundan emin olun.
Yerleştirme işlevi, yerleştirme div öğesinin kimliğini veya ekleme div'in kendisi:
// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });
// Passes the injection div.
const workspace = Blockly.inject(
document.getElementById('blocklyDiv'), { /* config */ });
Yapılandırma
Çalışma alanı, birçok seçenekle (düzen ve stil gibi) yapılandırılabilir olabileceğini unutmayın.
Yapılandırma seçenekleri hakkında daha fazla bilgi edinmek için Yapılandırma seçenekleri.