Widget Navegación de vistas

El widget Navegación de vistas proporciona pestañas para que los usuarios finales accedan a las vistas en un widget Sección. Cuando los usuarios acceden a las vistas de la sección, solo se actualiza el contenido de la sección en lugar de toda la página, lo que permite mejorar el rendimiento de la aplicación.

Ejemplo

Use este widget para apoyar los requisitos de diseño de la aplicación como por ejemplo los siguientes:

  • Crea varias vistas de contenido similar en un widget Sección para evitar demasiado desplazamiento en su aplicación. Incluya un widget Navegación de vistas para que los usuarios puedan hacer clic en pestañas con el fin de actualizar el contenido de la sección y acceder a las vistas.

Notas de uso

La página debe tener un widget Sección con el que pueda vincular el widget Navegación de vistas. Debe colocar el widget fuera de la sección; no puede anidar el widget Navegación de vistas en su widget Sección correspondiente. Por ejemplo, coloque el widget por encima o por debajo de una sección (ideal para pestañas horizontales) o en la parte izquierda o derecha de una sección (ideal para pestañas verticales).

Puede incluir todas las vistas de la sección o vistas específicas. Para especificar la secuencia de las vistas, abra el panel de configuración del widget Sección y arrastre las vistas en el orden que desea que aparezcan en el widget Navegación de vistas. También puede editar los nombres de vistas en los ajustes del widget Sección.

Ajustes

El widget Navegación de vistas incluye estos ajustes:

  • Vincular con: seleccione un widget de sección desde la página.
  • Vistas: defina las vistas que se mostrarán en el widget seleccionando una de las siguientes opciones:
    • Automático: incluya pestañas para todas las vistas de la sección.
    • Personalizado: incluya pestañas para vistas específicas de la sección.
  • Estilo: seleccione entre las opciones de diseño de pestañas: Predeterminado, Subrayado o Píldoras.
  • Dirección: muestre las pestañas horizontal o verticalmente.
  • Fondo: cambie el color de fondo del widget.
  • Estados: cambie la apariencia de las pestañas para proporcionar a los usuarios una indicación visual cuando sitúen el cursor sobre una pestaña o la seleccionen. Por ejemplo, cambie los colores del texto y del borde para el estado Seleccionado.
Sugerencia:

Para experimentar con estas opciones, haga clic en Vista en directo en la barra de herramientas del builder.