Animation

    导出动画队列。export 方法每次调用后会清掉之前的动画操作。

    Animation Animation.step(Object object)

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

    Animation Animation.matrix()

    同

    Animation Animation.matrix3d()

    同 transform-function matrix3d

    Animation Animation.rotate(number angle)

    从原点顺时针旋转一个角度

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

    从 固定 轴顺时针旋转一个角度

    Animation Animation.rotateX(number angle)

    从 X 轴顺时针旋转一个角度

    Animation Animation.rotateY(number angle)

    从 Y 轴顺时针旋转一个角度

    Animation Animation.rotateZ(number angle)

    从 Z 轴顺时针旋转一个角度

    Animation Animation.scale(number sx, number sy)

    缩放

    Animation Animation.scaleX(number scale)

    缩放 X 轴

    Animation Animation.scaleY(number scale)

    缩放 Y 轴

    Animation Animation.scaleZ(number scale)

    缩放 Z 轴

    Animation Animation.skew(number ax, number ay)

    对 X、Y 轴坐标进行倾斜

    Animation Animation.skewX(number angle)

    对 X 轴坐标进行倾斜

    Animation Animation.skewY(number angle)

    对 Y 轴坐标进行倾斜

    Animation Animation.translate(number tx, number ty)

    平移变换

    Animation Animation.translate3d(number tx, number ty, number tz)

    对 xyz 坐标进行平移变换

    Animation Animation.translateX(number translation)

    对 Y 轴平移

    Animation Animation.translateZ(number translation)

    对 Z 轴平移

    Animation Animation.opacity(number value)

    设置透明度

    Animation Animation.backgroundColor(string value)

    设置背景色

    Animation Animation.width(number|string value)

    设置宽度

    Animation Animation.height(number|string value)

    设置高度

    Animation Animation.left(number|string value)

    设置 left 值

    Animation Animation.right(number|string value)

    设置 right 值

    Animation Animation.top(number|string value)

    设置 top 值

    Animation Animation.bottom(number|string value)

    示例代码

    2.   data: {
    3.     animationData: {}
    4.   },
    5.   onShow: function(){
    6.     var animation = wx.createAnimation({
    7.       duration: 1000,
    8.       timingFunction: 'ease',
    9.     })
    11.     this.animation = animation
    13.     animation.scale(2,2).rotate(45).step()
    15.     this.setData({
    16.       animationData:animation.export()
    19.     setTimeout(function() {
    20.       animation.translate(30).step()
    21.       this.setData({
    22.       })
    23.     }.bind(this), 1000)
    24.   },
    25.   rotateAndScale: function () {
    26.     // 旋转同时放大
    27.     this.animation.rotate(45).scale(2, 2).step()
    28.     this.setData({
    29.       animationData: this.animation.export()
    30.     })
    31.   },
    33.     // 先旋转后放大
    34.     this.animation.rotate(45).step()
    35.     this.animation.scale(2, 2).step()
    36.     this.setData({
    37.       animationData: this.animation.export()
    38.     })
    39.   },
    40.   rotateAndScaleThenTranslate: function () {
    41.     // 先旋转同时放大，然后平移
    42.     this.animation.rotate(45).scale(2, 2).step()
    43.     this.animation.translate(100, 100).step({ duration: 1000 })
    44.     this.setData({
    45.       animationData: this.animation.export()
    46.     })
    47.   }