小程序API能力集成指南——界面动画、滚动API汇总

动画API

Animation

动画对象

方法

Object Animation.export()

• 导出动画队列。export 方法每次调用后会清掉之前的动画操作。
• 参数： string value； 颜色值
• 返回值：Object

animationData

属性	类型	说明
actions	Array<object>

Animation Animation.step(Object object)

• 表示一组动画完成。可以在一组动画中调用任意多个动画方法，一组动画中的所有动画会同时开始，一组动画完成后才会进行下一组动画。
• 参数： Object object

属性	类型	默认值	必填	说明
duration	number	400	否	动画持续时间，单位 ms
timingFunction	string	'linear'	否	动画的效果
delay	number	0	否	动画延迟时间，单位 ms
transformOrigin	string	'50% 50% 0'	否

timingFunction 的合法值

值	说明	最低版本
'linear'	动画从头到尾的速度是相同的
'ease'	动画以低速开始，然后加快，在结束前变慢
'ease-in'	动画以低速开始
'ease-in-out'	动画以低速开始和结束
'ease-out'	动画以低速结束
'step-start'	动画第一帧就跳至结束状态直到结束
'step-end'	动画一直保持开始状态，最后一帧跳到结束状态

• 返回值：Animation

Animation Animation.matrix()

同 transform-function matrix

• 设置背景色
• 参数： string value； 颜色值
• 返回值：Animation

Animation Animation.matrix3d()

• 同 transform-function matrix3d
• 返回值：Animation

Animation Animation.rotate(number angle)

• 从原点顺时针旋转一个角度
• 参数： number angle； 旋转的角度。范围 [-180, 180]
• 返回值：Animation

Animation Animation.rotate3d(number x, number y, number z, number angle)

• 从 固定 轴顺时针旋转一个角度
• 参数：
  • number x; 旋转轴的 x 坐标
  • number y; 旋转轴的 y 坐标
  • number z; 旋转轴的 z 坐标
  • number angle; 旋转的角度。范围 [-180, 180]
• 返回值：Animation

Animation Animation.rotateX(number angle)

• 从 X 轴顺时针旋转一个角度
• 参数： number angle； 旋转的角度。范围 [-180, 180]
• 返回值：Animation

Animation Animation.rotateY(number angle)

• 从 Y 轴顺时针旋转一个角度
• 参数： number angle； 旋转的角度。范围 [-180, 180]
• 返回值：Animation