diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/arkts-progressSmoothEffect.gif b/zh-cn/application-dev/reference/arkui-ts/figures/arkts-progressSmoothEffect.gif
new file mode 100644
index 0000000000000000000000000000000000000000..65daefb814d4f64f4e85f0d3ef8be14fa04998dc
Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/arkts-progressSmoothEffect.gif differ
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md
index d731e8ca1ad125ccefcf9947b748d1062074e811..7ceb12216f1e8e2ab581e285e48506ab6d92d4b0 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md
@@ -70,6 +70,7 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
| strokeWidth | [Length](ts-types.md#length) | 否 | 设置进度条宽度(不支持百分比设置)。
默认值:4.0vp |
| scaleCount | number | 否 | 设置环形进度条总刻度数。
默认值:120 |
| scaleWidth | [Length](ts-types.md#length) | 否 | 设置环形进度条刻度粗细(不支持百分比设置),刻度粗细大于进度条宽度时,为系统默认粗细。
默认值:2.0vp |
+| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度,进度会从当前值渐变至设定值,否则进度从当前值突变至设定值。
默认值:true |
## CapsuleStyleOptions10+
| 名称 | 参数类型 | 必填 | 描述 |
@@ -81,6 +82,7 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
| fontColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 文本颜色。
默认值:'\#ff182431' |
| enableScanEffect | boolean | 否 | 扫光效果的开关。
默认值:false |
| showDefaultPercentage | boolean | 否 | 显示百分比文本的开关,开启后会在进度条上显示当前进度的百分比。设置了content属性时该属性不生效。
默认值:false |
+| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度,进度会从当前值渐变至设定值,否则进度从当前值突变至设定值。
默认值:true |
## RingStyleOptions10+
| 名称 | 参数类型 | 必填 | 描述 |
@@ -89,12 +91,14 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
| shadow | boolean | 否 | 进度条阴影开关。
默认值:false |
| status | [ProgressStatus10+](#progressstatus10枚举说明) | 否 | 进度条状态,当设置为LOADING时会开启检查更新动效,此时设置进度值不生效。当从LOADING设置为PROGRESSING,检查更新动效会执行到终点再停止。
默认值: ProgressStatus.PROGRESSING |
| enableScanEffect | boolean | 否 | 进度条扫光效果的开关。
默认值: false |
+| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度,进度会从当前值渐变至设定值,否则进度从当前值突变至设定值。
默认值:true |
## LinearStyleOptions10+
| 名称 | 参数类型 | 必填 | 描述 |
| ------------- | ---------------------------- | ---- | ------------------------------------------------------------------------------------------ |
| strokeWidth | [Length](ts-types.md#length) | 否 | 设置进度条宽度(不支持百分比设置)。
默认值:4.0vp |
| enableScanEffect | boolean | 否 | 进度条扫光效果的开关。
默认值: false |
+| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度,进度会从当前值渐变至设定值,否则进度从当前值突变至设定值。
默认值:true |
## ScaleRingStyleOptions10+
| 名称 | 参数类型 | 必填 | 描述 |
@@ -102,9 +106,12 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
| strokeWidth | [Length](ts-types.md#length) | 否 | 设置进度条宽度(不支持百分比设置)。
默认值:4.0vp |
| scaleCount | number | 否 | 设置环形进度条总刻度数。
默认值:120 |
| scaleWidth | [Length](ts-types.md#length) | 否 | 设置环形进度条刻度粗细(不支持百分比设置),刻度粗细大于进度条宽度时,为系统默认粗细。
默认值:2.0vp |
+| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度,进度会从当前值渐变至设定值,否则进度从当前值突变至设定值。
默认值:true |
## EclipseStyleOptions10+
-暂无参数。
+| 名称 | 参数类型 | 必填 | 描述 |
+| ------------ | ---------------------------- | ---- | ------------------------------------------------------------------------------------------ |
+| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度,进度会从当前值渐变至设定值,否则进度从当前值突变至设定值。
默认值:true |
## ProgressStatus10+枚举说明
| 名称 | 描述 |
@@ -249,3 +256,38 @@ struct ProgressExample {
}
```
![capsuleProgressStyleEffect](figures/arkts-capsuleProgressStyleEffect.png)
+
+### 示例5
+进度平滑动效
+```ts
+@Entry
+@Component
+struct Index {
+ @State value: number = 0
+
+ build() {
+ Column({space: 10}) {
+ Text('enableSmoothEffect: true').fontSize(9).fontColor(0xCCCCCC).width('90%').margin(5)
+ .margin({top: 20})
+ Progress({value: this.value, total: 100, type:ProgressType.Linear})
+ .style({strokeWidth: 10, enableSmoothEffect: true})
+
+ Text('enableSmoothEffect: false').fontSize(9).fontColor(0xCCCCCC).width('90%').margin(5)
+ Progress({value: this.value, total: 100, type:ProgressType.Linear})
+ .style({strokeWidth: 10, enableSmoothEffect: false})
+
+ Button('value +10').onClick(() => {
+ this.value += 10
+ })
+ .width(75)
+ .height(15)
+ .fontSize(9)
+ }
+ .width('50%')
+ .height('100%')
+ .margin({left:20})
+ }
+}
+
+```
+![progressSmoothEffect](figures/arkts-progressSmoothEffect.gif)