微信小程序 Animation

1.创建动画实例

let animation = wx.createAnimation({
     duration: 200,  //动画持续时间,单位 ms
     timingFunction: "linear", //   动画的效果
     delay: 0  // 动画延迟时间,单位 ms
     transformOrigin:'50% 50% 0' // 基点位置 参考css3,此为默认值
    })

2.调用实例的方法来实现动画的过程

animation.scale(3.0)
animation.rotateY(90).step()
//  效果参考微信官方文档 各种组合动画

3.实例的export()方法导出动画数据传递给组件

this.setData({
      animation: animation.export()  //输出动画
    })
<view animation="{{animation}}"  />   //  wxml  
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。