HarmonyOS鸿蒙Next中ProgressType.ScaleRing类型的进度条有什么独特的属性(如scaleCount和scaleWidth)?这些属性如何影响进度条的显示?
HarmonyOS鸿蒙Next中ProgressType.ScaleRing类型的进度条有什么独特的属性(如scaleCount和scaleWidth)?这些属性如何影响进度条的显示? ProgressType.ScaleRing 类型的进度条有什么独特的属性(如 scaleCount 和 scaleWidth)?这些属性如何影响进度条的显示?
@Entry
@Component
struct Index {
@State value: number = 0;
private intervalID: number = -1;
build() {
Column({space: 10}) {
Progress({
value: this.value,
type: ProgressType.ScaleRing
})
.style({
scaleCount: 30,
scaleWidth: 10
})
.color(Color.Red)
.size({width: 80, height: 80})
Progress({
value: this.value,
total: 100,
type: ProgressType.Capsule
})
.size({width: 120, height: 50})
Progress({
value: this.value,
total: 100,
type: ProgressType.Ring
})
.style({strokeWidth: 10})
.color(Color.Pink)
.size({width: 80, height: 80})
Progress({
value: this.value,
total: 100,
type: ProgressType.Eclipse
})
.color(Color.Red)
.size({width: 80, height: 80})
Progress({
value: this.value,
total: 100,
type: ProgressType.Linear
})
.style({strokeWidth: 10})
.size({width: ‘100%’, height: 40})
}
.padding(10)
.width(‘100%’)
.height(‘100%’)
}
aboutToAppear() {
this.intervalID = setInterval(() => {
this.value += 1
if (this.value > 100) {
clearInterval(this.intervalID);
}
console.log("update: " + this.value)
}, 100);
}
}
更多关于HarmonyOS鸿蒙Next中ProgressType.ScaleRing类型的进度条有什么独特的属性(如scaleCount和scaleWidth)?这些属性如何影响进度条的显示?的实战教程也可以访问 https://www.itying.com/category-93-b0.html
-
scaleCount: 设置环形进度条总刻度数。
默认值:120 -
scaleWidth: 设置环形进度条刻度粗细(不支持百分比设置),刻度粗细大于进度条宽度时,为系统默认粗细。
默认值:2.0vp
更多关于HarmonyOS鸿蒙Next中ProgressType.ScaleRing类型的进度条有什么独特的属性(如scaleCount和scaleWidth)?这些属性如何影响进度条的显示?的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
在HarmonyOS鸿蒙Next中,ProgressType.ScaleRing类型的进度条具有独特的scaleCount和scaleWidth属性。scaleCount定义了进度条上的刻度数量,影响刻度的密集程度;scaleWidth则控制每个刻度的宽度,影响刻度的粗细。这些属性共同决定了进度条的视觉效果,scaleCount越多,刻度越密集;scaleWidth越大,刻度越粗。合理设置这些属性可以使进度条更符合设计需求,提升用户体验。


