canvas 绘制圆角矩形头像在安卓机上大概率无法绘制
- 当前 Bug 的表现(可附上截图) 绘制圆角矩形头像在安卓机上大概率绘制不出, iOS 和开发工具都是正常的 [图片] - 预期表现 预计表现如图所示: [图片] - 提供一个最简复现 Demo [代码]export [代码][代码]function[代码] [代码]drawRoundRect (ctx, x, y, w, h, r, url) {[代码][代码] [代码][代码]ctx.save()[代码][代码] [代码][代码]ctx.beginPath()[代码][代码] [代码][代码]ctx.setFillStyle([代码][代码]'transparent'[代码][代码])[代码][代码] [代码][代码]ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5)[代码][代码] [代码][代码]ctx.moveTo(x + r, y)[代码][代码] [代码][代码]ctx.lineTo(x + w - r, y)[代码][代码] [代码][代码]ctx.lineTo(x + w, y + r)[代码][代码] [代码][代码]ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2)[代码][代码] [代码][代码]ctx.lineTo(x + w, y + h - r)[代码][代码] [代码][代码]ctx.lineTo(x + w - r, y + h)[代码][代码] [代码][代码]ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5)[代码][代码] [代码][代码]ctx.lineTo(x + r, y + h)[代码][代码] [代码][代码]ctx.lineTo(x, y + h - r)[代码][代码] [代码][代码]ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI)[代码][代码] [代码][代码]ctx.lineTo(x, y + r)[代码][代码] [代码][代码]ctx.lineTo(x + r, y)[代码][代码] [代码][代码]ctx.fill()[代码][代码] [代码][代码]ctx.closePath()[代码][代码] [代码][代码]ctx.clip()[代码][代码] [代码][代码]ctx.drawImage(url, x, y, w, h)[代码][代码] [代码][代码]ctx.restore()[代码][代码] [代码][代码]return[代码] [代码]ctx[代码][代码]}[代码] 后检测出问题是:[代码]ctx.setFillStyle([代码][代码]'transparent'[代码][代码]) [代码] 这行代码导致安卓机上大概率绘制不出圆角矩形头像。注释掉就正常了。 该行代码目的:因为边缘描边存在锯齿,最好指定使用 transparent 填充 想请问下具体是什么原因