Unverankerte Aktionsschaltfläche hinzufügen

Compose-Ansatz
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, mit der die primäre Aktion in der UI Ihrer App ausgelöst wird. In diesem Dokument wird gezeigt, wie Sie Ihrem Layout einen FAB hinzufügen, einige Aspekte seines Erscheinungsbilds anpassen und auf Schaltflächen-Taps reagieren.

Weitere Informationen zum Entwerfen eines FAB für Ihre App gemäß den Material Design-Richtlinien finden Sie unter Material Design FAB .

Ein Bild, auf dem ein App-Bildschirm mit einem roten FloatingActionButton zu sehen ist
Abbildung 1. Eine unverankerte Aktionsschaltfläche (UAS).

Fügen Sie Ihrem Layout die unverankerte Aktionsschaltfläche hinzu

Der folgende Code zeigt, wie der 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 colorAccent Attribut 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 FAB mit dem app:fabSize Attribut oder der setSize() Methode
  • Die Ripple-Farbe des FAB mit dem app:rippleColor Attribut oder der setRippleColor() Methode
  • Das FAB-Symbol mit dem android:src Attribut oder der setImageDrawable() Methode

Auf Schaltflächen-Taps reagieren

Sie können dann einen View.OnClickListener anwenden, um FAB-Taps zu verarbeiten. Der folgende Code zeigt beispielsweise eine Snackbar an, wenn der Nutzer auf den 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 FAB finden Sie in der API-Referenz für die FloatingActionButton.