Découvrez les modèles de mise en page Compose et les exemples de mises en page afin de concevoir et de créer des écrans d'application uniques.
La plupart des applications utilisent une mise en page sans défilement ou avec défilement, composée des éléments suivants:
- Texte de l'heure:étant donné qu'il s'agit d'une montre, nous vous recommandons d'afficher le texte de l'heure même lors d'un parcours dans une application (facultatif, mais recommandé).
- Titre de la page:aide à l'orientation et rappels de l'étape du parcours dans laquelle se trouve l'utilisateur (facultatif, mais recommandé).
- Indicateur de défilement:uniquement sur les mises en page à défilement. Indique qu'il y a plus de contenu en dessous de la ligne de flottaison de l'écran.
- Boutons d'action: recommandés en bas de l'écran. Ils permettent de confirmer, de conclure ou de poursuivre le parcours utilisateur.
Sections de mise en page de l'application
Section supérieure
La section supérieure propose le texte de l'heure, un bouton compact et un titre servant de repère et de navigation claire. Tous ces éléments sont facultatifs.
Un bouton compact peut être utilisé dans des cas particuliers où la page est très longue. Un bouton de recherche ou d'action aidera l'utilisateur à naviguer dans la liste sans avoir à faire défiler la page jusqu'en bas.
Partie centrale
La section du milieu peut contenir n'importe quel composant Compose (hors plein écran) ou personnalisé disponible dans une liste. Cette section peut contenir des titres supplémentaires pour regrouper le contenu et la barre de défilement.
Tous les composants de la section de contenu centrale doivent être responsifs, et remplir la largeur disponible jusqu'aux marges en pourcentage. Toutes les mises en page à défilement auront un comportement de colonne à mise à l'échelle paresseuse, qui affiche la mise à l'échelle des composants et leur fondu à l'écran.
Section inférieure
La section inférieure offre de l'espace pour les boutons d'action principaux et secondaires, ou peut être laissée vide si c'est la fin d'un parcours.
Nous vous recommandons d'utiliser un bouton en forme de bouton de fin de liste, car il utilise l'espace limité et complète l'écran rond.
Plusieurs actions peuvent être nécessaires, qui peuvent apparaître dans une pile de boutons ou un groupe de boutons à deux icônes.
Vues d'application sans défilement
Avec titre
Sans titre
Avec un titre et sans section inférieure
Sans titre ni section inférieure
Vues d'application à faire défiler
Avec titre
Sans titre
Avec un titre et sans section inférieure
Sans titre ni section inférieure