animation动画代码求解

功能描述：

点击按钮后，显示遮罩，然后从画面底部匀速弹出高度为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);

}