一、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("取消")
}
}
)
}