- 当前 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 填充
想请问下具体是什么原因
你好，请提供一下出现问题的机型和微信版本，以及能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。