显示警告弹窗组件,可设置文本内容与响应回调。
AlertDialog.show(value: AlertDialogParamWithConfirm | AlertDialogParamWithButtons | AlertDialogParamWithOptions)
AlertDialogParam对象说明
- title:弹窗标题。
- subtitle:弹窗副标题。
- message:弹窗内容。
- autoCancel:点击遮障层时,是否关闭弹窗,true表示关闭弹窗。false表示不关闭弹窗。(默认值:true)
- cancel:点击遮障层关闭dialog时的回调。
- alignment:弹窗在竖直方向上的对齐方式。(默认值:DialogAlignment.Default)
- offset:弹窗相对alignment所在位置的偏移量。(默认值:{ dx: 0 , dy: 0 })
- gridCount:弹窗容器宽度所占用栅格数。(默认值:4,取值范围:大于等于0的整数。)
- maskRect:弹窗遮蔽层区域,在遮蔽层区域内的事件不透传,在遮蔽层区域外的事件透传。(默认值:{ x: 0, y: 0, width: '100%', height: '100%' })
- showInSubWindow:某弹框需要显示在主窗口之外时,是否在子窗口显示此弹窗。(默认值:false,弹窗显示在应用内,而非独立子窗口。)
- isModal:弹窗是否为模态窗口,模态窗口有蒙层,非模态窗口无蒙层。(默认值:true,此时弹窗有蒙层。)
- backgroundColor:弹窗背板颜色。(默认值:Color.Transparent)
- backgroundBlurStyle:弹窗背板模糊材质。(默认值:BlurStyle.COMPONENT_ULTRA_THICK)
- onWillDismiss:交互式关闭回调函数。
- cornerRadius:设置背板的圆角半径。可分别设置4个圆角的半径。(默认值:{ topLeft: '32vp', topRight: '32vp', bottomLeft: '32vp', bottomRight: '32vp' })圆角大小受组件尺寸限制,最大值为组件宽或高的一半,若值为负,则按照默认值处理。百分比参数方式:以父元素弹窗宽和高的百分比来设置弹窗的圆角。
- transition:设置弹窗显示和退出的过渡效果。
- width:设置弹窗背板的宽度。
- height:设置弹窗背板的高度。
- borderWidth:可分别设置4个边框宽度。(默认值:0)百分比参数方式:以父元素弹窗宽的百分比来设置弹窗的边框宽度。当弹窗左边框和右边框大于弹窗宽度,弹窗上边框和下边框大于弹窗高度,显示可能不符合预期。
- borderColor:设置弹窗背板的边框颜色。(默认值:Color.Black)如果使用borderColor属性,需要和borderWidth属性一起使用。
实例演示:AlertDialogPage
@Entry
@Component
struct AlertDialogPage {
@State message: string = '第1节 AlertDialog警告弹窗';
@State dialogMessage:string=''
build() {
Column({space:10}) {
Text(this.message)
.fontSize(20)
.fontWeight(FontWeight.Bold)
Button('点击弹窗').onClick(()=>{
AlertDialog.show({
title:'删除联系人',
message:'是否删除所选的联系人',
primaryButton:{
value:'取消',
action:()=>{
//点击“取消”按钮的业务逻辑
this.dialogMessage='点击了取消'
}
},
secondaryButton:{
value:'删除',
fontColor:Color.Red,
action:()=>{
//点击“删除”按钮的业务逻辑
this.dialogMessage='成功删除'
}
}
})
})
Text('弹窗消息:'+this.dialogMessage)
}
.height('100%')
.width('100%')
}
}