Anatomía de un campo

Valor

Todos los campos deben tener un valor, que es la fuente de información de los datos del campo. Puede ser de cualquier tipo (string, número, array, fecha, etcétera). Los campos pueden usar validadores para restringir los valores o traducirlos a un formato compatible con computadoras (p.ej., la normalización de formatos de fecha).

Texto

Todos los campos contienen texto, que es una string simple legible que representa el valor del campo. Esto no significa necesariamente que sean iguales. Por ejemplo, el texto de un campo booleano puede estar "Activado" o "Desactivado", mientras que su valor es "verdadero" o "falso".

Este texto es lo que se muestra cuando se contrae el bloque, por motivos de accesibilidad, y, opcionalmente, puede ser parte de la pantalla de bloqueo.

Campos editables y no editables

En general, los campos editables permiten al usuario hacer cambios en el código, mientras que los campos no editables le muestran información sobre el bloque. Los campos editables pueden mostrar un editor enriquecido cuando se hace clic en ellos.

Entre los campos editables, se incluyen los siguientes:

Entre los campos que no se pueden editar, se incluyen los siguientes:

Serialización

El valor de un campo serializable se codifica en el formato de guardado (JSON o XML). Todos los campos editables se pueden serializar porque sus valores son dinámicos. Por lo general, los valores de los campos no editables no son dinámicos, por lo que no suelen estar serializados.

Los campos serializados incluyen los siguientes:

Los campos no serializados incluyen los siguientes:

Observa que el campo de etiqueta serializable no se puede editar, pero sí se puede serializar. Eso significa que solo se puede editar de manera programática, en lugar de a través de una IU visible para el usuario. Una vez editado, su valor se codifica en el JSON/XML generado.

Generación de código

Además de conectar y desconectar bloques, los campos son la única forma en que el usuario puede controlar el código que genera Blockly. El editor que proporciona un campo permite al usuario modificar el valor que almacenó el campo. El generador del bloque puede acceder al valor del campo para usarlo en el código generado.

Para obtener más información sobre cómo usar el valor de un campo en un generador, consulta Generación de código de campo.

Pantalla bloqueada

La pantalla de bloqueo de un campo es una colección de elementos SVG que representan el valor del campo. Ocupan espacio en el bloque y, a medida que cambian de tamaño, lo fuerzan a cambiar de tamaño. La visualización en bloque de un campo puede ser simple o compleja, según sus necesidades.

Estos son algunos ejemplos de diferentes pantallas en bloque, en orden de complejidad creciente.

Tipo de campo Descripción
Etiqueta Contiene solo un elemento de texto.
Ángulo Contiene un rectángulo de fondo, un elemento de texto y un símbolo de grado.
Tortuga Contiene un rectángulo de fondo, un elemento de texto y muchos elementos SVG utilizados para construir el gráfico de tortuga.

Pantalla del editor

Cuando un usuario hace clic en un campo editable, el campo puede mostrar un editor arbitrariamente complejo.

Estos son algunos ejemplos de diferentes editores, en orden de complejidad.

Tipo de campo Descripción
Casilla de verificación No hay editor al hacer clic. La pantalla de bloqueo se actualiza.
Entrada de número Editor de texto superpuesto sobre la pantalla con bloqueo Los usuarios pueden escribir; el editor puede cambiar el color para indicar que hay valores incorrectos.
Selector de ángulo El selector de ángulo tiene un editor de texto para escribir números y un editor arrastrable para seleccionar ángulos visualmente.

Otros modos de visualización

Modo contraído: el usuario contrae el bloque.El bloque muestra una representación de texto de sus valores, con el texto que muestran los campos individuales.

Colapso del bloque de campo de tortuga

Modo de accesibilidad: Los usuarios pueden usar un lector de pantalla o tecnología similar para interactuar con Blockly. Es posible que el texto del campo se lea en voz alta al usuario.