Закусочная

Компонент «Снэк-бар» представляет собой краткое уведомление, которое отображается в нижней части экрана. Он предоставляет обратную связь о выполнении операции или действия, не прерывая работу пользователя. Снэк-бары исчезают через несколько секунд. Пользователь также может закрыть их, выполнив действие, например, нажав кнопку.

Рассмотрим три варианта использования снек-бара:

• Подтверждение действия: после того, как пользователь удаляет электронное письмо или сообщение, появляется панель для подтверждения действия и предлагается опция «Отменить».
• Состояние сети: когда приложение теряет подключение к Интернету, появляется всплывающая панель с уведомлением о том, что оно теперь находится в автономном режиме.
• Отправка данных: после успешной отправки формы или обновления настроек панель уведомлений отобразит, что изменение успешно сохранено.

Простой пример

Чтобы реализовать снэк-бар, сначала создайте SnackbarHost , включающий свойство SnackbarHostState . SnackbarHostState предоставляет доступ к функции showSnackbar() , которую можно использовать для отображения снэк-бара.

Эта функция приостановки требует CoroutineScope , например, при использовании rememberCoroutineScope , и может вызываться в ответ на события пользовательского интерфейса для отображения Snackbar в Scaffold .

val scope = rememberCoroutineScope()
val snackbarHostState = remember { SnackbarHostState() }
Scaffold(
    snackbarHost = {
        SnackbarHost(hostState = snackbarHostState)
    },
    floatingActionButton = {
        ExtendedFloatingActionButton(
            text = { Text("Show snackbar") },
            icon = { Icon(Icons.Filled.Image, contentDescription = "") },
            onClick = {
                scope.launch {
                    snackbarHostState.showSnackbar("Snackbar")
                }
            }
        )
    }
) { contentPadding ->
    // Screen content
}
MaterialLayoutSnippets.kt

Закусочная с действием

Вы можете указать необязательное действие и настроить продолжительность показа Snackbar . Функция snackbarHostState.showSnackbar() принимает дополнительные параметры actionLabel и duration и возвращает SnackbarResult .

val scope = rememberCoroutineScope()
val snackbarHostState = remember { SnackbarHostState() }
Scaffold(
    snackbarHost = {
        SnackbarHost(hostState = snackbarHostState)
    },
    floatingActionButton = {
        ExtendedFloatingActionButton(
            text = { Text("Show snackbar") },
            icon = { Icon(Icons.Filled.Image, contentDescription = "") },
            onClick = {
                scope.launch {
                    val result = snackbarHostState
                        .showSnackbar(
                            message = "Snackbar",
                            actionLabel = "Action",
                            // Defaults to SnackbarDuration.Short
                            duration = SnackbarDuration.Indefinite
                        )
                    when (result) {
                        SnackbarResult.ActionPerformed -> {
                            /* Handle snackbar action performed */
                        }
                        SnackbarResult.Dismissed -> {
                            /* Handle snackbar dismissed */
                        }
                    }
                }
            }
        )
    }
) { contentPadding ->
    // Screen content
}
MaterialLayoutSnippets.kt

Вы можете создать собственный Snackbar с помощью параметра snackbarHost . Подробнее см. в справочной документации по API SnackbarHost .

Ключевые моменты

• actionLabel = "Action" : Задает текст кнопки действия.
• withDismissAction = true : отображает крестик в панели закусок. Коснитесь его, чтобы закрыть панель закусок.
• duration = SnackbarDuration.Indefinite : отображает снэк-бар до тех пор, пока пользователь или программа не закроют его.
• SnackbarResult.ActionPerformed : означает, что пользователь нажал кнопку действия снэк-бара.
• SnackbarResult.Dismissed : означает, что пользователь закрыл снэк-бар, не нажав кнопку действия.