收藏
回答

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 后 不显示”,我觉得可能是同一原因,小白亟待帮助

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

1 个回答

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

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

    2019-08-23
    有用
    回复
登录 后发表内容