O modelo de guia atua como um contêiner para outros modelos listados abaixo, fornecendo guias na parte superior, como mostrado em Anatomia do modelo de guia.
As guias permitem alternar entre visualizações. Esse recurso é particularmente útil para organizar conteúdo ou visualizações em que os usuários vão querer navegar ou pesquisar.
Inclui:
- Barra de guias com o ícone do app e até quatro guias (sem botão "Voltar")
- Modelo incorporado, que pode ser qualquer um dos seguintes tipos:
Cada visualização de guia corresponde a um modelo incorporado, e apenas uma visualização de guia pode estar ativa por vez.
![Wireframes do modelo de guia](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tab-template.png?authuser=7&hl=pt)
Anatomia do modelo de guia
![Wireframes do modelo de guia, incluindo todos os modelos incorporados possíveis](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tab-template-fig-1.png?authuser=7&hl=pt)
O modelo de guia consiste nos seguintes elementos:
- Barra de guias, que pode mostrar até quatro guias
- Modelo incorporado, usando um dos seguintes modelos: lista, grade, pesquisa, painel, mensagem ou navegação
Exemplos de modelo de guia
![Modelo de guia com modelo de lista incorporado](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tabs_template_1.png?authuser=7&hl=pt)
![Modelo de guia com modelo de grade incorporado](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tabs_template_2.png?authuser=7&hl=pt)
Requisitos de UX do modelo de guia
Desenvolvedores de apps:
PRECISA | Fornecer ícones vetoriais monocromáticos para cada guia. |
PRECISA | Inclua pelo menos duas e no máximo quatro guias no cabeçalho do app. |
NÃO | Permita que mais de uma guia fique ativa por vez. |
NÃO | Crie uma navegação secundária adicionando um segundo nível de guias. |
DEVE | Use rótulos de tabulação curtos para evitar truncamentos. |
NÃO DEVE | Use um cabeçalho ou uma faixa de ação nos modelos incorporados. |