Unverankerte Aktionsschaltfläche hinzufügen

Compose ausprobieren

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

Unverankerter Aktionsbutton →

Ein unverankerter Aktionsbutton (UAB) ist ein runder Button, mit dem die primäre Aktion in der Benutzeroberfläche Ihrer App ausgelöst wird. In diesem Dokument wird beschrieben, wie Sie Ihrem Layout einen schwebenden Aktionsbutton hinzufügen, sein Aussehen anpassen und auf Button-Taps reagieren.

Weitere Informationen zum Entwerfen eines schwebenden Aktionsschaltfläche für Ihre App gemäß den Material Design-Richtlinien finden Sie unter Schwebende Aktionsschaltfläche in Material Design.

Abbildung 1. Ein unverankerter Aktionsbutton (UAB).

Unverankerten Aktionsbutton in das Layout einfügen

Der folgende Code zeigt, wie das Element FloatingActionButton in Ihrer 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 ein FAB mit dem Attribut colorAccent eingefärbt, das Sie mit der Farbpalette des Designs anpassen können.

Sie können andere FAB-Attribute mit XML-Attributen oder entsprechenden Methoden konfigurieren, z. B.:

• Die Größe des schwebenden Aktionsschaltfläche (FAB) mit dem Attribut app:fabSize oder der Methode setSize()
• Die Farbe des Ripples des schwebenden Aktionsschaltfläche mit dem Attribut app:rippleColor oder der Methode setRippleColor()
• Das Symbol für das schwebende Aktionsschaltfläche mit dem Attribut android:src oder der Methode setImageDrawable()

Auf Schaltflächen-Taps reagieren

Anschließend können Sie ein View.OnClickListener anwenden, um Tippen auf den FAB zu verarbeiten. Im folgenden Code wird beispielsweise ein Snackbar angezeigt, wenn der Nutzer auf das FAB 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 des schwebenden Aktionsschalters finden Sie in der API-Referenz für FloatingActionButton.