鸿蒙UI系统组件06——进度条(Progress)

最新推荐文章于 2025-09-24 09:22:41 发布

原创

最新推荐文章于 2025-09-24 09:22:41 发布 · 1.8k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#ui #harmonyos #鸿蒙 #华为

如果你也对鸿蒙开发感兴趣，加入“Harmony自习室”吧！扫描下面名片，关注公众号。

1、概述

Progress是进度条显示组件，显示内容通常为某次目标操作的当前进度。

2、创建进度条

Progress通过调用接口来创建，接口调用形式如下：

Progress(options: {value: number, total?: number, type?: ProgressType})

该接口用于创建type样式的进度条，其中value用于设置初始进度值，total用于设置进度总长度，type决定Progress样式。

Progress({ value: 24, total: 100, type: ProgressType.Linear }) // 创建一个进度总长为100，初始进度值为24的线性进度条

3、设置进度条样式

Progress有5种可选类型，在创建时通过设置ProgressType枚举类型给type可选项指定Progress类型。其分别为：ProgressType.Linear（线性样式）、 ProgressType.Ring（环形无刻度样式）、ProgressType.ScaleRing（环形有刻度样式）、ProgressType.Eclipse（圆形样式）和ProgressType.Capsule（胶囊样式）。