Dodaj pływający przycisk polecenia

Wypróbuj sposób tworzenia wiadomości
Jetpack Compose to zalecany zestaw narzędzi interfejsu na Androida. Dowiedz się, jak dodawać komponenty w sekcji Tworzenie.

Pływający przycisk polecenia (FAB) to okrągły przycisk, który uruchamia główne działanie w interfejsie aplikacji. Z tego dokumentu dowiesz się, jak dodać przycisk szybkiego działania do układu, dostosować jego wygląd i zareagować na jego kliknięcia.

Więcej informacji o tym, jak zaprojektować przycisk PPP w aplikacji zgodnie z wytycznymi Material Design, znajdziesz w sekcji Material Design.

Obraz pokazujący ekran aplikacji z czerwonym przyciskiem FloatingActionButton
Rysunek 1. pływający przycisk polecenia (FAB).

Dodawanie pływającego przycisku polecenia do układu

Ten kod pokazuje, jak FloatingActionButton wygląda w pliku układu:

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

Domyślnie przycisk FAB jest kolorowany za pomocą atrybutu colorAccent, który możesz dostosowywać za pomocą palety kolorów motywu.

Inne właściwości FAB możesz konfigurować za pomocą atrybutów XML lub odpowiednich metod, takich jak:

  • Rozmiar przycisku PPP za pomocą atrybutu app:fabSize lub metody setSize()
  • Kolor falowania przycisku FAB, który można określić za pomocą atrybutu app:rippleColor lub metody setRippleColor().
  • Ikona przycisku szybkiego dostępu, która używa atrybutu android:src lub metody setImageDrawable()

Reaguj na kliknięcia przycisku

Następnie możesz zastosować funkcję View.OnClickListener, aby obsługiwać kliknięcia przycisku FAB. Na przykład po kliknięciu przez użytkownika przycisku szybkiego działania wyświetla się ten kod:Snackbar.

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

Więcej informacji o możliwościach przycisku FAB znajdziesz w dokumentacji interfejsu API FloatingActionButton.