HarmonyOS 6 DatePickerDialog 日期滑动选择弹窗使用文档

文章目录完整代码功能说明核心参数1. 基础日期参数2. 农历相关参数3. 回调事件总结完整代码Entry Component struct DatePickerDialogExample { selectedDate: Date new Date(2010-01-01); build() { Stack({ alignContent: Alignment.Top }) { // $r(app.media.bg)需要替换为开发者所需的图像资源文件。 Image($r(app.media.bg)) Column() { Button(DatePickerDialog) .margin(20) .onClick(() { this.getUIContext().showDatePickerDialog({ start: new Date(2000-01-01), end: new Date(2100-12-31), selected: this.selectedDate, lunar: false, onDateAccept: (value: Date) { // 保存按下确定按钮时的日期这样当弹窗再次弹出时显示选中的是上一次确定的日期 this.selectedDate value; console.info(DatePickerDialog:onDateAccept() value.toString()); } }); }) Button(Lunar DatePickerDialog) .margin(20) .onClick(() { this.getUIContext().showDatePickerDialog({ start: new Date(2000-01-01), end: new Date(2100-12-31), selected: this.selectedDate, lunar: true, lunarSwitch: true, onDateAccept: (value: Date) { this.selectedDate value; console.info(DatePickerDialog:onDateAccept() value.toString()); } }); }) }.width(100%) } } }运行效果如图功能说明公历选择器DatePickerDialog按钮触发纯公历滚动选择农历选择器Lunar DatePickerDialog按钮触发支持公历/农历切换开关统一设置日期范围2000-01-01 → 2100-12-31记录上次选中日期下次打开自动定位采用官方推荐的UIContext调用方式核心参数1. 基础日期参数参数类型作用startDate选择器起始日期endDate选择器结束日期selectedDate默认选中日期2. 农历相关参数参数类型作用lunarbooleantrue显示农历false显示公历lunarSwitchboolean是否显示农历切换开关3. 回调事件参数作用onDateAccept点击确定时触发返回选中日期onCancel点击取消时触发onDateChange滑动选择时实时触发总结调用方式从 API 18 开始DatePickerDialog.show()已废弃必须使用this.getUIContext().showDatePickerDialog()。农历支持lunar/lunarSwitch从 API 11 开始支持。背景图资源$r(app.media.bg)必须替换为真实图片资源否则运行报错。设备限制不支持 Wearable 设备在手表上运行会报错。生命周期弹窗由系统管理无需手动创建/销毁控制器。如果这篇文章对你有帮助欢迎点赞、收藏、关注你的支持是持续创作的动力