Veritran Docs

Flat

Haz clic en el botón de opción Flat para establecer un único color para el fondo del componente. Para establecer el color, haz clic en el campo y escribe un código de color hexadecimal o haz clic en el ícono cuadrado de bordes redondeados para abrir el selector de color. En el selector de color, seleccione un color o introduzca el código de color hexa o rgba.

También puede establecer el porcentaje de opacidad fuera del selector de color en el campo Opacidad. Si previamente seleccionó un color en el selector de color, la opacidad se establece en 100 de forma predeterminada. Si no se seleccionó ningún color, este campo está vacío. Para modificarlo, haga clic en el campo e introduzca el porcentaje deseado.

Gradient

Haz clic en el botón de opción Gradient para establecer un degradado de color para el fondo del componente. Haga clic en cada uno de los iconos cuadrados de bordes redondeados para abrir el selector de color. En el selector de color, seleccione un color o introduzca el código de color hexagonal en el campo respectivo. Haga clic para invertir el orden de los colores seleccionados para el degradado. Haga clic en o para definir la dirección del gradiente en posición horizontal o vertical, respectivamente.

Background Image

Haz clic en la casilla Image para añadir una imagen al fondo del componente. Puedes utilizar una imagen de fondo con las opciones de fondo flat y gradient. Haz clic en el campo Background Image y escribe el nombre de la imagen de fondo, o haz clic en Select an image para abrir el selector de imágenes. Selecciona una de las imágenes de la lista o utiliza la barra de búsqueda para encontrar una imagen por su nombre.

Color

Color del borde. Para establecer el color, haz clic en el campo y escribe un código de color hexadecimal o haz clic en el ícono cuadrado de bordes redondeados para abrir el selector de color. En el selector de color, seleccione un color o introduzca el código de color hexa o rgba.

Width

Ancho del borde. Escriba un número para establecer el ancho. Para cambiar la unidad de medida, haga clic en la elipsis (tres puntos) y seleccione una opción en el menú desplegable.

CSS Class

CSS o estilo invocado desde Style > Themes y aplicado al componente. Haz clic en el campo y selecciona un estilo en el menú desplegable.

Profile Option

Código aplicado en referencia al perfil de usuario de la app. Haz clic en el campo e introduce el código.

Icon

Para definir un icono, haz clic en el campo y escribe el nombre de la imagen, o haz clic en el icono de la lupa para abrir el selector de imágenes. A continuación, selecciona una de las imágenes disponibles en la lista o utiliza la barra de búsqueda para encontrar una imagen por su nombre.

Icon Color

Para establecer un color para el icono, haz clic en el campo y escribe un código de color hexadecimal o haz clic en el icono cuadrado para abrir el selector de color. Para establecer el color de la sombra, haz clic en el campo y escribe un código hexadecimal o haz clic en el ícono cuadrado para abrir el selector de color. En el selector de color, seleccione un color o introduzca el código de color hexa o rgba.

Value

Texto mostrado en el componente que informa al usuario de la app sobre el uso o la acción del botón. Puedes añadir texto sin formato o una referencia a un parámetro o registro. También puedes añadir el valor al diccionario de traducciones o seleccionar una traducción existente si hay idiomas seleccionados en la configuración de la app.Traducciones

Submit

Id del formulario para procesar. Al procesar un formulario, se validan todos los campos asociados a ese id de formulario. Haz clic en el campo e introduce un id de formulario.

Enabled

[en] Attribute that defines whether the component can be clicked by the app user or not.

Haz clic en la flecha y elige uno de los dos valores del menú desplegable. Selecciona true si se puede hacer clic en el componente o false si no se puede hacer clic. Los botones desactivados aparecerán en gris en la app. El valor por defecto es true.

Visible

Atributo que define si el componente es visible en la app. Haz clic en la flecha y elige una opción del menú desplegable. Selecciona true para que el componente sea visible en la app o false para que no lo sea.

Important For Accessibility

Atributo que define si el lector de pantalla lee o ignora el valor definido en el atributo Texto de accesibilidad del componente. Haz clic en la flecha y selecciona una opción del menú desplegable. Elige true para que el lector de pantalla lea el componente o false para que el lector de pantalla no lea el componente. El valor por defecto es false.

Accessibility Text

Texto alternativo. Añade un texto breve para describir el componente a los usuarios que no puedan verlo. El texto será leído por iOS Voice Over o Android Talk Back. También puedes añadir el texto de accesibilidad al diccionario de traducciones o seleccionar una traducción existente si hay idiomas seleccionados en la configuración de tu app.Traducciones

Accessibility Order

Atributo que indica al lector de pantalla el orden en que debe leer los componentes. Para configurarlo, haz clic en el campo e introduce un número para definir el orden. Por ejemplo, si este componente debe leerse en tercer lugar, introduce el valor 3. Si no configuras un orden personalizado, los componentes se leen de arriba hacia abajo y de izquierda a derecha de la pantalla.

Tab Index

Orden en el que el cursor se desplaza de un componente a otro y se centra en cada componente pulsando la tecla TAB de un teclado (aplicaciones web) o tocando Next (aplicaciones móviles en dispositivos Android). Haz clic en el campo e introduce un valor.

Position Type

Haz clic en la flecha y selecciona un tipo en el menú desplegable. Consulta la tabla a continuación para saber más sobre las opciones disponibles.

Alineación del texto

Haz clic en la opción de alineación deseada. Haz clic en la opción de alineación deseada: (de izquierda a derecha) justificada, izquierda, centrada o derecha , dependiendo de si desea que el texto se alinee con los bordes izquierdo y derecho, con el borde izquierdo, centrado entre los dos bordes del componente o alineado con el borde derecho. También puedes hacer clic en </> y escribir el código para establecer la alineación del texto manualmente.

Propiedades de relleno

Espacio entre el borde del componente y el contenido del componente (valor). Introduce un valor para cada una de las propiedades de relleno: Padding Top, Padding Left, Padding Bottom and Padding Right. Puedes hacer clic en la flecha situada a la derecha de cada campo de relleno y seleccionar la unidad de medida deseada en el menú desplegable.

Propiedades de los márgenes

Espacio alrededor del borde de un componente. Introduzca un valor para cada una de las propiedades de margen: Margen superior, margen izquierdo, margen inferior y margen derecho. Para definir la unidad de medida, haz clic en la flecha del campo de la derecha y selecciona una opción del menú desplegable.

Resource Origin

Método a través del cual se carga el recurso referenciado por el componente. Rellena este campo si el componente seleccionado hace referencia a un recurso, como una imagen o un vídeo. Haz clic en la flecha y selecciona una de las opciones disponibles en el menú desplegable: elige L (Local) para recuperar el contenido codificado de los recursos locales o elige H (HTTP) para recuperar el contenido de los recursos del Comm Server.

Z-Index

Propiedad que define el orden de posición de los componentes. Si varios componentes se solapan, los componentes con un índice Z más alto se colocarán sobre los que tengan un índice más bajo. Este campo se rellena automáticamente.

Shadow offset-x

Introduce un valor para la sombra con respecto al eje X (horizontal), que considera el centro del componente como punto de partida. Si el valor es un número negativo, la sombra apuntará hacia la izquierda. Puedes hacer clic en la flecha situada a la derecha del campo de sombra y seleccionar una unidad de medida en el menú desplegable.

Shadow offset-y

Introduce un valor para la sombra con respecto al eje Y (vertical), que considera el centro del componente como punto de partida. Puedes hacer clic en la flecha situada a la derecha del campo de sombra y seleccionar una unidad de medida en el menú desplegable.

Shadow Blur Radius

Introduce un valor para la anchura del radio de la sombra. Puedes hacer clic en la flecha situada a la derecha del campo de sombra y seleccionar una unidad de medida en el menú desplegable.

Shadow Color

Para establecer el color de sombra, haga clic en el campo Color de sombra y escriba un código de color hexagonal o haga clic en el icono cuadrado de bordes redondeados para abrir el selector de color ubicado a la izquierda (icono cuadrado de bordes redondeados). En el selector de color, seleccione un color o introduzca el código de color hexa o rgba.

Botón atrás

Atributo que indica si el evento definido en el atributo onClick debe ejecutarse cuando el usuario de la app hace clic o pulsa el botón Back. Haz clic en la flecha y elige una de las opciones disponibles en el menú desplegable. Selecciona true para que el evento se active o false para que el evento no se active. El valor por defecto es false.

Force Show

Atributo que indica al dispositivo que muestre un botón de retroceso, aunque no corresponda. Haz clic en la flecha y elige una de las opciones disponibles en el menú desplegable. Selecciona true para que se muestre el botón de retroceso o false para que no se muestre. Si este atributo no está configurado, el valor por defecto es false.

Color

Color del texto. Para establecer el color, haz clic en el campo y escribe un código de color hexadecimal o haz clic en el ícono cuadrado de bordes redondeados para abrir el selector de color. En el selector de color, seleccione un color o introduzca el código de color hexa o rgba.

Font Size

Tamaño del texto. Para establecer el tamaño, haz clic en el campo y escribe el valor deseado. Consulte la tabla a continuación para obtener más información sobre los tipos de tamaños de texto y los valores disponibles.

Font Family

Familia de fuentes o tipo de letra del texto. Para establecer una familia de fuentes, haz clic en la flecha y selecciona una opción del menú desplegable. También puedes hacer clic en </> y escribir el código para establecer manualmente la familia de fuentes del texto.

Font Style

Estilo de fuente del texto. Para definir el estilo de letra, haz clic en la flecha y selecciona una opción del menú desplegable. La única opción disponible es la cursiva.

Font Weight

Peso de la fuente del texto. Para establecer el peso de la fuente, haz clic en la flecha y selecciona una opción del menú desplegable. La única opción disponible es la negrita.

Text Decoration

Decoración añadida al texto. Para fijar la decoración, haz clic en la flecha y selecciona una opción del menú desplegable. La única opción disponible es el subrayado.

On Click

Acción que consiste en hacer clic o tocar el componente.

Evento de seguimiento de clics

Acción que implica el seguimiento de las acciones On Click. Para obtener más información sobre cómo crear un evento de seguimiento y añadirlo a un componente de tu app, consulta la sección Tracking.GA4 Tracking

On Double Click

Acción que consiste en hacer clic o tocar dos veces el componente.

On Hold

Acción que consiste en hacer clic en el componente y mantenerlo pulsado durante más de un segundo.

On Focus

Acción que implica centrarse en el componente. Por ejemplo, pulsando sobre el campo de texto del componente para empezar a escribir.

On Blur

Acción que implica perder de vista ese mismo componente.

Alpha

Transparencia u opacidad del componente. Introduce el valor para establecer la opacidad inicial del componente antes de que se ejecute la animación. El valor puede oscilar entre 0 y 1, considerando 1 como el valor que otorga el mayor nivel de transparencia.

Scale

Dimensión del componente. Introduce el valor para establecer la escala inicial del componente antes de que se ejecute la animación. Por defecto, el valor de escala es 1, que equivale al tamaño original del componente. El valor puede ser cualquier número empezando por 1.

On Load Effect

Animación ejecutada inmediatamente después de cargar la pantalla.

On Call Effect

Animación ejecutada al invocarla a través de un mensaje.

Tooltip Enabled

Determina si el tooltip está activado en la app para el componente seleccionado. Haz clic en la flecha y elige una opción del menú desplegable. Selecciona true para activar el tooltip o false para desactivarlo.

Message

Mensaje mostrado por el tooltip. Introduce un mensaje que se mostrará en pantalla.

Background Color

Color de fondo del tooltip. Para establecer un color, haz clic en el campo y escribe el código hexadecimal del color o haz clic en el ícono cuadrado de bordes redondeados para abrir el selector de color. En el selector de color, seleccione un color o introduzca el código de color hexa o rgba, respectivamente.

Position

Haz clic en la flecha y selecciona una opción del menú desplegable para fijar la posición del tooltip con respecto al componente: Bottom, Left, Right o Top.

Value

Atributo que simula el comportamiento del atributo Value de la sección Basic de la pestaña Design. Haz clic en el campo y escribe un valor para que se aplique automáticamente al componente.

Background Image

Imagen aplicada al fondo del componente.

Imagen aplicada al fondo del componente con fines de simulación. Para agregar una imagen, haz clic en el campo Background Image y escribe el nombre de la imagen de fondo, o haz clic en el ícono de la lupa para abrir el selector de imágenes. Selecciona una de las imágenes de la lista o utiliza la barra de búsqueda para encontrar una imagen por su nombre.