Unverankerte Aktionsschaltfläche hinzufügen

Schreiben Sie jetzt
Jetpack Compose ist das empfohlene UI-Toolkit für Android. Informationen zum Hinzufügen von Komponenten in Compose

Eine unverankerte Aktionsschaltfläche (UAS) ist eine runde Schaltfläche, die die primäre Aktion auf der Benutzeroberfläche deiner App auslöst. In diesem Dokument wird beschrieben, wie du eine UAS in dein Layout einfügst, einige des Erscheinungsbilds anpasst und auf das Antippen von Schaltflächen reagiert.

Weitere Informationen zum Entwerfen einer UAS für deine App gemäß den Material Design-Richtlinien findest du unter Material Design FAB.

Ein Bild, das einen App-Bildschirm mit einer roten FloatingActionButton zeigt
Abbildung 1. Eine unverankerte Aktionsschaltfläche (UAS).

Unverankerte Aktionsschaltfläche zum Layout hinzufügen

Der folgende Code zeigt, wie der FloatingActionButton in der Layoutdatei aussieht:

<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" />

Standardmäßig wird eine UAS durch das Attribut colorAccent dargestellt, das du mit der Farbpalette des Designs anpassen kannst.

Du kannst andere FAB-Eigenschaften mithilfe von XML-Attributen oder entsprechenden Methoden wie den folgenden konfigurieren:

  • Die Größe der UAS mit dem Attribut app:fabSize oder der Methode setSize()
  • Die Wellenfarbe der UAS mit dem Attribut app:rippleColor oder der Methode setRippleColor()
  • Das UAS-Symbol mit dem Attribut android:src oder der Methode setImageDrawable()

Auf Tastentippen reagieren

Anschließend kannst du einen View.OnClickListener anwenden, um UAS-Tippvorgänge zu verarbeiten. Mit dem folgenden Code wird beispielsweise ein Snackbar angezeigt, wenn der Nutzer auf die UAS tippt:

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();
    }
});

Weitere Informationen zu den Funktionen der FAB findest du in der API-Referenz für die FloatingActionButton.