Функция FloatingActionButton

Функция FloatingActionButton рисует круглую акцентную кнопку обычного размера. Нажатие обрабатывает параметр onClick, иконку передают в лямбду content через Icon из Icons.Filled с contentDescription.

Синтаксис

FloatingActionButton(onClick = { }) {
	Icon(
		imageVector = Icons.Filled.Add,
		contentDescription = "abcde",
	)
}

Параметры

Параметр	Описание
`onClick`	Лямбда без аргументов. Срабатывает, когда пользователь нажал кнопку.
`content`	Лямбда с иконкой внутри. Обычно вызывают `Icon` с `Icons.Filled` и `contentDescription`.

Пример

Давайте выведем одну плавающую кнопку:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.Icon

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			FloatingActionButton(onClick = { }) {
				Icon(
					imageVector = Icons.Filled.Add,
					contentDescription = "abcde",
				)
			}
		}
	}
}

На экране появится круглая залитая кнопка с иконкой плюса.

Пример

Давайте сравним её с малой плавающей кнопкой:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Row
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.Icon
import androidx.compose.material3.SmallFloatingActionButton

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			Row {
				FloatingActionButton(onClick = { }) {
					Icon(
						imageVector = Icons.Filled.Add,
						contentDescription = "abcde",
					)
				}
				SmallFloatingActionButton(onClick = { }) {
					Icon(
						imageVector = Icons.Filled.Add,
						contentDescription = "12345",
					)
				}
			}
		}
	}
}

На экране слева будет кнопка обычного размера, справа - заметно меньше при той же иконке.

Смотрите также

функция SmallFloatingActionButton,
которая рисует малую плавающую кнопку
функция LargeFloatingActionButton,
которая рисует большую плавающую кнопку
функция ExtendedFloatingActionButton,
которая добавляет к иконке текст
функция IconButton,
которая тоже принимает одну иконку