鸿蒙学习-功能组件(Dialog弹窗)
·
一、消息提示类弹窗 (Toast)
用途:短暂显示通知信息(如操作反馈),自动消失无需交互。
import promptAction from '@ohos.promptAction';
promptAction.showToast({
message: '文本内容', // 支持字符串或资源引用
duration: 2000, // 显示时长(毫秒),范围 [1500, 10000]
bottom: '50vp' // 距屏幕底部的距离(可选)
});
二、警告对话框 (AlertDialog)
用途:强交互场景(如删除确认),需用户主动选择。
AlertDialog.show({
title: '标题', // 弹窗标题
message: '提示内容', // 详细说明
alignment: DialogAlignment.Center, // 位置(Center/Bottom)
autoCancel: true, // 点击遮罩层是否关闭
primaryButton: { // 主按钮(左侧)
value: '确认',
fontColor: Color.Red, // 按钮颜色
action: () => { /* 回调逻辑 */ }
},
secondaryButton: { // 次按钮(右侧)
value: '取消',
action: () => { /* 回调逻辑 */ }
}
});
三、操作列表弹窗 (ActionSheet)
用途:提供多个操作选项(如文件操作菜单)。
ActionSheet.show({
title: '标题',
message: '描述文本',
sheets: [ // 操作项列表
{ title: '复制', action: () => {} },
{ title: '删除', action: () => {} }
],
confirm: { // 底部取消按钮
value: '取消',
action: () => {}
}
});
四、选择器弹窗 (PickerDialog)
用途:日期、时间、文本等滑动选择。
| 类型 | 组件 | 适用场景 |
|---|---|---|
| 文本选择器 | TextPickerDialog |
列表项选择(如城市) |
| 日期选择器 | DatePickerDialog |
年月日选择 |
| 时间选择器 | TimePickerDialog |
时分选择 |
调用方式:直接通过组件名调用 show() 方法6。 |
五、自定义弹窗 (CustomDialog)
适用场景:内置弹窗无法满足样式或功能需求时。
实现步骤:
-
创建自定义弹窗组件:继承
CommonDialog或使用CustomDialogController16。 -
控制弹窗生命周期:
// 创建控制器
@CustomDialog
struct CustomDialogExample {
controller: CustomDialogController | null = null;
build() { /* 自定义UI */ }
}
// 触发弹窗
this.controller.open();
更多推荐

所有评论(0)