关于canvas动画 requestAnimationFrame 方法缺失的问题
发布于 6 年前 作者 mchang 3772 次浏览 来自 问答

在电脑版的调试工具开发小程序有 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 回复

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

这个

requestAnimationFrame

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

目前暂时没有此 API。

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

回到顶部