Кнопка плавающего действия (FAB) — это круглая кнопка, которая запускает основное действие в пользовательском интерфейсе вашего приложения. В этом документе показано, как добавить FAB в макет, настроить его внешний вид и реагировать на нажатия кнопок.
Чтобы узнать больше о том, как спроектировать FAB для вашего приложения в соответствии с Руководством по Material Design Guidelines, см. Material Design FAB .
![Изображение экрана приложения с красной кнопкой FloatingActionButton.](https://developer.android.com/static/training/material/images/fab.png?hl=ru)
Добавьте кнопку плавающего действия в свой макет
Следующий код показывает, как FloatingActionButton
отображается в файле макета:
<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" />
По умолчанию FAB окрашивается атрибутом colorAccent
, который вы можете настроить с помощью цветовой палитры темы .
Вы можете настроить другие свойства FAB, используя атрибуты XML или соответствующие методы, например следующие:
- Размер FAB с использованием атрибута
app:fabSize
или методаsetSize()
- Волнистый цвет FAB с использованием атрибута
app:rippleColor
или методаsetRippleColor()
- Значок FAB с использованием атрибута
android:src
или методаsetImageDrawable()
Реагировать на нажатия кнопок
Затем вы можете применить View.OnClickListener
для обработки нажатий FAB. Например, следующий код отображает Snackbar
, когда пользователь нажимает FAB:
Котлин
val fab: View = findViewById(R.id.fab) fab.setOnClickListener { view -> Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG) .setAction("Action", null) .show() }
Ява
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(); } });
Дополнительные сведения о возможностях FAB см. в справочнике API для FloatingActionButton
.