Le modèle d'onglet sert de conteneur aux autres modèles répertoriés ci-dessous, en fournissant des onglets en haut de la page (comme illustré dans la section Anatomie du modèle d'onglet).
Les onglets permettent de passer d'une vue à l'autre. Cette fonctionnalité est particulièrement utile pour organiser les contenus ou les vues que les utilisateurs voudront parcourir ou rechercher.
Inclut:
- Barre d'onglets avec l'icône de l'application et jusqu'à quatre onglets (pas de bouton "Retour")
- Modèle intégré, qui peut être de l'un des types suivants :
Chaque onglet correspond à un modèle intégré, et une seule vue d'onglet peut être active à la fois.
![Maquettes fonctionnelles du modèle d'onglet](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tab-template.png?authuser=5&hl=fr)
Anatomie du modèle d'onglet
![Maquettes fonctionnelles du modèle d'onglet, y compris tous les modèles intégrés possibles](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tab-template-fig-1.png?authuser=5&hl=fr)
Le modèle d'onglet comprend les éléments suivants:
- La barre d'onglets, qui peut afficher jusqu'à quatre onglets
- Modèle intégré, utilisant l'un des modèles suivants: Liste, Grille, Recherche, Volet, Message ou Navigation
Exemples de modèles d'onglets
![Modèle d'onglet avec modèle de liste intégré](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tabs_template_1.png?authuser=5&hl=fr)
![Modèle d'onglet avec modèle de grille intégré](https://developers.google.cn/static/cars/design/create-apps/apps-for-drivers/templates/images/tabs_template_2.png?authuser=5&hl=fr)
Exigences concernant l'expérience utilisateur des modèles d'onglets
Développeurs d'applications:
OBLIGATOIRE | Fournissez des icônes vectorielles monochromes pour chaque onglet. |
OBLIGATOIRE | Incluez au moins deux et pas plus de quatre onglets dans l'en-tête de l'application. |
NE DOIT PAS | Autorisez l'activation de plusieurs onglets à la fois. |
NE DOIT PAS | Créez une navigation secondaire en ajoutant un deuxième niveau d'onglets. |
DOIT | Utilisez des libellés d'onglet court pour éviter la troncation. |
NE DOIT PAS | Appuyez-vous sur un en-tête ou une bande d'actions dans les modèles intégrés. |