短评createAnimation

• 垃圾：

1.为什么不能是%？？还要计算下拉ctr的高度。

2.rpx不彻底，和px要慢慢换算，开发者你写出来自己有没有用？

• 优秀：

比@keyframes能省出50%的代码。

注：上下拉都有动画。

<view bindtap="mClick" class="mClick">下拉</view>

<view class="ctr" animation='{{ani}}'>

    <view class="item">内容1</view>

    <view class="item">内容2</view>

    <view class="item">内容3</view>

</view>

.mClick{
  position: fixed;
  width: 100vw;
  height: 50px;
  background-color: yellow;
  z-index: 1;
}

.ctr{
  position: fixed;
  width: 100vw;
  top: -100px;
}

.item{
  width: 100vw;
  height: 50px;
  background-color: red;
}

Page({
  data: {
    dur: 300,
    ty: 150
  },

  onLoad() {
    var dur = this.dur
    this.ani = wx.createAnimation({
      duration: dur,
      timingFunction: 'ease'
    })
    this.setData({
      ani: this.ani.export()
    })
  },

  mClick() {
    var ani = this.ani
    var ty = this.data.ty
    ani.translateY(ty).step()
    var altTy = (ty == 150) ? 0 : 150
    this.setData({
      dur: 300,
      ty: altTy,
      ani: ani.export()
    })
  }
})

end