Compose系列文章,请点原文阅读。原文,是时候学习Compose了!
0、介绍
AlertDialog是一个用紧急信息,详细信息或操作打断用户的对话框。
1、属性一览
【目前基于alpha09版本】请看该对话框支持的两个函数,首先看第一个函数,该函数会根据可用空间水平放置其按钮:
@Composable fun AlertDialog(
onDismissRequest: () -> Unit,
confirmButton: () -> Unit,
modifier: Modifier = Modifier,
dismissButton: () -> Unit = null,
title: () -> Unit = null,
text: () -> Unit = null,
shape: Shape = MaterialTheme.shapes.medium,
backgroundColor: Color = MaterialTheme.colors.surface,
contentColor: Color = contentColorFor(backgroundColor),
properties: DialogProperties? = null
): Unit
@Composable fun AlertDialog(
onDismissRequest: () -> Unit,
buttons: () -> Unit,
modifier: Modifier = Modifier,
title: () -> Unit = null,
text: () -> Unit = null,
shape: Shape = MaterialTheme.shapes.medium,
backgroundColor: Color = MaterialTheme.colors.surface,
contentColor: Color = contentColorFor(backgroundColor),
properties: DialogProperties? = null
): Unit
属性参数含义:
参数 | 含义 |
---|---|
modifier: Modifier = Modifier | 应用于布局的修饰符 |
onDismissRequest: () -> Unit | 当用户点击对话框外部或者按下返回按钮的时候会执行。注意:点击对话框的关闭按钮时并不会执行 |
confirmButton: () -> Unit | 一个由用户确认操作的按钮,默认没有回调,需要调用者自行设置回调事件。 |
dismissButton: () -> Unit = null | 一个用于关闭对话框的按钮,默认没有回调,需要调用者自行设置回调事件。 |
title: () -> Unit = null | 对话框的标题,默认无 |
text: () -> Unit = null | 对话框的内容,默认无 |
shape: Shape = MaterialTheme.shapes.medium | 对话框的形状 |
backgroundColor: Color = MaterialTheme.colors.surface | 对话框的背景色 |
contentColor: Color = contentColorFor(backgroundColor) | 提供给其子级的首选内容颜色 |
properties: DialogProperties? = null | 用于进一步配置特定属性的对话框 |
第二个函数如下:
@Composable fun AlertDialog(
onDismissRequest: () -> Unit,
buttons: () -> Unit,
modifier: Modifier = Modifier,
title: () -> Unit = null,
text: () -> Unit = null,
shape: Shape = MaterialTheme.shapes.medium,
backgroundColor: Color = MaterialTheme.colors.surface,
contentColor: Color = contentColorFor(backgroundColor),
properties: DialogProperties? = null
): Unit
跟第一个函数的区别在于按钮可以自定义了:
参数 | 含义 |
---|---|
buttons: () -> Unit | 可以自定义按钮的摆放位置及功能 |
2、使用示例
代码如下:
@Composable
fun DialogDemo() {
val openDialog = remember { mutableStateOf(true) }
if (openDialog.value) {
AlertDialog(
onDismissRequest = {
openDialog.value = false
},
title = {
Text(text = "这是对话框标题")
},
text = {
Text(
"这是一段描述对话框提示内容的文本, " +
"这个文本有点长,还有点俏皮!"
)
},
confirmButton = {
TextButton(
onClick = {
openDialog.value = false
}
) {
Text("确认")
}
},
dismissButton = {
TextButton(
onClick = {
openDialog.value = false
}
) {
Text("取消")
}
}
)
}
}
实现效果如下所示:
关于第二个函数就是自定义按钮了,你可以使用Row、Column等布局来实现各种摆放方式不同的按钮,这里不再示例。
当我们查看AlertDialog源码的时候我们可以发现,第一个函数继承自第二个函数,而第二个函数又继承自androidx.compose.ui.window.Dialog,当我们需要自定义特殊对话框样式的时候就可以继承自该函数。
3、版本更新
- 暂无
4、未解决问题
暂无。在之前的话我们如果要在工具类中弹出对话框,需要获取到顶层的Activity等,然后判断是否在销毁状态各种的然后才可以确保能正确弹出对话框。但是通过Compose的对话框我们发现,完全没有Context的要求了,但是别高兴太早,AlertDialog要求我们只能在Compose函数中使用,这又是一个障碍。