Un'area di lavoro Blockly è il componente di livello più elevato di Blockly. È la UI che che usi per programmare con i blocchi.
Per saperne di più sull'area di lavoro e sui relativi sottocomponenti, consulta l'articolo glossario.
div inserimento
Un'area di lavoro Blockly deve essere iniettata in un elemento <div>, chiamato "injection"
div".
L'elemento div di iniezione può avere le dimensioni statiche in modo dinamico. Gli elementi a blocchi all'interno del div aggiornano la loro quando la finestra viene ridimensionata.
Il seguente snippet di codice mostra il codice HTML di un div di inserimento con dimensioni statiche:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Iniezione
L'injection crea tutti gli elementi secondari HTML che compongono l'interfaccia utente di un area di lavoro. Esegue anche tutte le operazioni di inizializzazione necessarie per ottenere pronto per l'uso.
La funzione di iniezione può assumere l'ID del div di iniezione, div stesso:
// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });
// Passes the injection div.
const workspace = Blockly.inject(
document.getElementById('blocklyDiv'), { /* config */ });
Configurazione
Lo spazio di lavoro può essere configurato con numerose opzioni (ad esempio layout e stile) durante l'iniezione.
Per ulteriori informazioni sulle opzioni di configurazione, consulta Opzioni di configurazione.