number canvas.requestanimationframe(function callback)
基础库 或更高版本； 若版本较低，建议采取 兼容处理。
主体： 企业支付宝小程序 、 个人支付宝小程序
canvas.requestanimationframe 注册一个函数，使其在下一帧动画重绘前执行。支持在 2d canvas 和 webgl canvas 下使用。
可用 canvas.cancelanimationframe 取消注册。
效果示例
代码示例执行效果
function callback
下一帧动画重绘时要执行的函数。
参数
| 属性 | 类型 | 描述 |
|---|---|---|
| timestamp | number | 回调函数被执行时的时间。domhighrestimestamp 时间戳。 |
number id
可用于取消函数注册的 id。
代码示例
.js
.axml
page({
oncanvasready() {
my.createselectorquery().select('#canvas').node().exec((res) => {
const canvas = res[0].node
const ctx = canvas.getcontext('2d')
this.canvas = canvas
this.ctx = ctx
this.x = 0
this.y = 0
this.draw()
})
},
draw(timestamp) {
console.log(timestamp)
const { ctx, canvas, x, y } = this
// 清空画布
ctx.clearrect(0, 0, canvas.width, canvas.height)
// 绘制方块
ctx.fillstyle = "red"
ctx.fillrect(x, y, 50, 50)
this.x = 0.5
this.y = 0.5
canvas.requestanimationframe(this.draw.bind(this))
}
})<canvas id="canvas" type="2d" onready="oncanvasready">canvas>