Jetpack Compose：对话框组件

一、Dialog

对话框，content 参数允许我们传入自定义的 Composable 组件。

它和普通的 Composable 组件不同在于其需要依赖独立的 Window 来进行显示。

下面代码演示了点击按钮后显示对话框：

var openDialog by remember { mutableStateOf(false) }
Button(onClick = { openDialog = true }) {
    Text("点击显示 Dialog")
}
if (openDialog) {
    Dialog(
        // 关闭 Dialog 时执行
        onDismissRequest = { openDialog = false }
    ) {
        Box(Modifier.size(160.dp, 50.dp).background(Color.White)) {
            Text("你好", Modifier.padding(10.dp))
        }
    }
}

二、AlertDialog

警告对话框，其是 Dialog 的一个封装，遵循 Material Design 设计规范。

下面代码演示了点击按钮弹出警告框：

var openDialog by remember { mutableStateOf(false) }
Button(onClick = { openDialog = true }) {
    Text("点击显示 AlertDialog")
}
if (openDialog) {
    AlertDialog(
        onDismissRequest = {
            openDialog = false
        },
        title = {
            Text("提示")
        },
        text = {
            Text("确定要删除吗")
        },
        confirmButton = {
            TextButton(onClick = { openDialog = false }) {
                Text("确定")
            }
        },
        dismissButton = {
            TextButton(onClick = { openDialog = false }) {
                Text("取消")
            }
        }
    )
}