Jetpack Compose中使用Material3自定义圆角选项AlertDialog遇类型错误

问题概述 #

尝试构建带选项选择的圆角AlertDialog时，使用参考代码出现类型不匹配错误：

Type mismatch.
Required:
DialogProperties
Found:
() → Unit

原代码如下：

@Composable
fun DialogOptionsView() {
    AlertDialog(
        onDismissRequest = {}
    ) {
        Surface(
            modifier = Modifier
                .wrapContentWidth()
                .wrapContentHeight(),
            shape = MaterialTheme.shapes.large
        ) {

        }
    }
}

错误原因 #

你使用的Compose BOM 2022.11.00对应的Material3库中，AlertDialog的参数顺序已调整：旧版代码中onDismissRequest是第一个参数，但新版本中properties参数被移至首位，直接传入onDismissRequest会导致类型不匹配。

修正后的代码 #

以下是适配当前版本的圆角AlertDialog实现，包含选项选择功能：

@Composable
fun DialogOptionsView(
    onDismiss: () -> Unit,
    onOptionConfirm: () -> Unit,
    onOptionCancel: () -> Unit
) {
    AlertDialog(
        properties = DialogProperties(),
        onDismissRequest = onDismiss,
        text = { Text("请选择操作") },
        confirmButton = {
            TextButton(onClick = onOptionConfirm) {
                Text("确认")
            }
        },
        dismissButton = {
            TextButton(onClick = onOptionCancel) {
                Text("取消")
            }
        },
        shape = MaterialTheme.shapes.large
    )
}

关键说明 #

• 无需嵌套Surface：AlertDialog自带shape参数，直接设置MaterialTheme.shapes.large即可实现圆角效果。
• 明确参数顺序或指定参数名：新版本中AlertDialog第一个参数为DialogProperties，需按顺序传递或显式指定参数名称，避免类型错误。
• 可根据需求扩展：示例中的文本和按钮逻辑可替换为你需要的选项内容。

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