收藏
回答

关于canvas动画 requestAnimationFrame 方法缺失的问题

在电脑版的调试工具开发小程序有 requestAnimationFrame 这个方法

但在 Android  微信 6.5.16 版本中,找到这个方法,报错了

在 IOS 11 微信 6.5.18 版本中,也没有找到这个方法!


因为我需要做一个特殊的动画,需要使用 这个方法,来实现Canvas 动画,希望可能支持,谢谢!




相关代码:

const app = getApp()
 
Page({
  data: {
    startAngle:-(1/2 * Math.PI),
 
    endAngle:3/2 * Math.PI,
 
    xAngle:Math.PI / 180
  },
  onLoad : function() {
    let that = this;
    let ctx = wx.createCanvasContext('anmi');
 
    let endAngle = that.data.endAngle;
    let xAngle = that.data.xAngle;
    let templateAngle = that.data.startAngle;
 
    let rander = function() {
      if(templateAngle >= endAngle) {
        return;
      } else if(templateAngle + xAngle > endAngle) {
        templateAngle = endAngle;
      } else {
        templateAngle += xAngle;
      }
      ctx.beginPath();
      ctx.setLineWidth(10)
      ctx.setLineCap('round')
      ctx.setStrokeStyle('#aaaaaa')
      ctx.arc(100, 100, 50, that.data.startAngle, templateAngle);
      ctx.stroke();
      ctx.closePath();
 
      ctx.draw()
 
      requestAnimationFrame(rander);
    }
 
    rander();
     
  }
})


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

3 个回答

  • 追风少年
    追风少年
    2018-01-20

    这个

    requestAnimationFrame

    api都没有? 为什么这么设计? 太坑了

    2018-01-20
    有用
    回复
  • 小西在武汉
    小西在武汉
    2017-10-19

    请问有没有计划增加这个API?

    2017-10-19
    有用
    回复
  • HS
    HS
    2017-10-19

    目前暂时没有此 API。

    您可以参考 https://gist.github.com/paulirish/1579671 这里的代码自己做一个,但请不要直接复制这里的代码,因为没有 windows 对象。

    2017-10-19
    有用
    回复
登录 后发表内容