Herramientas para desarrolladores de Blockly
es una herramienta para desarrolladores basada en la Web que automatiza partes del proceso de configuración de Blockly, como la creación de bloques personalizados, la compilación de tu caja de herramientas y la configuración de tu espacio de trabajo de Blockly.
El proceso de desarrollador de Blockly con la herramienta consta de tres partes:
- Crea bloques personalizados con Block Factory y Block Exporter.
- Compila una caja de herramientas y un espacio de trabajo predeterminado con Workspace Factory.
- Configura tu lugar de trabajo con Workspace Factory (actualmente, una función solo web).
Pestaña Bloquear fábrica
La pestaña Block Factory te ayuda a crear definiciones de bloques y generadores de código de bloques para bloques personalizados. En esta pestaña, puedes crear, modificar y guardar bloques personalizados con facilidad.
Cómo definir un bloque
En este video, se explican en detalle los pasos para definir un bloque. La IU está desactualizada, pero las funciones de bloque que destaca siguen siendo precisas.
Cómo administrar la biblioteca
Se hace referencia a los bloques por su nombre, por lo que cada bloque que desees crear debe tener un nombre único. La IU aplica esta regla y deja claro cuándo estás “guardando” un bloque nuevo o “actualizando” uno existente.
Puedes cambiar entre los bloques que guardaste anteriormente o crear uno nuevo y vacío haciendo clic en el botón Biblioteca. Cambiar el nombre de un bloque existente es otra forma de crear rápidamente varios bloques con definiciones similares.
Cómo exportar e importar una biblioteca
Los bloqueos se guardan en el almacenamiento local del navegador. Si borras el almacenamiento local del navegador, se borrarán tus bloqueos. Para guardar tus bloqueos de forma indefinida, debes descargar tu biblioteca. Tu biblioteca de bloques se descarga como un archivo XML que se puede importar para establecerla en el estado en el que estaba cuando descargaste el archivo. Ten en cuenta que importar una biblioteca de bloques reemplaza la actual, por lo que te recomendamos que primero exportes.
Las funciones de importación y exportación también son la forma recomendada de mantener y compartir diferentes conjuntos de bloques personalizados.
Pestaña Block Exporter
Una vez que hayas diseñado tus bloques, deberás exportar las definiciones de bloques y los stubs del generador para usarlos en una app. Esto se hace en la pestaña Block Exporter.
Todos los bloques almacenados en tu biblioteca de bloques se mostrarán en el selector de bloques. Haz clic en el bloque para seleccionarlo o anular la selección para exportarlo. Si quieres seleccionar todos los bloques de tu biblioteca, usa la opción "Seleccionar" → "Todo almacenado en la biblioteca de bloques". Si compilaste tu caja de herramientas o configuraste tu lugar de trabajo con la pestaña Workspace Factory, también puedes seleccionar todos los bloques que usaste haciendo clic en “Seleccionar” → “Todos los usados en Workspace Factory”.
La configuración de exportación te permite elegir el idioma generado al que deseas segmentar y si deseas las definiciones, los stubs del generador o ambos para los bloques seleccionados. Una vez que los hayas seleccionado, haz clic en "Exportar" para descargar los archivos.
Pestaña Workspace Factory
Workspace Factory facilita la configuración de una caja de herramientas y el conjunto predeterminado de bloques en un espacio de trabajo. Puedes alternar entre editar la caja de herramientas y el lugar de trabajo inicial con los botones "Toolbox" y "Workspace".
Cómo crear una caja de herramientas
Esta pestaña ayuda a compilar el XML de una Toolbox. En el material, se da por sentado que el usuario está familiarizado con las funciones de una caja de herramientas. Si ya tienes un archivo en formato XML para una caja de herramientas que quieres editar aquí, puedes cargarlo haciendo clic en "Load to Edit".
Toolbox sin categorías
Si tienes algunos bloques y quieres mostrarlos sin categorías, simplemente arrástralos al espacio de trabajo y verás que aparecen en la caja de herramientas de la vista previa.
Caja de herramientas con categorías
Si deseas mostrar bloques en las categorías, haz clic en el botón "+" y selecciona el elemento desplegable de la categoría nueva. Se agregará una categoría a tu lista de categorías que podrás seleccionar y editar. Selecciona "Categoría estándar" para agregar una categoría individual de Blockly estándar (lógica, bucles, etc.) o "Kit de herramientas estándar" para agregar todas las categorías de Blockly estándar. Usa los botones de flecha para reordenar las categorías.
Para cambiar el nombre o el color de la categoría seleccionada, usa el menú desplegable “Editar categoría”. Si arrastras un bloque al espacio de trabajo, se agregará a la categoría seleccionada.
Bloques avanzados
De forma predeterminada, puedes agregar a la caja de herramientas cualquiera de los bloques estándar o de tu biblioteca. Si tienes bloques definidos en JSON que no están en tu biblioteca, puedes importarlos con el botón "Import Custom Blocks".
Algunos bloques deben usarse juntos o incluir valores predeterminados. Esto se hace con grupos y sombras. Los bloques que estén conectados en el editor se agregarán a la caja de herramientas como un grupo. Los bloques que están conectados a otro bloque también se pueden cambiar a bloques con sombras. Para ello, selecciona el bloque secundario y haz clic en el botón “Crear sombra”. Nota: Solo los bloques secundarios que no contienen una variable se pueden cambiar a bloques sombreados.
Si incluyes una variable o un bloque de función en su caja de herramientas, incluye una categoría "Variables" o "Funciones" para permitir que los usuarios utilicen el bloque por completo. Obtén más información sobre las categorías"Variables" o "Funciones".
Cómo configurar un lugar de trabajo
Para configurar diferentes partes de tu lugar de trabajo, ve a la pestaña "Workspace Factory" y selecciona "Workspace".
Elige las opciones de Workspace
Establece valores diferentes para las opciones de configuración y mira el resultado en el área de vista previa. Si habilitas la cuadrícula o el zoom, se mostrarán más opciones de configuración. Además, cambiar a usar categorías suele requerir un espacio de trabajo más complejo. Se agregan automáticamente un ícono de papelera y barras de desplazamiento cuando agregas tu primera categoría.
Cómo agregar bloques cargados previamente al espacio de trabajo
Esto es opcional, pero puede ser necesario si deseas mostrar un conjunto de bloques en el lugar de trabajo:
- Cuando se carga la aplicación.
- Cuando se activa un evento (avanzar un nivel, hacer clic en un botón de ayuda, etcétera)
Arrastra bloques al espacio de edición para verlos en tu lugar de trabajo en la vista previa. Puedes crear grupos de bloques, inhabilitar bloques y hacer que ciertos bloques sombreen a otros cuando los selecciones.
Puedes exportar estos bloques como XML (consulta a continuación). Agregalos a tu espacio de trabajo con Blockly.Xml.domToWorkspace, inmediatamente después de crearlo:
var xmlText = '<xml xmlns="https://developers.google.com/blockly/xml">' +
'<block type="math_number"></block></xml>';
Blockly.Xml.domToWorkspace(Blockly.utils.xml.textToDom(xmlText), workspace);
En este código de muestra, se agrega un solo bloque math_number al espacio de trabajo.
Exportando
Workspace Factory te ofrece las siguientes opciones de exportación:
- Código de partida: Produce HTML y JavaScript iniciales para insertar tu espacio de trabajo personalizado de Blockly.
- Toolbox: Produce XML para especificar tu caja de herramientas.
- Bloques de Workspace: Produce XML que se puede cargar en un espacio de trabajo.