animation动画代码求解
发布于 6 年前 作者 taochen 5851 次浏览 来自 问答

功能描述:

点击按钮后,显示遮罩,然后从画面底部匀速弹出高度为200px的view

点击遮罩,view匀速下降直至隐藏,遮罩隐藏

问题:

SetTimeout中“animation.translateY(-200).step();  ”的这段代码是什么意思?为什么还要在SetTimeout中再执行一次?作用是什么?

//显示view

showParamsContainer: function(e) {

//创建动画实例

var animation = wx.createAnimation({

duration: 200, //动画持续时间

timingFunction: ‘linear’, //匀速

delay: 0

});

this.animation = animation;

animation.translateY(-200).step();   //设置Y轴偏移量

this.setData({

animationData: animation.export(),

anParamsContainer: true

});

setTimeout(function () {

animation.translateY(-200).step()

this.setData({

animationData: animation.export()

})

}.bind(this), 200);

},

//隐藏view

hideMaskLayer_params: function(e){

//创建动画实例

var animation = wx.createAnimation({

duration: 200, //动画持续时间

timingFunction: ‘linear’, //匀速

delay: 0

});

this.animation = animation;

//animation.translateY(0).step();

this.setData({

animationData: animation.export()

});

setTimeout(function () {

animation.translateY(0).step()

this.setData({

animationData: animation.export(),

anParamsContainer: false

})

}.bind(this), 200);

}

回到顶部