Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
La plantilla de pestaña actúa como un contenedor para las plantillas que se enumeran a continuación y proporciona pestañas en la parte superior (como se muestra en Anatomía de la plantilla de pestaña).
Las pestañas permiten alternar entre las vistas. Esta función es particularmente útil para organizar el contenido o las vistas que los usuarios querrán explorar o buscar.
Incluye lo siguiente:
Barra de pestañas con el ícono de la app y hasta 4 pestañas (sin botón Atrás)
Plantilla incorporada, que puede ser de cualquiera de los siguientes tipos:
Cada vista de pestaña corresponde a una plantilla incorporada y solo puede estar activa una vista de pestaña a la vez.
Anatomía de la plantilla de la pestaña
La plantilla de pestaña consta de los siguientes elementos:
Barra de pestañas, que puede mostrar hasta 4 pestañas
Plantilla incorporada, con una de las siguientes plantillas: Lista, Cuadrícula, Búsqueda, Panel, Mensaje o Navigation
Ejemplos de plantillas de pestaña
La vista de la pestaña "Todos los dispositivos" se crea con una plantilla de pestaña que contiene una plantilla de lista (ejemplo de Android Auto)La vista de la pestaña "Dispositivos de la casa" se crea con una plantilla de pestaña que contiene una plantilla de cuadrícula (ejemplo de Android Auto).
Requisitos de UX de la plantilla de pestaña
Desarrolladores de apps:
DEBE
Proporciona íconos vectoriales monocromáticos para cada pestaña.
DEBE
Incluye al menos 2 pestañas y no más de 4 en el encabezado de la app.
NO DEBE
Permite que haya más de 1 pestaña activa a la vez.
NO DEBE
Agrega un segundo nivel de pestañas para crear una navegación secundaria.
DEBES
Usa etiquetas de tabulación cortas para evitar que se trunque.
NO DEBES
Utiliza un encabezado o una barra de acciones en las plantillas incorporadas.
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2024-07-23 (UTC)"],[[["The Tab template serves as a container for other templates, organizing content into a tabbed interface."],["It supports embedding List, Grid, Search, Pane, Message, or Navigation templates within each tab."],["Apps should utilize 2-4 tabs with monochromatic icons and concise labels for optimal usability."],["Only one tab can be active at a time, and embedded templates should avoid using their own headers."],["Tab templates are ideal for creating switchable views for content browsing or searching within an app."]]],[]]