在 OpenHarmony（ArkUI，eTS/ArkTS） 中，进度条主要有 Progress 组件 和 Slider 组件 两种常见用法，下面分别说明。
用于展示任务进度，不支持拖动。
Progress({ value: 50, total: 100, type: ProgressType.Linear })
.width('80%')
.height(20)
| 属性 | 说明 |
|---|---|
| value | 当前进度值 |
| total | 总进度（默认100） |
| type | 进度条类型 |
| style | 样式（宽高、颜色） |
ProgressType.Linear // 线性
ProgressType.Ring // 环形
ProgressType.ScaleRing // 刻度环
ProgressType.Eclipse // 圆形
ProgressType.Capsule // 胶囊
示例（环形）：
Progress({ value: 30, total: 100, type: ProgressType.Ring })
.width(100)
.height(100)
用于用户调节进度（如音量、亮度）。
Slider({
value: 40,
min: 0,
max: 100,
step: 1,
style: SliderStyle.OutSet
})
.onChange((value: number) => {
console.info('当前值：' + value)
})
| 参数 | 说明 |
|---|---|
| value | 当前值 |
| min / max | 最小值 / 最大值 |
| step | 步长 |
| style | 滑块样式 |
@State progressValue: number = 0
build() {
Column() {
Progress({ value: this.progressValue, total: 100 })
Button('增加进度')
.onClick(() => {
this.progressValue += 10
})
}
}
如果你用的是 OpenHarmony 旧版本（JS UI） 或需要 自定义进度条样式，可以告诉我，我给你对应示例。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
