Tipos de control en Jitterbit App Builder
Descripción general
Control Type es un campo que determina cómo se muestran los datos de un control, y específicamente qué aspecto tiene el control en la página. Por ejemplo, si se establece Control Type en Checkbox, se muestran sus datos como una casilla de verificación vinculada a un valor booleano, mientras que si se establece en Date, se muestra un selector de calendario en su lugar. La mayoría de los tipos de control requieren seleccionar un objeto de datos del cual obtener los datos, aunque algunos, como Line y Space, no lo requieren.
Se establece Control Type cuando se agrega un control a un panel, en el diálogo Add a Control, o se puede cambiar posteriormente desde la pestaña Control Properties del control mismo. Consulta Controls para obtener el concepto más amplio de qué es un control y cómo los controles se ajustan a los paneles y páginas.
El diálogo Add a Control agrupa sus tipos de control en tres categorías, cada una listada en su propia tabla a continuación: Basic, Groups y Edge Case.
Agregar un control
Para agregar un control a un panel, abre la lista de controles del panel y haz clic en + Control para abrir el diálogo Add a Control:
Selecciona una Column o un Control Type directamente si el control no se asigna a una columna, luego sigue los pasos restantes del diálogo. Consulta Controls para conocer el procedimiento completo, incluyendo cómo abrir la lista de controles de un panel y cómo agregar varios controles a la vez.
Basic
Los siguientes tipos de control aparecen bajo Basic en el menú desplegable Control Type:
| Control Type | Descripción |
|---|---|
| Button | Coloca un botón clickeable en un panel. |
| Checkbox | Muestra y edita un valor booleano como una casilla de verificación. |
| Date | Muestra y edita una fecha, una hora, o ambas. |
| List | Permite al usuario seleccionar un valor de una lista predefinida de opciones. |
| Numeric | Muestra y edita un número almacenado en una columna. |
| Radio | Permite al usuario elegir una de un conjunto predefinido de opciones, mostradas como botones de radio. Requiere un objeto de datos de origen para extraer los valores de Key y Title, y está disponible en los tres tipos de panel Dynamic (Grid, Tile y Form), además de Lane. |
| Text | Muestra y edita el valor de una columna como texto sin formato. |
| Text Area | Muestra y edita el valor de texto de una columna en una región más grande y de varias líneas. |
Groups
Los siguientes tipos de control aparecen bajo Groups en el menú desplegable Control Type:
| Control Type | Descripción |
|---|---|
| Accordion | Agrupa otros controles para que se muestren u oculten en un acordeón que los usuarios pueden abrir y cerrar. |
| Field Group | Agrupa otros controles juntos en un contenedor con título y diseño personalizable. |
| Tab | Agrupa otros controles para que se muestren en pestañas entre las que los usuarios pueden hacer clic. |
Edge Case
Los siguientes tipos de control aparecen bajo Edge Case en el menú desplegable Control Type:
| Control Type | Descripción |
|---|---|
| Autocomplete | Permite al usuario completar rápidamente un campo eligiendo entre valores ya ingresados en esa columna. |
| Button Group | Permite al usuario elegir una de un conjunto predefinido de opciones, como botones clickeables. Consulta a continuación para obtener más detalles. |
| Color Picker | Muestra una muestra de color y permite a los usuarios elegir un nuevo color de una rueda de colores. |
| Dynamic | Se representa como un tipo de control diferente en tiempo de ejecución, según el estado del objeto de datos subyacente. |
| Embed | Incrusta un archivo desde una URL almacenada en una columna de tabla, que podría ser un objeto binario o estar incrustado dentro de un panel Form. |
| File | Permite al usuario cargar un archivo. La columna a la que se vincula debe ser binaria para que el control funcione correctamente. |
| HTML | Muestra contenido HTML de una columna vinculada, escrito directamente en un editor WYSIWYG (What You See Is What You Get). |
| Image | Muestra una imagen de la biblioteca de imágenes de App Builder. |
| Inline Menu | Muestra uno de los menús existentes de tu aplicación directamente dentro de un panel. Disponible solo en paneles Form. |
| Line | Muestra una línea delgada y horizontal cuando se agrega a un panel. Diseñado principalmente para su uso en un panel Form. |
| Password | Enmascara el valor de texto de una columna como puntos. |
| Progress Bar | Proporciona una indicación visual de qué tan avanzado está un proceso o tarea. Consulta a continuación para obtener más detalles. |
| Space | Inserta espacio visual en blanco sin necesidad de HTML personalizado. Diseñado principalmente para su uso en un panel Form. |
| Tags | Permite al usuario seleccionar uno o más valores de una lista, en lugar de solo uno. |
| Template | Vincula una plantilla HTML reutilizable a un panel. Consulta a continuación para obtener más detalles. |
Grupo de Botones
Un control Grupo de Botones obtiene sus datos de la misma manera que un control Radio, pero muestra botones en lugar de botones de opción para establecer el valor. Como otros controles, Grupo de Botones admite Modo Excel; a diferencia de un control Casilla de verificación, que cambia de apariencia para autoguardar su valor en Modo Excel, un control Grupo de Botones sigue mostrando botones. Se pueden controlar algunos de sus estilos mediante temas aplicados al campo.
Barra de Progreso
Un control Barra de Progreso proporciona una indicación visual del progreso de un proceso o tarea. Por ejemplo, se puede mostrar una Barra de Progreso para indicar qué tan completo está actualmente un formulario de varios campos. El porcentaje de relleno de la barra proviene de un valor de base de datos entre 0 y 1, donde 1 es igual a 100% (un valor de 0.4 se muestra como 40%).
Barra de Progreso admite dos subtipos, establecidos a través de Subtipo de Control:
- Apilada muestra la etiqueta y el valor porcentual debajo de la barra.
- Barra normal muestra el porcentaje dentro de la barra.
Se puede dar formato al texto mostrado mediante Cadena de Formato, que se encuentra en Caso Extremo, y personalizar aún más la apariencia del control mediante Estilos.
Plantilla
Un control Plantilla vincula una plantilla HTML reutilizable a un panel, seleccionada en su campo Plantilla a partir de plantillas creadas en Apariencia > Plantillas. Las plantillas disponibles se agrupan por origen: App Builder (integradas), Terceros (como Google Maps Directions o incrustación de LinkedIn) y Cliente (plantillas que tu organización creó). Consulta Crear y usar plantillas HTML para obtener información sobre cómo crear una plantilla personalizada.