Un bouton d'action flottant est un bouton circulaire qui déclenche l'action principale dans l'interface utilisateur de votre application. Ce document explique comment ajouter un bouton d'action flottant à votre mise en page, personnaliser une partie de son apparence et répondre aux appuis sur les boutons.
Pour savoir comment concevoir un bouton d'action flottant pour votre application conformément aux consignes de Material Design, consultez la page sur le bouton d'action flottant pour Material Design.
Ajouter le bouton d'action flottant à votre mise en page
Le code suivant montre comment FloatingActionButton
apparaît dans votre fichier de mise en page:
<com.google.android.material.floatingactionbutton.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="end|bottom" android:src="@drawable/ic_my_icon" android:contentDescription="@string/submit" android:layout_margin="16dp" />
Par défaut, un bouton d'action flottant est coloré par l'attribut colorAccent
, que vous pouvez personnaliser avec la palette de couleurs du thème.
Vous pouvez configurer d'autres propriétés du bouton d'action flottant à l'aide d'attributs XML ou de méthodes correspondantes, telles que les suivantes:
- Taille du bouton d'action flottant, à l'aide de l'attribut
app:fabSize
ou de la méthodesetSize()
- Couleur d'ondulation du bouton d'action flottant, à l'aide de l'attribut
app:rippleColor
ou de la méthodesetRippleColor()
- Icône du bouton d'action flottant avec l'attribut
android:src
ou la méthodesetImageDrawable()
Répondre aux appuis sur les boutons
Vous pouvez ensuite appliquer un View.OnClickListener
pour gérer les boutons d'action flottants. Par exemple, le code suivant affiche un élément Snackbar
lorsque l'utilisateur appuie sur le bouton d'action flottant:
Kotlin
val fab: View = findViewById(R.id.fab) fab.setOnClickListener { view -> Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG) .setAction("Action", null) .show() }
Java
FloatingActionButton fab = findViewById(R.id.fab); fab.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG) .setAction("Action", null).show(); } });
Pour en savoir plus sur les fonctionnalités du bouton d'action flottant, consultez la documentation de référence de l'API sur le FloatingActionButton
.