如何关闭Jetpack Compose Snackbar队列机制？实现新消息覆盖旧消息

默认情况下，SnackbarHostState会将多次调用的Snackbar加入队列依次显示。要让新的Snackbar直接替换当前显示的旧Snackbar，只需在每次调用showSnackbar前主动关闭当前的Snackbar即可。

具体实现步骤 #

1. 持有SnackbarHostState的实例：

val snackbarHostState = remember { SnackbarHostState() }

2. 在触发Snackbar显示的逻辑中，先关闭当前显示的Snackbar，再显示新的：

// 用rememberCoroutineScope获取协程作用域
val scope = rememberCoroutineScope()

// 示例：按钮点击触发Snackbar
Button(onClick = {
    scope.launch {
        // 关闭当前正在显示的Snackbar
        snackbarHostState.currentSnackbarData?.dismiss()
        // 显示新的Snackbar
        snackbarHostState.showSnackbar(
            message = "新的提示内容",
            actionLabel = "确认"
        )
    }
}) {
    Text("显示Snackbar")
}

3. 整合到你的Scaffold代码中：

Scaffold(
    snackbarHost = {
        SnackbarHost(snackbarHostState) { data ->
            Snackbar(
                actionColor = color5,
                snackbarData = data
            )
        }
    },
    // 其他Scaffold配置项
) { innerPadding ->
    // 你的页面内容
    Button(onClick = {
        val scope = rememberCoroutineScope()
        scope.launch {
            snackbarHostState.currentSnackbarData?.dismiss()
            snackbarHostState.showSnackbar("新消息")
        }
    }) {
        Text("触发Snackbar")
    }
}

原理说明 #

SnackbarHostState.currentSnackbarData会返回当前正在显示的Snackbar实例，调用其dismiss()方法可立即关闭当前Snackbar。之后再调用showSnackbar时，新的Snackbar会直接显示，不会进入等待队列。

内容的提问来源于stack exchange，提问作者Максим Зозуляк