淘宝小程序使用 animation API

axml代码

<view style="width:100px;height:100px;background-color:orangered" animation="{
  {animation}}" onTap="translate"></view>

js代码

    translate() {
      // this.animation = my.createAnimation()
      this.animation = my.createAnimation({
        transformOrigin: "50% 50%",//元素变化时围绕哪个点进行变换
        duration: 1000,//动画持续时间
        timeFunction: "linear",//定义动画效果 默认linear,有效值：'linear','ease','ease-in','ease-in-out','ease-out','step-start','step-end'
        delay: 0,//动画延迟时间
      })
      this.animation.opacity(0.5).scale(2).step()
      this.setData({ animation: this.animation.export() })
    }

补充说明

animation

动画实例可以调用以下方法来描述动画，调用结束后会返回实例本身，支持链式调用的写法。view 的 animation 属性初始化为 {} 时，在基础库 1.11.0（