animation

frame 动画，支持平移，缩放，旋转和透明度变化

仅支持 frame，不支持 window 以及 frameGroup 里面的 frame

animation({params}, callback(ret, err))

params

name：

  • 类型：字符串
  • 默认值：当前 frame
  • 描述：frame 名字

delay：

  • 类型：数字
  • 默认值：0
  • 描述：（可选项）动画延迟时间，单位毫秒，默认立即开始

duration：

  • 类型：数字
  • 默认值：0
  • 描述：（可选项）动画过渡时间，单位毫秒

curve：

  • 类型：字符串
  • 默认值：ease_in_out
  • 描述：（可选项）动画曲线类型，指定动画开始和结束时的快慢
  • 取值范围
  1. ease_in_out     //开始和结束时慢
  2. ease_in         //开始时慢
  3. ease_out        //结束时慢
  4. linear          //整个动画过程速率一样

repeatCount：

  • 类型：数字
  • 默认值：0
  • 描述：（可选项）动画次数，默认不重复，为-1时无限重复

autoreverse：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）一次动画结束后是否自动反转动画

alpha：

  • 类型：数字
  • 默认值：无
  • 描述：（可选项）整个页面的透明度，介于0 1之间，Android 不支持

translation：

  • 类型：JSON
  • 默认值：无
  • 描述：（可选项）位置平移参数
  • 内部字段：
  1. {
  2.     x: 0,         //x轴方向上的平移距离，默认为0
  3.     y: 0,         //y轴方向上的平移距离，默认为0
  4.     z: 0          //z轴方向上的平移距离，默认为0，Android不支持
  5. }

scale：

  • 类型：JSON
  • 默认值：无
  • 描述：（可选项）页面缩放参数，Android 不支持
  • 内部字段：
  1. {
  2.     x: 1,         //x轴方向上的放大倍率，默认为1
  3.     y: 1,         //y轴方向上的放大倍率，默认为1
  4.     z: 1          //z轴方向上的放大倍率，默认为1
  5. }

rotation：

  • 类型：JSON
  • 默认值：无
  • 描述：（可选项）页面旋转参数，Android 不支持
  • 内部字段：
  1. {
  2.     degree:0,     //旋转角度，默认0
  3.     x: 0,         //绕x轴旋转，默认为0
  4.     y: 0,         //绕y轴旋转，默认为0
  5.     z: 1          //绕z轴旋转，默认为1
  6. }

callback(ret, err)

动画结束后的回调

示例代码

  1. api.animation({
  2.     name: 'page1',
  3.     delay: 1000,
  4.     duration: 3000,
  5.     curve: 'ease_in',
  6.     repeatCount: 2,
  7.     autoreverse: true,
  8.     alpha: 0.6,
  9.     translation: {
  10.         x: 0,
  11.         y: 100,
  12.         z: 0
  13.     },
  14.     scale: {
  15.         x: 1.2,
  16.         y: 1,
  17.         z: 1
  18.     },
  19.     rotation: {
  20.         degree: 45,
  21.         x: 0,
  22.         y: 0,
  23.         z: 1
  24.     }
  25. }, function(ret, err) {
  26.     alert('动画结束');
  27. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本