
回复
最近在日常鸿蒙开发过程中,经常会使用一些时间选择器,鸿蒙官方提供的时间选择器满足不了需求,所以自己动手自定义一些经常会使用到的时间选择器,希望能帮到你,建议点赞收藏!
new Promise<string[]>(async (resolve: (data: Array<string>) => void, reject) => {
let list: Array<string> = []
for (let start = this.currentYear; start <= this.currentYear + 1; start++) {
//月份
for (let i = (start == this.currentYear?this.startMonth:1); i < 13; i++) {
let day: number = 0
if (i == 1 || i == 3 || i == 5 || i == 7 || i == 8 || i == 10 || i == 12) {
day = 31
} else if (i == 2) {
//闰年
if (start % 400 == 0 || (start % 4 == 0 && start % 100 > 0)) {
day = 29
}
// //平年
else {
day = 28
}
} else {
day = 30
}
for (let j = ((start == this.currentYear&& i == this.startMonth)?this.startDay:1); j <= day; j++) {
list.push(start + "-" + (i).toString().padStart(2,"0") + "-" + j.toString().padStart(2,"0"))
}
}
}
resolve(list)
}).then((result: Array<string>) => {
this.timeList = result
})
由于计算日期是比较耗时的操作,这里使用 Pormise 处理日期的计算,特别需要注意闰年的日期计算,这里以 1 年为周期。
TextPicker({ range: this.timeList, value: this.choseDay })
.pickerStyle()
.onChange((value, index) => {
this.choseDay = value.toString()
})
.width(105)
for (let i = 0; i < 60; i=i+this.skipMinute) {
this.minuteList.push((i<10?"0"+i:i).toString().concat(this.isShowUnit?"分":""))
}
for (let i = 0; i < 24; i++) {
this.hourList.push((i<10?"0"+i:i).toString().concat(this.isShowUnit?"时":""))
}
TextPicker({
range: this.hourList,
value:this.currentHour+""
}).pickerStyle()
.onChange((value,index)=>{
this.selectHour = value+""
this.onChange(this.selectHour.concat(":"+this.selectMinute))
})
TextPicker({
range: this.minuteList,
value:this.currentMinute+""
}).pickerStyle()
.onChange((value,index)=>{
this.selectMinute = value.toString()
this.onChange(this.selectHour+":"+value)
})
自定义时间选择器看似简单,其实需要注意的地方不少,时间的计算,时间的显示格式,默认选中当前时间等。都需要开发者在日常开发中注意计算细节。看到这里相信你已经学会了怎么自定义一个时间选择器了,快去动手试试吧!