android - 使用脚手架在 Material Design 3 中显示 Snackbar

Question

决定在我的新 Jetpack Compose 项目中试用 Material Design 3。一切都很舒适，直到我碰壁时需要显示 Snackbar。

在 MD2 中，这非常简单，您可以在 Scaffold 中显示 snackbar，其中包含 SnackbarHostState.showSnackbar() 函数协程作用域。我观察到您只需要从 Material Library 导入 androidx.compose.material.rememberScaffoldState。

import androidx.compose.material.rememberScaffoldState


@Composable
fun MyScreenInMaterial2() {
    val scaffoldState = rememberScaffoldState()
}

当我在 MD3 中尝试相同操作时，rememberScaffoldState() 函数未解析。

对于深入了解 MD3 世界的人，您如何在脚手架中显示 Snackbar？我查看了文档和在线资源，但没有找到解决方案。

Answer 1

这里有一个来自 the official documentation 的示例.

val snackbarHostState = remember { SnackbarHostState() }
val scope = rememberCoroutineScope()
Scaffold(
    snackbarHost = { SnackbarHost(snackbarHostState) },
    floatingActionButton = {
        var clickCount by remember { mutableStateOf(0) }
        ExtendedFloatingActionButton(
            onClick = {
                // show snackbar as a suspend function
                scope.launch {
                    snackbarHostState.showSnackbar(
                        "Snackbar # ${++clickCount}"
                    )
                }
            }
        ) { Text("Show snackbar") }
    },
    content = { innerPadding ->
        Text(
            text = "Body content",
            modifier = Modifier.padding(innerPadding).fillMaxSize().wrapContentSize()
        )
    }
)