收藏
回答

动画无法动态设置参数?

代码如下:

this.animation1.translateY(realTouchY).step();

希望通过修改变量realTouchY的值,实现用户每次操作都执行不同动画的效果。但实际操作中发现,当执行完第一次动画之后,不管怎么修改realTouchY的值,后续的动画都跟第一次执行时一样。也就是说,动画不会随着变量的改变而改变。

回答关注问题邀请回答
收藏

2 个回答

  • Admin ²º²³
    Admin ²º²³
    2020-04-20

    哥们,推荐使用小程序新的动画方式:关键帧动画,这个简单多了。

    动画 | 微信开放文档

    https://developers.weixin.qq.com/miniprogram/dev/framework/view/animation.html

    this.animate('#container', [
        { opacity: 1.0, rotate: 0, backgroundColor: '#FF0000' },
        { opacity: 0.5, rotate: 45, backgroundColor: '#00FF00'},
        { opacity: 0.0, rotate: 90, backgroundColor: '#FF0000' },
        ], 5000, function () {
          this.clearAnimation('#container', { opacity: true, rotate: true }, function () {
            console.log("清除了#container上的opacity和rotate属性")
          })
      }.bind(this))
    


    2020-04-20
    有用 1
    回复 2
    • Tim Yip
      Tim Yip
      2020-04-20
      好的,我试试,谢谢。
      2020-04-20
      回复
    • Admin ²º²³
      Admin ²º²³
      2020-04-20回复Tim Yip
      我跟你一样被之前的动画方式折腾过,真的很麻烦。新的方式,感觉方便多了。
      2020-04-20
      回复
  • 卢霄霄
    卢霄霄
    2020-04-20

    代码片段来个呢

    2020-04-20
    有用
    回复 2
    • Tim Yip
      Tim Yip
      2020-04-20
      这块代码太复杂,我简写一个吧,按照代码逻辑,用户每次滑动事件结束后,realTouchY的值都会改变,那么animation1也应该会改变,但实际执行时,不管realTouchY怎么变,动画都是一样的。
      2020-04-20
      回复
    • 卢霄霄
      卢霄霄
      2020-04-20回复Tim Yip
      代码不够。。你要做个我能跑起来的代码片段
      https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
      2020-04-20
      回复
登录 后发表内容
问题标签