Créez des mises en page de widgets efficaces en identifiant d'abord votre contenu principal. Votre mise en page détermine l'organisation des informations et des éléments interactifs dans votre widget. Android propose plusieurs mises en page prédéfinies pour les barres d'outils, le texte, les listes et les widgets de type grille afin de simplifier ce processus.
Texte
Les mises en page de texte sont idéales pour afficher des informations concises. Améliorez l'attrait visuel de votre widget en incluant éventuellement une image à côté du texte.
Idéal pour les titres, les mises à jour de l'état, les descriptions courtes ou tout scénario où une seule ligne de texte transmet efficacement le message.
Incluez une image pour un impact visuel accru. Pour en savoir plus, consultez Points d'arrêt pour découvrir comment adapter cette mise en page à différentes tailles d'écran.
Barres d'outils
Utilisez des mises en page de barre d'outils pour permettre aux utilisateurs d'accéder rapidement aux tâches fréquemment utilisées dans votre application, dans une mise en page flexible qui s'adapte aux différentes tailles de widget.
Une mise en page de barre d'outils de recherche est intentionnellement conçue pour attirer l'attention sur la recherche en tant qu'action principale de la barre d'outils. Des boutons pratiques supplémentaires peuvent permettre d'accéder rapidement aux fonctions fréquemment utilisées.
Les barres d'outils présentent la marque de l'application, suivie de boutons pour les tâches les plus utilisées qui sont idéales pour les paramètres activables/désactivables ou les liens de tâches. Lors du redimensionnement, les options moins utilisées peuvent être masquées au profit d'actions plus courantes. Utilisez points d'arrêt pour ajouter un nouveau bouton cliquable de 48 dp minimum lorsqu'il y a de la place.
Listes
Utilisez des mises en page de liste pour organiser plusieurs éléments dans un format clair et facile à parcourir. Cette solution est idéale pour les titres d'actualités, les listes de tâches ou les messages. Organisez le contenu dans une liste structurée et facile à parcourir. Choisissez entre une présentation conteneurisée ou sans conteneur en fonction de vos besoins en contenu.
Les listes de textes et d'images faciles à parcourir sont parfaites pour présenter plusieurs types de contenu, tels que des titres d'actualités, des playlists avec des pochettes d'album ou des messages.
La mise en page de la checklist est idéale pour afficher des tâches, en fournissant des cibles claires sur lesquelles les utilisateurs peuvent appuyer pour marquer rapidement des éléments comme terminés.
Fournissez un regroupement de commandes intuitif avec des listes d'actions, où les états visuels activé/désactivé fournissent un feedback immédiat sur l'état des éléments.
Idéale pour présenter des images immersives plein format sur Android 17 et versions ultérieures, cette mise en page utilise le défilement par accrochage pour s'assurer que chaque élément enfant s'aligne parfaitement sur la hauteur du conteneur de widget.
Grille
Présentez des images dans une grille compacte, flexible et visuellement riche avec des libellés facultatifs. Utilisez des colonnes et des lignes qui s'adaptent à différentes tailles d'écran.
Créez des galeries d'images défilantes à fort impact visuel à l'aide de grilles d'images uniquement. Les lignes et les colonnes s'adaptent automatiquement à différentes tailles d'écran pour une présentation optimale.
Vous pouvez également intégrer des libellés et des descriptions textuels, ce qui enrichit le contenu de votre grille d'images avec un contexte et des informations supplémentaires.
Exemples de code
Le tableau suivant mappe chaque mise en page canonique à son implémentation Jetpack Glance correspondante dans le dépôt GitHub Android Platform Samples.
| Mise en page canonique | Catégorie de mise en page | Exemple de fichier d'implémentation |
|---|---|---|
| Texte uniquement | Texte | LongTextAppWidget.kt |
| Textes et images | Texte | TextWithImageAppWidget.kt |
| Barre d'outils de recherche | Barres d'outils | SearchToolBarAppWidget.kt |
| Barre d'outils (standard) | Barres d'outils | ToolBarAppWidget.kt |
| Liste de textes et d'images | Listes | ImageTextListAppWidget.kt |
| Checklist | Listes | CheckListAppWidget.kt |
| Liste d'actions | Listes | ActionListAppWidget.kt |
| Défilement par accrochage plein format | Listes | FullBleedImageAppWidget.kt |
| Image uniquement | Grille | ImageGridAppWidget.kt |
| Image et texte | Grille | ImageGridAppWidget.kt |