Unverankerte Aktionsschaltfläche hinzufügen

Compose ausprobieren

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

Unverankerte Aktionsschaltfläche →

Eine unverankerte Aktionsschaltfläche (Floating Action Button, FAB) ist eine runde Schaltfläche, die die primäre Aktion in der Benutzeroberfläche Ihrer 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 FAB für Ihre App gemäß den Material Design-Richtlinien finden Sie unter Material Design-FAB.

Abbildung 1. Eine unverankerte Aktionsschaltfläche (Floating Action Button, FAB).

Unverankerte Aktionsschaltfläche zum Layout hinzufügen

Im folgenden Code wird gezeigt, wie FloatingActionButton in Ihrer Layoutdatei angezeigt wird:

<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 durch das colorAccent-Attribut eingefärbt. Sie können es mit der Farbpalette des Designs anpassen.

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

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

Auf Tastendruck 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.