Jetpack Compose移动端中Wear OS Confirmation组件的等效替代方案

Wear OS的Confirmation组件主要用于操作完成后的快速自动消失式反馈（比如成功提示、操作确认），移动端Compose没有完全匹配的现成组件，但可以通过以下两种方案实现类似效果：

1. 使用Snackbar（推荐） #

这是移动端Material Design中最标准的操作反馈组件，和Confirmation的核心作用一致——给用户简洁的操作结果提示，且支持自动消失。

示例代码：

val snackbarHostState = remember { SnackbarHostState() }
val scope = rememberCoroutineScope()

Scaffold(
    snackbarHost = { SnackbarHost(snackbarHostState) }
) { paddingValues ->
    Button(
        onClick = {
            scope.launch {
                snackbarHostState.showSnackbar(
                    message = "操作完成",
                    actionLabel = "撤销", // 可选动作按钮
                    duration = SnackbarDuration.Short // 对应Confirmation的自动消失逻辑
                )
            }
        },
        modifier = Modifier.padding(paddingValues)
    ) {
        Text("执行操作")
    }
}

2. 自定义居中反馈弹窗 #

如果需要更贴近Wear OS Confirmation的居中展示样式，可以自定义一个带自动关闭逻辑的弹窗：

示例代码：

@Composable
fun MobileConfirmationDialog(
    message: String,
    icon: @Composable () -> Unit,
    onDismiss: () -> Unit
) {
    LaunchedEffect(Unit) {
        delay(2000) // 2秒后自动关闭，和Wear Confirmation默认时长一致
        onDismiss()
    }

    Dialog(onDismissRequest = onDismiss) {
        Card(
            shape = RoundedCornerShape(16.dp),
            elevation = CardDefaults.cardElevation(8.dp)
        ) {
            Column(
                modifier = Modifier.padding(24.dp),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = Arrangement.spacedBy(16.dp)
            ) {
                icon()
                Text(message, textAlign = TextAlign.Center)
            }
        }
    }
}

// 使用方式
var showConfirmation by remember { mutableStateOf(false) }

Button(onClick = { showConfirmation = true }) {
    Text("执行操作")
}

if (showConfirmation) {
    MobileConfirmationDialog(
        message = "操作成功",
        icon = { Icon(Icons.Filled.Check, contentDescription = "成功") },
        onDismiss = { showConfirmation = false }
    )
}

内容的提问来源于stack exchange，提问作者Isak The Hacker