Material Design est un guide complet pour la conception visuelle, des mouvements et des interactions sur différentes plates-formes et différents appareils. Pour utiliser Material Design dans vos applications Android, suivez les consignes définies dans la spécification Material Design. Si votre application utilise Jetpack Compose, vous pouvez utiliser la bibliothèque Compose Material 3. Si votre application utilise des vues, vous pouvez utiliser la bibliothèque Android Material Components.
Android fournit les fonctionnalités suivantes pour vous aider à créer des applications Material Design :
- Un thème d'application Material Design pour styliser tous vos widgets d'interface utilisateur
- Des widgets pour les vues complexes, telles que les listes et les fiches
- Des API pour les ombres et les animations personnalisées
Thème et widgets Material
Pour profiter des fonctionnalités Material, telles que la stylisation des widgets d'interface utilisateur standards, et pour simplifier la définition du style de votre application, appliquez-lui un thème basé sur Material.
Si vous utilisez Android Studio pour créer votre projet Android, il applique un thème Material par défaut. Pour savoir comment mettre à jour le thème de votre projet, consultez Styles et thèmes.
Pour offrir à vos utilisateurs une expérience familière, utilisez les modèles UX les plus courants de Material :
- Mettez en avant l'action principale de votre interface utilisateur à l'aide d'un bouton d'action flottant (FAB).
- Affichez votre marque, la navigation, la recherche et d'autres actions à l'aide de la barre d'application.
- Affichez et masquez la navigation de votre application à l'aide du panneau de navigation.
- Choisissez parmi les nombreux autres composants Material pour la mise en page et la navigation de votre application, tels que les barres d'outils pliables, les onglets, une barre de navigation inférieure, etc. Pour les voir tous, consultez le catalogue des composants Material pour Android.
Utilisez autant que possible des icônes Material prédéfinies. Par exemple, pour le bouton de menu de navigation de votre panneau de navigation, utilisez l'icône "hamburger" standard. Consultez la page Icônes Material Design pour obtenir la liste des icônes disponibles. Vous pouvez également importer des icônes SVG à partir de la bibliothèque d'icônes Material avec Vector Asset Studio d'Android Studio.
Ombres d'élévation et fiches
En plus des propriétés X et Y, les vues dans Android ont une propriété Z. Cette propriété représente l'élévation d'une vue, qui détermine les éléments suivants :
- La taille de son ombre : les vues avec des valeurs Z plus élevées projettent des ombres plus grandes.
- L'ordre de dessin : les vues avec des valeurs Z plus élevées apparaissent au-dessus des autres vues.
Vous pouvez appliquer une élévation à une mise en page basée sur des fiches, ce qui vous permet d'afficher des informations importantes dans des fiches qui offrent un aspect Material. Vous pouvez utiliser le widget CardView pour créer des fiches avec une élévation par défaut. Pour en savoir plus, consultez
Créer une mise en page basée sur des fiches.
Pour savoir comment ajouter une élévation à d'autres vues, consultez Créer des ombres et des vues de clip.
Animations
Les API d'animation vous permettent de créer des animations personnalisées pour le retour tactile dans les commandes d'interface utilisateur, les modifications de l'état de la vue et les transitions d'activité.
Ces API vous permettent d'effectuer les opérations suivantes :
- Répondre aux événements tactiles dans vos vues avec des animations de retour tactile.
- Masquer et afficher des vues avec des animations de révélation circulaire.
- Passer d'une activité à l'autre avec des animations de transition d'activité personnalisées.
- Créer des animations plus naturelles avec un mouvement courbe.
- Animer les modifications d'une ou de plusieurs propriétés de vue avec des animations de modification de l'état de la vue.
- Afficher des animations dans des drawables de liste d'états entre les modifications de l'état de la vue.
Les animations de retour tactile sont intégrées à plusieurs vues standards, telles que les boutons. Les API d'animation vous permettent de personnaliser ces animations et de les ajouter à vos vues personnalisées.
Pour en savoir plus, consultez Présentation des animations.
Drawables
Ces fonctionnalités pour les drawables vous aident à implémenter des applications Material Design :
- Les drawables vectoriels sont évolutifs sans perte de définition et sont parfaits pour les icônes d'application unicolores. En savoir plus sur les drawables vectoriels.
- La coloration des drawables vous permet de définir des bitmaps comme masque alpha et de les colorer avec une couleur au moment de l'exécution. Découvrez comment ajouter une teinte aux drawables.
- L'extraction de couleurs vous permet d'extraire automatiquement les couleurs dominantes d'une image bitmap. Découvrez comment sélectionner des couleurs avec l'API Palette.