Apariencia
Last updated
Last updated
En el apartado Appearance puedes configurar diversas opciones vinculadas a la visualización de los campos en el formulario. Aunque este tipo de propiedades se centra en elecciones de estilo o formato que no influyen de modo directo en la funcionalidad de los componentes, es importante tener en cuenta que pueden afectar notablemente su eficacia: un diseño claro y amigable para el usuario favorecerá su correcta administración mientras que un diseño poco intuitivo puede dificultarla.
Veamos cuáles son estas propiedades para los distintos tipos de elementos de formulario. Recuerda que puedes activar el modo Preview mientras trabajas para revisar en tiempo real cómo impactan las distintas elecciones que realices.
Tanto las columnas como los elementos estáticos Text e Image poseen propiedades específicas que definen su posicionamiento en pantalla. La propiedad Vertical align es común a todos ellos y se refiere a la ubicación que los componentes adoptan respecto al margen superior e inferior de la sección o columna que los contiene. Esta propiedad puede configurarse como Top (se alinea en la parte superior), Center (se alinea en el centro) o Bottom (alineado en la parte inferior).
Otra propiedad que afecta solamente a las columnas es Spacing, que se refiere al espacio vertical existente entre los elementos de una misma columna. Cuanto mayor sea este número, más separación existirá entre los campos.
La propiedad Align que se encuentra tanto en los campos de texto como de imagen, funciona de un modo similar pero definiendo el posicionamiento horizontal del contenido. Este puede establecerse en Left, Center o Right, que indican alineación a la izquierda, al medio o a la derecha respectivamente.
El campo Text ofrece una mayor riqueza de opciones, contando con las siguientes propiedades:
Aunque los campos de entada presentan rangos de opciones más variados dependiendo de su funcionalidad, en la mayoría de ellos encontrarás las siguientes propiedades de apariencia:
Esta propiedad define una estructura para dato solicitado, determinando sus valores posibles. Para utilizar esta propiedad, deberás conocer ciertos parámetros, que definen el tipo de caracteres aceptados en cada espacio de la cadena:
El caracter "a" representa cualquier letra, es decir que cuando se incluye en la máscara, el usuario solo podrá ingresar un caracter alfabético en ese espacio.
El caracter '0' representa cualquier número. Al incluirse en la máscara, solo admitirá como válidos para ese espacio los valores desde el 0 al 9.
Si solo se considerará como válida una letra o número particular en ese espacio de la cadena, es necesario ingresar el caracter correspondiente en la máscara.
Si un caracter de la cadena debe ser específicamente "a" o "0", dado que estos números tienen también una función como letra o número genérica, se debe anteponer la barra "\" para que solo se acepte ese caracter puntual.
Pueden agregarse otros caracteres como puntos o guiones a la máscara para que los datos ingreados adopten este formato.
Establece un texto predeterminado que se muestra al usuario en ese campo, el cual puede utilizarse para brindar ejemplos o sugerencias para completarlo.
Añade una expresión como prefijo a los datos que se ingresen en el campo, por ejemplo, la característica antes de un número de teléfono.
Puede escogerse el valor True si se desea que el campo posea múltiples líneas (para un área de texto más extensa) o False, si se muestra en un único renglón.
Ten presente que algunos tipos de campos como Date o Attachment tendrán menos cantidad de propiedades o bien no mostrarán este apartado, ya que tienen un formato preestablecido que no admite variaciones. Otros campos, como Options o Boolean, tendrán propiedades únicas para los componentes de su tipo, tal como veremos más adelante.
Propiedad | Función |
---|---|
Margin
Con valores desde 0 hasta 10, permite escoger el margen de espacio libre alrededor del texto. Un valor más bajo lo posicionará con mayor proximidad a los demás componentes mientras que un valor más alto aumentará la separación.
Weight
Permite establecer el peso de la tipografía en Light (ligera), Regular (normal) o Bold (negrita).
Font style
Permite seleccionar el estilo de itálica o normal para el texto.
Text variant
Ofrece una serie de variantes preconfiguradas con distintos niveles para encabezados, subtítulos, cuerpo de texto y otras opciones.