想实现的效果是每次点击都逆时针旋转360°,过程是缩小0.5倍,最后还原成1倍的
<view animation="{{animationData}}" style="background:red;height:100rpx;width:100rpx;margin: 100rpx 0 0 20rpx;">22222</view>
<view style="margin-top: 200rpx;" bindtap="click">点击我</view>
Page({
data: {
animationData: {}
},
click(){
var animation = wx.createAnimation({
duration: 1000,
timingFunction: 'ease',
})
this.animation = animation
animation.scale(0.5,0.5).rotate(-360).step()
this.setData({
animationData:animation.export()
})
setTimeout(function() {
animation.scale(1,1).rotate(-360).step()
this.setData({
animationData:animation.export()
})
}.bind(this), 1000)
}
})
这样试试
Page({ onLoad: function (options) { var animation = wx.createAnimation({ duration: 1000, timingFunction: 'ease', }) this.animation = animation }, click({ this.animation.scale(0.5,0.5).rotate(-360).step().scale(1).rotate(360).step({duration:0}) this.setData({ animationData:this.animation.export() }) } })rotate就是这个旋转角度，我每次旋转都想让他继续旋转-360°，这个有什么方法能做到吗