Jetpack Compose中SnackBar未显示关闭按钮问题求助

默认情况下，Jetpack Compose的Snackbar只有在指定action参数时才会显示右侧操作按钮（包括关闭按钮）。你当前的代码仅传入了message和duration，因此只会展示消息文本。

要调出关闭按钮，只需在showSnackbar方法中添加actionLabel参数并处理点击逻辑：

修改后的代码示例 #

val snackbarHostState = remember { SnackbarHostState() }
SnackbarHost(hostState = snackbarHostState)

uiState.toastMessage?.let {
    val message = stringResource(it)
    val closeText = stringResource(R.string.close) // 替换为你的关闭文本资源
    LaunchedEffect(key1 = message) {
        val result = snackbarHostState.showSnackbar(
            message = message,
            actionLabel = closeText,
            duration = SnackbarDuration.Indefinite
        )
        // 点击关闭按钮后清空消息状态
        if (result == SnackbarResult.ActionPerformed) {
            vm.toastMessage(null)
        }
    }
}

额外说明 #

如果需要把关闭按钮换成X图标而非文本，可以自定义SnackbarHost的布局：

SnackbarHost(hostState = snackbarHostState) { snackbarData ->
    Snackbar(
        action = {
            IconButton(onClick = { snackbarData.performAction() }) {
                Icon(Icons.Filled.Close, contentDescription = "关闭")
            }
        }
    ) {
        Text(snackbarData.message)
    }
}

内容的提问来源于stack exchange，提问作者NullPointerException