Skip To Content

Agregar y conectar widgets

Agregue widgets funcionales y de diseño a las aplicaciones que cree con Experience Builder. Puede aceptar estilos predeterminados o personalizar la apariencia y conectar widgets a datos, vínculos y otros widgets para disfrutar de una experiencia web única.

Insertar widgets

Los widgets son los bloques de construcción de sus aplicaciones. Si no utiliza widgets en las diversas plantillas disponibles para páginas, ventanas, grupos de pantallas y bloques, puede agregar widgets del panel Insertar widget mediante el método de arrastrar y soltar. Los widgets Marcador de posición y Controlador de widget, así como los paneles de desplazamiento de un grupo de pantallas, también tienen un botón Agregar widget. Los widgets se agrupan en las categorías básica y de diseño. Los widgets básicos son widgets funcionales que pueden comportarse como herramientas de aplicaciones y los widgets de diseño son los contenedores para organizar widgets en la página.

Cuando agregue y anide widgets, puede basarse en la vista contorno interactiva de cada página, que muestra la jerarquía de widgets para la página y le ayuda a organizar, seleccionar y configurar widgets anidados. En el contorno, haga clic en un widget y, a continuación, en el botón Más para ver un menú de operaciones del widget como, por ejemplo, cambiar el nombre, duplicar, eliminar, posición de bloqueo y tamaño, chincheta, organizar y alinear. Utilice los accesos directos estándar del teclado de copiar/pegar (Ctrl+C y Ctrl+V para Windows; Cmd-C y Cmd-V para Mac) para copiar widgets en páginas. Al duplicar o copiar un widget, se conservan todos sus ajustes, excepto la posición de la página.

La pestaña Pendiente en el panel Insertar widget resulta útil cuando necesita diseñar su aplicación para varios tamaños de pantalla. Por ejemplo, podría haber un requisito de diseño donde el widget de mapa se implemente en tamaños de pantalla grandes y medianos, aunque no en tamaños de pantalla pequeños. En este caso, podría quitar el widget de mapa del diseño de tamaño de pantalla pequeño y agregarlo a la lista de pendientes.

Conectar widgets

El panel de configuración de widget incluye los ajustes Contenido, Estilo y Acción. Contenido define el comportamiento, conexiones de datos y otros ajustes del widget. Los widgets se alinean y diseñan en la pestaña Estilo con ajustes como el tamaño, la posición, la animación, el fondo, el borde y la sombra del cuadro. La ubicación de los paneles de widget se recuerda en la aplicación en vivo. También puede utilizar las barras de herramientas del widget para alinear, eliminar o duplicar widgets.

Algunos widgets permiten agregar un desencadenador de acción que permite la comunicación entre widgets, es decir, un widget desencadena una acción en otro widget. Por ejemplo, haga clic en una entidad de mapa para actualizar los detalles de la entidad mostrados en el widget Información de entidades. Puede combinar herramientas y widgets, y conectarlos para obtener interactividad adicional. Ayude a los usuarios finales a navegar por su aplicación definiendo vínculos en páginas, ventanas y vistas de sección.

Definir vínculos

Puede agregar un hipervínculo a su contenido con la opción Definir vínculo que le permite dirigir a usuarios finales a otra página, ventana o vista de sección en su aplicación o en otra dirección web. Los siguientes widgets permiten establecer un vínculo:

Ajustes

Al establecer un vínculo, puede elegir entre las siguientes opciones:

  • Página: vínculo que dirige a una página diferente en su aplicación.
  • Vista: vínculo que dirige a una vista específica en un widget Sección.
  • Ventana: vínculo que abre una ventana específica en su aplicación.
  • Dirección web: vínculo que dirige a una dirección web; debe especificar una URL.

También puede decidir dónde debe abrirse el contenido vinculado:

  • Ventana de aplicación: el contenido vinculado se abre en la ventana del navegador actual que utiliza su aplicación.
  • Ventana superior: el contenido vinculado se sitúa fuera de todos los cuadros en los que está anidado y se abre en la parte superior de otras ventanas abiertas.
  • Nueva ventana: el contenido vinculado se abre en una nueva ventana del navegador, manteniendo la aplicación abierta en otra ventana.