| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 |
- import { BackgroundPageModifier, DateOption, YTAddressSelectorDialog, YTDateUtil } from 'basic'
- import { UnitType } from 'basic/src/main/ets/datepicker/DatePickerEnums'
- import { promptAction } from '@kit.ArkUI'
- @Component
- export struct MainView {
- build() {
- Column() {
- Text('打开日历')
- .onClick(() => {
- //以下内容都可以不传 有默认值
- const date: Date = new Date()
- const yTDateDialog = new YTAddressSelectorDialog(this.getUIContext())
- let dateOption = new DateOption() //选项配置类
- dateOption.date = date //当前日期 默认今天
- dateOption.minDate = new Date(2000, 0, 1) //最小选择的日期 默认10年前的今天
- dateOption.maxDate = new Date(2048, 12, 30) //最大选择的日期 默认10年后的今天
- dateOption.unitType = UnitType.YEAR_MONTH_DAY //日期单位 默认年月日 可选年月、月日等组合
- dateOption.confirm = (date: Date) => { //确认选择回调函数
- console.log('确认', YTDateUtil.formatDate(date))
- promptAction.openToast({ message: YTDateUtil.formatDate(date) })
- }
- dateOption.headerLeftBuilder = wrapBuilder(headerLeftBuilder) //头部左侧按钮 默认返回按钮
- dateOption.headerRightBuilder = wrapBuilder(headerLeftBuilder) //头部右侧按钮 默认确认按钮
- dateOption.highlightBackgroundColor = Color.Pink //选中高亮背景色
- dateOption.highlightBorderColor = Color.Red //选中高亮边框色
- dateOption.textStyle = {
- //日期文字样式
- font: { size: 20, weight: 400 },
- color: Color.Gray
- }
- dateOption.selectedTextStyle = {
- //选中日期文字样式
- font: { size: 25, weight: 400 },
- color: Color.Yellow
- }
- yTDateDialog.show(dateOption) //设置好配置之后打开日历的函数
- })
- Image('https://hm-static.ytpm.net/upload/20250821/处暑-1755757002591.jpg')
- .width('100%')
- .height(300)
- }
- .attributeModifier(new BackgroundPageModifier(true))
- }
- }
- @Builder
- function headerLeftBuilder() {
- Image($r('app.media.app_icon'))
- .width(24)
- }
- @Builder
- function headerRightBuilder() {
- Image($r("app.media.app_icon"))
- .width(24)
- }
|