Les boutons permettent à l'utilisateur de déclencher une action définie. Il existe cinq types de boutons:
Type |
Apparence |
Objectif |
---|---|---|
Rempli | Arrière-plan uni avec texte contrasté |
Pour les actions principales, telles que "Envoyer" et "Enregistrer". L'effet d'ombre met en avant l'importance du bouton. |
Tonal | La couleur d'arrière-plan varie pour correspondre à la surface. |
Pour les actions principales ou importantes. Les boutons remplis apportent du poids visuel et sont adaptés à des actions telles que "Ajouter au panier" et "Se connecter". |
Élevée | L'ombre le fait ressortir. |
Pour les actions principales ou importantes. Augmentez l'élévation pour rendre le bouton plus visible. |
Contours | Comporte une bordure sans remplissage. |
Pour les actions importantes, mais non principales. Les boutons avec contours se marient bien avec d'autres boutons pour indiquer des actions secondaires alternatives, comme "Annuler" ou "Retour". |
Texte | Texte sans arrière-plan ni bordure. |
Pour les actions moins critiques, comme les liens de navigation ou les actions secondaires telles que "En savoir plus" ou "Afficher les détails". |
Compatibilité des versions
Cette implémentation nécessite que la version minimale du SDK de votre projet soit définie sur le niveau d'API 21 ou supérieur.
Dépendances
Créer un bouton rempli
Le composant de bouton rempli utilise le composable de base Button
. Par défaut, il est rempli d'une couleur unie.
Résultats
Créer un bouton tonal rempli
Le composant de bouton tonal rempli utilise le composable FilledTonalButton
.
Par défaut, il est rempli d'une couleur tonale.
Résultats
Créer un bouton avec contour
Le composant de bouton avec contour utilise le composable OutlinedButton
. Il s'affiche avec un contour par défaut.
Résultats
Créer un bouton surélevé
Le composant de bouton surélevé utilise le composable ElevatedButton
. Il comporte une ombre qui représente l'effet d'élévation par défaut et s'affiche sous la forme d'un bouton avec un contour et une ombre.
Résultats
Créer un bouton textuel
Le composant de bouton de texte utilise le composable TextButton
. Tant qu'il n'a pas été cliqué, il ne s'affiche que sous forme de texte. Il n'a pas de remplissage ni de contour solides par défaut.
Résultats
Points essentiels
onClick
: fonction appelée lorsque l'utilisateur appuie sur le bouton.enabled
: lorsque ce paramètre est défini sur "false", le bouton apparaît indisponible et inactif.colors
: instance deButtonColors
qui détermine les couleurs utilisées dans le bouton.contentPadding
: marge intérieure du bouton.
Collections contenant ce guide
Ce guide fait partie de ces collections de guides rapides sélectionnées qui couvrent des objectifs de développement Android plus larges: