一 生成海报
菜鸟第一次接触这个业务,部分代码参考了 https://blog.csdn.net/zhihui1017/article/details/80302574 这篇博客,生成方法讲的比较清楚,就不再赘述了,记录一些自己遇到的坑
提供一个生成带圆角矩形的方法
// 生成圆角矩形
roundRect(ctx,x, y, width, height, radius) {
if (width < 2 * radius) radius = width / 2;
if (height < 2 * radius) radius = height / 2;
ctx.beginPath();
ctx.moveTo(x + radius, y);
ctx.arcTo(x + width, y, x + width, y + height,radius); // 右上
ctx.arcTo(x + width, y + height, x, y + height,radius); // 右下
ctx.arcTo(x, y + height, x, y,radius); // 左下
ctx.arcTo(x, y, x + width, y, radius);// 左上
ctx.closePath();
return ctx;
},
tips:尝试用这个方法画一条分割线,微信开发者工具正常显示,真机不显示,后来更改为fillRect方法