Utilisez des mises en page canoniques comme point de départ. Il s'agit de compositions prêtes à l'emploi qui aident les mises en page à s'adapter aux cas d'utilisation et aux tailles d'écran courants. Ces mises en page sont à la fois esthétiques et fonctionnelles, et sont inspirées des consignes Material 3.
Le framework Android inclut des composants spécialisés qui permettent d'implémenter ces mises en page de manière simple et fiable, à l'aide des API Jetpack Compose ou Views.
Mise en page liste/détails
Cette mise en page permet aux utilisateurs d'explorer une liste d'éléments ainsi que des informations descriptives, explicatives ou complémentaires sur ces derniers sous forme de vue détaillée. Pour les petits écrans, seule la liste ou la vue détaillée sont visibles. Les listes constituent la forme de mise en page la plus courante pour les applications. Elles permettent d'afficher une collection de contenus dans une mise en page basée sur des lignes. La mise en page "Liste et vue détaillée" est idéale pour les applications de messagerie, les gestionnaires de contacts, les explorateurs de fichiers et toute application dont le contenu peut être organisé sous la forme d'une liste d'éléments et d'une vue détaillée avec des informations supplémentaires.
Le contenu peut être statique ou dynamique.
- Le contenu dynamique est un contenu que votre application diffuse à la volée. Il est idéal pour afficher du contenu généré par l'utilisateur ou refléter les préférences ou les actions de l'utilisateur. Imaginez, par exemple, une application photo avec une liste déroulante de photos générées par les utilisateurs. Cette liste est unique pour chaque utilisateur et change à mesure qu'il importe des images. Ces images sont du contenu dynamique.
- Le contenu statique représente le contenu codé en dur, qui ne peut être modifié qu'en apportant des modifications directement au code de votre application. Les images et le texte que tous les utilisateurs peuvent voir sont des exemples de contenu statique.
Le fichier Figma Now in Android fournit plusieurs exemples de mise en page. L'exemple suivant montre une collection de contenu unidimensionnelle.
Consultez Listes Material 3 pour obtenir plus de conseils de conception sur les composants et les spécifications des listes.
Mise en page du flux
Une mise en page de type "Flux" organise des éléments de contenu équivalents dans une grille configurable afin d'afficher rapidement et facilement une grande quantité de contenu. Pour en savoir plus, consultez les consignes Material 3 sur l'utilisation des cartes dans une collection. Les flux peuvent être configurés sous forme de liste ou de grille sur des écrans compacts, généralement dans des cartes ou des vignettes. Le contenu peut être dynamique, c'est-à-dire qu'il est "fourni" à partir d'une source externe dynamique telle qu'une API.
Une mise en page en grille est composée de lignes et de colonnes, qui sont elles-mêmes composées de principes de confinement implicites ou explicites. Une mise en page en grille peut être appliquée de manière plus rigide ou échelonnée pour varier les lignes et les colonnes. L'espacement et la logique doivent être appliqués de manière cohérente pour éviter de dérouter les utilisateurs. Consultez les consignes Material 3 sur la conception des flux.
Vous pouvez implémenter une mise en page de flux dans Compose avec des listes ou des grilles paresseuses, ou dans Views avec RecyclerView ou CardView.
Par exemple, une galerie photo et des podcasts dans une mise en page en grille sont des formats de flux courants.
Mise en page du volet d'assistance
Une vue mobile peut nécessiter des contenus ou des commandes supplémentaires. Généralement sous la forme de feuilles ou de boîtes de dialogue, ils peuvent aider la vue principale à rester concentrée et épurée. Consultez les conseils M3 pour utiliser la mise en page canonique du volet d'assistance.
En savoir plus sur les conseils M3 pour les feuilles inférieures