diff --git a/zh-cn/application-dev/reference/arkui-js/js-components-common-animation.md b/zh-cn/application-dev/reference/arkui-js/js-components-common-animation.md index 3b1f7bcbd8ec579a034c72db625fff92148e9cd8..e562b568c928e919ca2ec37618d76e12082d4965 100644 --- a/zh-cn/application-dev/reference/arkui-js/js-components-common-animation.md +++ b/zh-cn/application-dev/reference/arkui-js/js-components-common-animation.md @@ -14,7 +14,7 @@ | animation-name | string | - | 指定\@keyframes,详见表 @keyframes属性说明。 | | animation-delay | <time> | 0 | 定义动画播放的延迟时间。支持的单位为[s(秒)\|ms(毫秒) ],默认单位为ms,格式为:1000ms或1s。 | | animation-duration | <time> | 0 | 定义一个动画周期。支持的单位为[s(秒)\|ms(毫秒) ],默认单位为ms,格式为:1000ms或1s。
必须设置animation-duration 样式,否则时长为 0将不会播放动画。 | -| animation-iteration-count | number  \| infinite | 1 | 定义动画播放的次数,默认播放一次,可通过设置为infinite无限次播放。 | +| animation-iteration-count | number \| infinite | 1 | 定义动画播放的次数,默认播放一次,可通过设置为infinite无限次播放。 | | animation-timing-function | string | ease
| 描述动画执行的速度曲线,用于使动画更为平滑。
可选项有:
- linear:表示动画从头到尾的速度都是相同的。
- ease:表示动画以低速开始,然后加快,在结束前变慢,cubic-bezier(0.25, 0.1, 0.25, 1.0)。
- ease-in:表示动画以低速开始,cubic-bezier(0.42, 0.0, 1.0, 1.0)。
- ease-out:表示动画以低速结束,cubic-bezier(0.0, 0.0, 0.58, 1.0)。
- ease-in-out:表示动画以低速开始和结束,cubic-bezier(0.42, 0.0, 0.58, 1.0)。
- friction:阻尼曲线,cubic-bezier(0.2, 0.0, 0.2, 1.0)。
- extreme-deceleration:急缓曲线,cubic-bezier(0.0, 0.0, 0.0, 1.0)。
- sharp:锐利曲线,cubic-bezier(0.33, 0.0, 0.67, 1.0)。
- rhythm:节奏曲线,cubic-bezier(0.7, 0.0, 0.2, 1.0)。
- smooth:平滑曲线,cubic-bezier(0.4, 0.0, 0.4, 1.0)。
- cubic-bezier:在三次贝塞尔函数中定义动画变化过程,入参的x和y值必须处于0-1之间。
- steps: 阶梯曲线6+。语法:steps(number[, end\|start]);number必须设置,支持的类型为正整数。第二个参数可选,表示在每个间隔的起点或是终点发生阶跃变化,支持设置end或start,默认值为end。 | | animation-direction6+ | string | normal | 指定动画的播放模式:
- normal: 动画正向循环播放。
- reverse: 动画反向循环播放。
- alternate:动画交替循环播放,奇数次正向播放,偶数次反向播放。
- alternate-reverse:动画反向交替循环播放,奇数次反向播放,偶数次正向播放。 | | animation-fill-mode | string | none | 指定动画开始和结束的状态:
- none:在动画执行之前和之后都不会应用任何样式到目标上。
- forwards:在动画结束后,目标将保留动画结束时的状态(在最后一个关键帧中定义)。
- backwards6+:动画将在animation-delay期间应用第一个关键帧中定义的值。当animation-direction为"normal"或"alternate"时应用from关键帧中的值,当animation-direction为"reverse"或"alternate-reverse"时应用to关键帧中的值。
- both6+:动画将遵循forwards和backwards的规则,从而在两个方向上扩展动画属性。 |