由于Android小游戏canvas无法设置imageRendering样式,导致缩放产生模糊。
在模拟器及IOS中可正常设置,无此问题。
- 当前 Bug 的表现(可附上截图)
- 预期表现
- 复现路径
进入小游戏即可出现
- 提供一个最简复现 Demo
var canvas = wx.createCanvas();var buff = wx.createCanvas();var sysinfo = wx.getSystemInfoSync();buff.width = sysinfo.windowWidth;buff.height = sysinfo.windowHeight;//由于无法控制css的宽高,只能缩小画布实现放大canvas.width = sysinfo.windowWidth/4;
/** * * 此样式在Android无法使用,导致模糊问题 * canvas.style.imageRendering='pixelated'; */var x = 10;var y = 10;var buffctx = buff.getContext('2d');var mainctx = canvas.getContext('2d');//背景色buffctx.fillStyle = '#ffffff';buffctx.fillRect(0, 0, buff.width, buff.height);//X图像数据var xdata = [ 1, 0, 0, 0, 1, 0, 1, 0, 1, 0, 0, 0, 1, 0, 0, 0, 1, 0, 1, 0, 1, 0, 0, 0, 1];var img=buffctx.getImageData(x,y,5,5);for(var i=0,m=xdata.length;i<m;i++){ //每像素4字节 if(xdata[i] == 1){ img.data[i * 4] = 0; img.data[i * 4+1] = 0; img.data[i * 4+2] = 0; img.data[i * 4+3] = 255; } else { img.data[i * 4] = 255; img.data[i * 4 + 1] = 255; img.data[i * 4 + 2] = 255; img.data[i * 4 + 3] = 255; }}//画入buffbuffctx.putImageData(img, x, y);//从buff画入主屏,此时产生缩放效果setInterval(function(){ mainctx.drawImage(buff, 0, 0); },1000); |

你确定在IOS可以吗?
官方大兄弟,有考虑支持的可能吗?[/滑稽]