Un espacio de trabajo de Blockly es el componente de nivel más alto de Blockly. Es la IU que usas para programar con bloques.
Para obtener más información sobre el espacio de trabajo y sus subcomponentes, consulta el glosario visual.
Div de inserción
Un espacio de trabajo de Blockly debe insertarse en un <div>, llamado "div de inserción".
La inserción div puede tener un tamaño estático o dinámico. Los elementos de Blockly dentro de div actualizan su tamaño cuando se cambia el tamaño de la ventana.
En el siguiente fragmento de código, se muestra el código HTML para una inserción de tamaño estático div:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Inyección
La inserción crea todos los subelementos HTML que componen la IU de un espacio de trabajo. También realiza toda la inicialización necesaria para preparar el espacio de trabajo para su uso.
La función de inserción puede tomar el ID de la inserción div o la inserción div en sí:
// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });
// Passes the injection div.
const workspace = Blockly.inject(
document.getElementById('blocklyDiv'), { /* config */ });
Configuración
El espacio de trabajo se puede configurar con numerosas opciones (como diseño y estilo) durante la inserción.
Para obtener más información sobre las opciones de configuración, consulta Opciones de configuración.