图1是ios的效果,图2是android的效果,图3是代码片段,求canvas大神指点
楼主你好,我这里有一份画圆角的代码,在android上测试ok的,请参考
roundRect1: function (x, y, w, h, r) {
// 开始绘制
const ctx = this.ctx
ctx.beginPath();
this.ctx.setFillStyle(’#ffffff’);
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);
this.ctx.fill();
this.ctx.setGlobalAlpha(0.04);
this.ctx.setShadow(0, 2, 4, ‘#000000’)
ctx.closePath();
this.ctx.draw(true)
return this;
}
你好,请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。
你好,我这里有一份canvas画圆角的代码,在android上是ok的,请参考
roundRect1: function (x, y, w, h, r) {
// 开始绘制
const ctx = this.ctx
ctx.beginPath();
this.ctx.setFillStyle(’#ffffff’);
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);
this.ctx.fill();
this.ctx.setGlobalAlpha(0.04);
this.ctx.setShadow(0, 2, 4, ‘#000000’)
ctx.closePath();
this.ctx.draw(true)
return this;
}