El lugar 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 lugar de trabajo y sus subcomponentes, consulta el glosario visual.
Inyección div
Un lugar de trabajo de Blockly debe insertarse en un <div>`, denominado “div de inserción”.
El tamaño del elemento div de inyección puede variar de forma estática o dinámica. Los elementos Blockly dentro del elemento div actualizan su tamaño cuando cambia el tamaño de la ventana.
En el siguiente fragmento de código, se muestra el código HTML de un div de inserción de tamaño estático:
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
Inyección
La inyección crea todos los subelementos HTML que conforman la IU de un lugar de trabajo. También realiza toda la inicialización necesaria a fin de preparar el lugar de trabajo para usarlo.
La función de inyección puede tomar el ID del div de inyección o la propia div de inyección:
// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });
// Passes the injection div.
const workspace = Blockly.inject(
document.getElementById('blocklyDiv'), { /* config */ });
Configuración
El lugar de trabajo se puede configurar con varias opciones (como diseño y estilo) durante la inyección.
Para obtener más información sobre las opciones de configuración, consulta Opciones de configuración.