收藏
回答

setInterval里执行fillRect,安卓屏幕显示问题

操作描述:setInterval里执行fillRect,并且不clearRect,预期出现连续的正方形(连在一起) 代码:

const canvas = wx.createCanvas();

const context = canvas.getContext('2d') // 创建一个 2d context

context.fillStyle = '#1aad19' // 矩形颜色

const rectX = canvas.width / 2 - 50

let rectY = 0


function drawRect(x, y) {

  //context.clearRect(x, y - 1, 100, 100)

  context.fillRect(x, y, 100, 100)

}

setInterval(function () { drawRect(rectX,rectY++)}, 16);


现象:苹果手机预览时出现连续的正方形(连在一起);安卓手机上预览时,只有一个正方形不断下降

问题:这是因为安卓手机在每一次fillRect时会清掉之前的作图吗?那如果我要画多个图是不是得在每个setInterval里面全都再画一遍? 另:看到有人提问“真机调试时 fillRect绘制的图形 在 drawImage 后 不显示”,我觉得可能是同一原因,小白亟待帮助

最后一次编辑于  08-17  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

1 个回答

  • 小游戏运营专员-宏
    小游戏运营专员-宏
    08-23

    这里主要是因为Android GPU双缓冲的原因,2D接口只画一次的话,第二次画的会清屏。requestAnimation 中每次都画是不会有问题的,离屏来画也不会有问题。

    08-23
    赞同
    回复