Tabs divide una sección de pantalla en paneles de contenido intercambiables: el usuario toca un encabezado de pestaña y el panel inferior se actualiza para coincidir.

Añadir, eliminar y seleccionar pestañas

Cada pestaña tiene dos partes:

• Encabezado de pestaña — la etiqueta en la que se hace clic (Tab 1, Tab 2, etc.).
• Contenido de pestaña — un contenedor por pestaña. Lo que pongas en un contenedor de contenido aparece cuando se selecciona esa pestaña.

Haz clic en Add tab para añadir una nueva pestaña. Cada nueva pestaña genera su propio contenedor de contenido.

Para que una pestaña concreta esté activa al cargar la pantalla, activa Selected by default.

Dar estilo a las pestañas

Plantillas

El Flow Builder ofrece tres plantillas de pestañas listas para usar:

• Segment control — un selector con forma de píldora y esquinas redondeadas alrededor de la pestaña seleccionada.
• Button Tabs — pestañas con estilo de botón independientes.
• Underline — etiquetas de texto con un subrayado que marca la pestaña seleccionada.

Estados de las pestañas

Cada pestaña tiene un selector de estado (Default / Selected) para aplicar estilos distintos al estado activo e inactivo: tipografía, colores, relleno y borde por estado.

Grupo seleccionable

Las pestañas son un grupo seleccionable de elección única — exactamente una pestaña está activa a la vez. Gestiona el grupo desde el panel Screen settings, en la sección Selectable groups.

El grupo expone dos variables:

• tabs.selectedOptionId — el ID de la pestaña seleccionada. Úsalo en condiciones.
• tabs.selectedOptionTitle — la etiqueta de la pestaña seleccionada. Úsalo en texto dinámico.

Reemplaza tabs con tu Group ID personalizado si renombraste el grupo.

Consulta Selectable elements and groups para ver el panorama completo.