小程序
小游戏
企业微信
微信支付
扫描小程序码分享
社区中关于canvas有其他的问题解决或没有解决不在此一一缀述,最近在使用小程序写canvas的确遇见一些抓破头皮的坑,还请各路大神显神通,救救弟弟!
问题简述:canvas的圆角真机不显示
业务需求:使用canvas画头像,带有圆角
效果图:
问题描述:
设置canvas所在view为圆角,canvas设置为圆角,在开发工具显示正常,安卓真机预览样式无效。
使用canvas画图片为圆角,只有左上角画出来是圆角,其余角均直角,样式无效,开发工具上也不显示。
1 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
用clip做
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
用clip做
// ctx.beginPath()
// 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.closePath()
// // 剪切
// this.ctx.clip()