Tipos de Control¶
Los controles son conjuntos definidos de datos que se muestran en un Panel en Vinyl, y el Tipo de control determina cómo se mostrarán los datos y, más específicamente, cómo se verán. Si bien la mayoría de los tipos de control requieren seleccionar un objeto de datos, algunos no. Las diferentes opciones para un Tipo de Control son las siguientes:
| Nombre | Descripción |
|---|---|
| Autocompletar | Al editar un campo, aparecerá una lista desplegable con otras entradas en la columna. Si se va a utilizar un objeto de datos específico para la lista, se puede especificar seleccionándolo en el menú desplegable Agrupar por; de lo contrario, el control utilizará de forma predeterminada los elementos de la columna. Hay tres opciones de filtro para la lista:
|
| Botón | Los botones se pueden utilizar para activar un evento, para enlace a una nueva página dentro de la aplicación o para enlace a una URL externa. |
| Grupo de botones | Un elemento de control gráfico con pestañas que permite al usuario elegir solo una de un conjunto predefinido de opciones. Similar al tipo de control de radio. Este tipo de control requiere una fuente de la que extraer los valores de clave y título. Consulte a continuación para obtener más información sobre el tipo de control del grupo de botones. |
| Casilla de verificación | Muestra un campo de casilla de verificación. La casilla de verificación está vinculada a una columna de fuente de datos booleana/de bits. La casilla de verificación se mostrará llena si el valor es 1/verdadero y vacía si 0/falso. Las columnas booleanas normalmente se configuran para no permitir valores nulos y el valor predeterminado es 0. |
| Selector de colores | Muestra un cuadro con el color apropiado de un código de color hexadecimal determinado. Por ejemplo, una columna de tabla con el código hexadecimal #000000 mostrará un cuadro negro. Cuando se edita una fila del selector de color, se abrirá una rueda de colores. |
| Fecha | Al crear un control de fecha, los usuarios pueden elegir si el control muestra la fecha, la hora o ambas. La opción predeterminada es Detectar, que determinará el subtipo de control en función del tipo de datos lógicos de la columna de datos. Cuando se edita un control de Fecha en una aplicación, aparecerá un calendario que permitirá a los usuarios seleccionar una fecha. Para los controles de fecha con hora y fecha habilitadas, al hacer clic en el ícono Hora aparecerá un reloj. |
| Control dinámico | Un Control Dinámico puede cambiar su tipo en función de los datos que recibe. Esto es especialmente útil para formularios que utilizan múltiples tipos de entrada. Tipos de control compatibles con control dinámico:
|
| Insertar | Incrusta un archivo de una URL que está en una columna de la tabla (podría ser un objeto binario/Panel de una sola fila). |
| Archivo | Permite cargar un archivo. La columna de objeto de datos sobre la que se basa un tipo de control de archivo debe ser binaria para que este tipo de control funcione correctamente. Como referencia, consulte el tutorial de Contenedor de archivos genérico. |
| Grupo | Seleccionar Grupo permite al usuario crear un grupo para el panel, donde los controles seleccionados se pueden colocar en agrupaciones lógicas. |
| HTML | El tipo de control HTML tiene varias plantillas que se pueden utilizar para completar diversas tareas. Por ejemplo, la modelo Panel centrado creará una página que permitirá al usuario insertar una imagen y escribir una breve descripción. Imagen de panel completo inserta una imagen de la tabla usando codificación HTML. La modelo de Google Maps toma una dirección en la tabla de datos y la muestra por vista de mapa o por vista de calle. Los valores del mapa también se pueden utilizar para mostrar una vista de la calle de Google. LinkedIn permite vincular a un perfil de LinkedIn. |
| Icono | Selecciona una imagen para mostrarla junto con otros controles en el panel. |
| Imagen | Muestra una imagen de la base de datos de Vinyl. Se puede formatear como 'icono' o 'foto' en Propósito de la imagen, según el resultado deseado. |
| Línea | Muestra una línea delgada y horizontal cuando se agrega a un panel. El tipo de control de línea está diseñado principalmente para usarse en un panel de una sola fila en Vinyl. El valor de Ancho para el Tipo de control de línea define qué tan ancho, horizontalmente, se muestra la línea en la pantalla. Si deja Ancho nulo o en blanco (pero no 0), la línea ocupará el 100% del espacio asignado. Si proporciona un valor de Ancho numérico, como 25, ocupará 25 "Zudy" del espacio asignado. |
| Lista | Permite a un usuario seleccionar de una lista de valores válidos. El objeto de datos de origen es la tabla u objeto comercial que contiene los valores necesarios para la lista desplegable, así como la clave y el título necesarios para el control. |
| Numérico | Muestra números. |
| Contraseña | Cifra el texto cambiándolo a puntos. |
| Barra de progreso | Inserta una barra de progreso, que se puede utilizar para ilustrar visualmente el progreso de una tarea o proceso. La visibilidad del estado de un sistema o proceso es importante para los usuarios con un buen diseño de UI/UX, ya que les proporciona retroalimentación sobre lo que está sucediendo. Consulte a continuación para obtener más información sobre el tipo de control de la barra de progreso. |
| Radio | Un elemento de control gráfico que permite al usuario elegir sólo una de un conjunto predefinido de opciones. Este tipo de control requiere una fuente de la que extraer los valores de clave y título, y está disponible para paneles de tablero, paneles de carril y tipos de paneles estándar. |
| Espacio | Inserta espacios en blanco visuales, sin necesidad de hacerlo en HTML. Esta característica está diseñada principalmente para su uso en un panel de una sola fila de Vinyl. |
| Texto | Muestra texto. Este texto también se puede utilizar para desencadenar un evento: eliminar o guardar, vincular a una nueva página dentro de la aplicación o vincular a una URL externa. |
| Área de texto | Muestra texto en un contenedor de mayor tamaño y permite saltos de línea. |
| Plantilla | Tipo de control que tiene varias plantillas diferentes que se pueden usar para realizar diversas tareas, incluidas HTML y JSON. |
Barra de Progreso¶
Se puede utilizar un tipo de control Barra de progreso para indicar visualmente a un usuario de Vinyl qué tan avanzado está en un proceso, o el progreso o la finalización de una tarea en particular. Por ejemplo, es posible que desee mostrar una barra de progreso para indicar qué tan completa está la información que está intentando capturar actualmente. El porcentaje completado en una barra de progreso determinada depende de que se necesite un valor de la base de datos que esté entre 0 y 1, donde 1 = 100% (0,4 se mostraría como 40%).
La barra de progreso admite los siguientes Subtipos:
- Apilado = muestra la etiqueta y el valor porcentual debajo de la barra
- Barra normal = muestra el porcentaje dentro de la barra
Puede formatear la forma en que aparece el texto en la barra de progreso usando Formato de cadena (disponible en Edge Case) y puede personalizar aún más el control usando Estilos.
Grupo de Botones¶
El tipo de control Grupo de botones obtiene datos como los controles de radio actuales, pero produce botones en los que se puede hacer clic para establecer el valor correspondiente. Admitirán el modo Excel y aparecerán como botones si lo hacen (similar a cómo las casillas de verificación guardan automáticamente el valor cuando se hace clic si usa el modo Excel). Algunos estilos están controlados por Temas que puede aplicar al campo.
