Valor
Todos los campos deben tener un valor, que es la fuente de confianza de los datos del campo. Puede ser de cualquier tipo (cadena, número, array, fecha, etcétera). Los campos pueden usar validadores para restringir valores o traducirlos a un formato legible por máquina (p.ej., normalizar formatos de fecha).
Texto
Todos los campos contienen texto, que es una cadena simple legible que representa el valor del campo. Esto no significa necesariamente que sean iguales. Por ejemplo, el texto de un campo booleano puede ser “Activado” o “Desactivado”, mientras que su valor es true o false.
Este texto es el que se muestra cuando el bloque está contraído, para la accesibilidad, y puede formar parte opcionalmente de la visualización en el bloque.
Campos editables y no editables
En general, los campos editables permiten que el usuario realice cambios en el código, mientras que los campos no editables muestran información al usuario 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 no editables, 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 son serializables, ya que sus valores son dinámicos. Los valores de los campos no editables no suelen ser dinámicos, por lo que no se serializan.
Los campos serializados incluyen lo siguiente:
Los campos no serializados incluyen los siguientes:
Observa cómo el campo Label Serializable no se puede editar, pero sí se puede serializar. Esto significa que solo se puede editar de forma programática, en lugar de a través de una IU visible para el usuario. Una vez editado, su valor se codifica en el archivo 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 que el usuario modifique el valor que almacena el campo. Luego, 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.
Visualización en el bloque
La visualización en bloque 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, fuerzan al bloque a cambiar de tamaño. La visualización en el bloque de un campo puede ser simple o compleja, según sus necesidades.
Estos son algunos ejemplos de diferentes pantallas integradas en el bloque, ordenados de menor a mayor complejidad.
| 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 que se usan para construir el gráfico de tortuga. |
Pantalla del editor
Cuando un usuario hace clic en un campo editable, es posible que el campo muestre un editor arbitrariamente complejo.
Estos son algunos ejemplos de diferentes editores, ordenados de menor a mayor complejidad.
| Tipo de campo | Descripción |
|---|---|
| Casilla de verificación | No hay editor cuando se hace clic. Se actualiza la pantalla en el bloque. |
| Entrada de número | Editor de texto superpuesto sobre la pantalla en bloque. Los usuarios pueden escribir, y el editor puede cambiar de color para indicar valores incorrectos. |
| Selector de ángulo | El selector de ángulos tiene un editor de texto para escribir números y un editor arrastrable para seleccionar ángulos de forma visual. |
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 devuelven los campos individuales.
Modo de accesibilidad: Es posible que los usuarios utilicen un lector de pantalla o una tecnología similar para interactuar con Blockly. El texto del campo se puede leer en voz alta al usuario.