Paneles en Jitterbit App Builder
Introducción
Los paneles en App Builder son los contenedores en las páginas de tus aplicaciones que albergan la información mostrada en la interfaz de usuario, como datos, imágenes y todo tipo de controles.
Todas las páginas en las aplicaciones de App Builder están organizadas mediante el uso de paneles. Hay varios tipos de paneles, que se describen en esta página.
Tipos de paneles
En la pestaña Páginas del App Workbench, puedes seleccionar cualquiera de las páginas de tu aplicación o hacer clic para crear una nueva. Cuando lo haces, se te lleva a la pantalla de edición de esa página, donde el panel Diseño del Panel de Página te permite configurar todos los paneles en esa página.
Hacer clic en el botón + Agregar Panel abre el cuadro de diálogo Crear un Panel:

El cuadro de diálogo enumera todos los tipos de panel disponibles, que también se describen en las secciones a continuación:
-
Dinámico
-
Cuadrícula
Múltiples filas de datos con campos que aparecen horizontalmente. -
Mosaico
Datos mostrados como mosaicos, envolviendo hacia abajo en la página. -
Formulario
Una sola fila de datos con controles que aparecen verticalmente.
-
-
Informe
-
Calendario
Datos mostrados como un calendario, por diferentes vistas. -
Gráfico
Mostrar visualmente datos en una variedad de tipos de gráficos. -
Gantt
Muestra datos como un gráfico de Gantt, para planificación y programación. -
Mapa
Muestra un mapa para visualizar relaciones geográficas. -
Gráfico de Red
Muestra visualmente relaciones entre elementos conectados. -
Tabla Dinámica
Muestra datos en un formato de tabla dinámica.
-
-
Caso Especial
-
HTML Personalizado
Permite mostrar HTML personalizado. -
Explorador de Archivos
Agrega un control de explorador de archivos a tu panel. -
Marco
Reserva espacio en la página para cargar otro contenido. -
Carril
Datos mostrados como mosaicos en una serie de carriles.
-
Dinámico
Cuadrícula
![]()
Cuadrícula es el tipo de panel básico para mostrar múltiples filas de datos a la vez. Este tipo de panel muestra columnas específicas de la tabla u objeto de origen de datos seleccionado. Hacer clic en el título de una columna permite ordenar las filas en orden ascendente o descendente. El número total de filas en un panel de Cuadrícula se muestra en la esquina superior derecha, encima de los títulos de las columnas. El número de filas cargadas a la vez (dependiendo del total de registros) para fines de visualización puede ser menor que el total o puede ser un subconjunto de todos los registros. Para ver más filas, haz clic en el botón Cargar Más Filas en la parte inferior del panel.
Mosaico
![]()
Los paneles de Mosaico combinan el comportamiento de los paneles de Cuadrícula y de Formulario. Al igual que los paneles de Cuadrícula, los paneles de Mosaico muestran múltiples conjuntos de información a la vez. Sin embargo, la información de las tablas u objetos de origen de datos se presenta en bloques dispuestos de izquierda a derecha en lugar de en columnas. Al igual que con los paneles de Formulario, los controles se agrupan con otros controles en la misma posición en la tabla de datos.
Formulario
![]()
Los paneles de Formulario están diseñados para mostrar una única línea de datos del origen de datos seleccionado. Este tipo de panel es especialmente útil como una ventana emergente o página de detalles en una aplicación. Cuando se asignan múltiples controles a los paneles de Formulario, cada control se muestra individualmente.
Informe
Calendario
![]()
Los paneles de Calendario llenan un calendario con información de la fuente de datos seleccionada. Al igual que los paneles de Gráfico, los paneles de Calendario pueden estar vinculados a otro panel para mostrar más detalles sobre un Evento en el calendario.
Tipos de controles requeridos
- Descripción: Designa lo que aparecerá en el calendario; típicamente el Nombre de un Evento.
- Inicio del Evento: Designa qué día comienza el Evento; puede incluir marcas de tiempo mostradas junto a la descripción del evento.
- Fin del Evento: Designa qué día termina el Evento; puede incluir marcas de tiempo mostradas junto a la descripción del evento.
Tipos de controles opcionales
- Color: Valor de color utilizado por el calendario para indicar Eventos.
- Ordenar: Permite aplicar ordenamiento al valor seleccionado.
Gráfico
![]()
Los paneles de Gráfico muestran datos en una representación gráfica. App Builder admite muchos tipos de gráficos, incluidos Barras, Columnas, Líneas y Áreas. Los gráficos pueden estar vinculados a los datos subyacentes para que un usuario pueda hacer clic y ver los datos de soporte.
Tipos de controles requeridos
- Categoría: Representa el eje X (horizontal) en el gráfico.
- Valor: Representa el eje Y (vertical) en el gráfico.
Tipos de controles opcionales
- Color: Valor de color utilizado por el gráfico.
- Ordenar: Permite aplicar ordenamiento al valor seleccionado.
- Bandera: Utilizada para marcar un evento o punto de interés.
- Objeto de Opciones JSON: Objeto JSON que anula las opciones del gráfico.
Gantt
![]()
Los paneles de Gantt muestran gráficos de Gantt, que son útiles para planificar y programar proyectos. Ayudan a evaluar cuánto tiempo debería tomar un proyecto, determinar los recursos necesarios y planificar el orden en que se completarán las tareas. Los gráficos de Gantt también son una herramienta útil para gestionar las dependencias entre tareas.
Para usar un gráfico de Gantt en un panel de Gantt, se necesita un objeto de negocio que contenga información para los controles requeridos. Los gráficos de Gantt también pueden representar Dependencias de Tareas y Grupos de Tareas, siempre que esa información esté configurada en el objeto de negocio.
Tipos de controles requeridos
- Tarea: Representa una tarea individual del proyecto que se está rastreando.
- Fecha de Inicio: Representa la fecha de inicio de la tarea.
- Fecha de Fin: Representa la fecha de finalización de la tarea.
Tipos de controles opcionales
- Color: Valor de color para la tarea en el gráfico.
- Dependencia: Determina la relación de la tarea con otras tareas de las que depende.
- Tarea Principal: Referencia a otra tarea del objeto de negocio, utilizada para la disposición jerárquica.
- Ordenar: Permite aplicar ordenamiento al valor seleccionado.
- Grupo de Tareas: Se utiliza para agrupar o colocar múltiples tareas en la misma fila.
Mapa
![]()
Los paneles de Mapa muestran un mapa donde los controles pueden ser visualizados a través de la ubicación geográfica. Los nombres de las regiones del mapa en su objeto de negocio subyacente deben coincidir con los identificadores de los mapas fuente de Highmaps; esto puede requerir atención adicional para asegurar que la clave de su objeto de negocio pueda ser reconocida por el mapa fuente. Por ejemplo, si tiene un objeto de negocio con nombres de condados de EE. UU., los nombres de los condados pueden no ser únicos; en ese caso, debe tener una columna que coincida con la clave de Highmaps. Se pueden elegir diferentes mapas proporcionados a través de la API de Highmaps según los datos que desee mostrar.
Para información adicional sobre los paneles de Mapa, consulte Panel de Mapa. Para información sobre los mapas fuente proporcionados en el panel de Mapa, consulte la documentación de Highmaps.
Tipos de controles requeridos
- Categoría: País, Estado, etc.
- Valor: Valor asociado con la categoría.
Tipos de controles opcionales
- Objeto de Opciones JSON: Objeto JSON que anula las opciones del gráfico.
- Color: Valor de color para un evento o tarea.
Gráfico de Red
![]()
Los paneles de Gráfico de Red muestran interconexiones entre un conjunto de entidades. Cada entidad está representada por un nodo, y las conexiones entre nodos se representan a través de enlaces.
Tipos de controles requeridos
- Desde: Nodo de origen para este enlace.
- Nodo: Nodo del Gráfico de Red.
- Etiqueta del Nodo: Etiqueta del nodo del Gráfico de Red. Requerida al usar UUIDs para relaciones.
Tipos de controles opcionales
- Objeto de Opciones JSON: Objeto JSON que anula las opciones del gráfico.
- Color del Enlace: Color del enlace del Gráfico de Red.
- Color: Valor de color para un evento o tarea.
Tabla Dinámica
![]()
Los paneles de Tabla Dinámica muestran una tabla dinámica con información de una fuente de datos.
Tipos de controles requeridos
- Columna: Población de los encabezados de columna.
- Fila: Población de los encabezados de fila.
- Valor: Muestra los datos relevantes de la fuente.
Caso Extremo
HTML Personalizado
![]()
Los paneles de HTML Personalizado utilizan plantillas HTML/CSS para mostrar datos e imágenes. Ofrecen un alto grado de control sobre la salida de visualización y se asemejan estrechamente a una página web estándar.
Explorador de Archivos
![]()
Los paneles de Explorador de Archivos están vinculados a un sistema de archivos local o de red y se parecen a un directorio de archivos. Permiten a los usuarios cargar archivos a un servidor y descargarlos a un dispositivo. También es posible navegar dentro de subdirectorios, con los subdirectorios indicados por un ícono de carpeta.
Marco
![]()
Los paneles de Marco reservan un espacio en la pantalla donde se cargarán todos los enlaces de página clicados. El tipo de panel Marco no tiene contenido propio; cuando existe un Marco en una pantalla, cualquier navegación de página se dirige al Marco en lugar de reemplazar toda la pantalla. Este tipo de panel se utiliza con mayor frecuencia para mantener visible un menú lateral persistente mientras el contenedor del Marco renderiza la página objetivo dentro de él.
Lane
![]()
Los paneles de Lane muestran información agrupada. Son similares a los paneles de Tile en que presentan datos agrupados en formato de panel de Formulario, pero se pueden configurar de manera vertical u horizontal.