小游戏canvas局部重绘异常
发布于 5 年前 作者 rguo 1652 次浏览 来自 问答

异步函数中使用fillRect、putImageData等api绘制部分内容时,安卓下出现各种异常情况。

demo:

let canvas = wx.createCanvas();
let ctx = canvas.getContext('2d');
 
//全局绘制白色背景
ctx.fillStyle = '#ffffff';
ctx.fillRect(0, 0, canvas.width, canvas.height);
 
//若干延时后,局部重绘红色方块
setTimeout(partialReRender, 1000); //安卓下表现异常:红米5P 全屏变为红色,红米3S 全屏变为红格子与灰条平铺
 
 
function partialReRender() { //局部重绘,安卓下表现异常
  ctx.fillStyle = '#ff0000'
  ctx.fillRect(0, 0, 50, 50)
}
function fullReRender() { //若改为全局重绘,则展示正常
  ctx.fillStyle = '#ffffff'
  ctx.fillRect(0, 0, canvas.width, canvas.height)
 
  ctx.fillStyle = '#ff0000'
  ctx.fillRect(0, 0, 50, 50)
}

代码片段:wechatide://minicode/X7O6ugmp7p7U

回到顶部