Crea un espacio de trabajo
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
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.
Salvo que se indique lo contrario, el contenido de esta página está sujeto a la licencia Atribución 4.0 de Creative Commons, y los ejemplos de código están sujetos a la licencia Apache 2.0. Para obtener más información, consulta las políticas del sitio de Google Developers. Java es una marca registrada de Oracle o sus afiliados.
Última actualización: 2025-09-11 (UTC)
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2025-09-11 (UTC)"],[],["Blockly workspaces, the UI for block programming, are injected into a designated `\u003cdiv\u003e` element called the \"injection div.\" This div can have a fixed or dynamic size, with Blockly elements resizing accordingly. Injection initializes the workspace UI and readies it for use. The `Blockly.inject()` function, which creates the workspace, accepts either the injection div's ID or the div itself. Workspace configuration, including layout and style, is set during the injection process.\n"]]
