一张背景图，一个二维码，生成一张全屏海报，二维码位于右下角（二维码位置可以调整）
方法思路：使用微信小程序的canvas组件
1、获取canvas组件定义一个canvas上下文
2、获取设备信息，将设备宽高设置为canvas画布的大小
3、在图片加载完成后开始绘制，可以调整绘制图片的起始位置坐标以及大小
4、绘制完成后将canvas转成图片
5、下载到图库
<canvas type="2d" id="myCanvas"></canvas>
handleImg() {try {const query = wx.createSelectorQuery();query.select('#myCanvas').fields({node: true,size: true}).exec((res) => {const canvas = res[0].node;const ctx = canvas.getContext('2d');const systemInfo = wx.getSystemInfoSync();const dpr = systemInfo.pixelRatio;const { windowWidth, windowHeight } = systemInfo// 根据设备的像素比 把画布设为全屏canvas.width = windowWidth * dpr;canvas.height = windowHeight * dpr;ctx.scale(dpr, dpr)let that = thisconst img = canvas.createImage();img.src = '第一张图片的url';img.onload = () => {const qrcodeImg = canvas.createImage();qrcodeImg.src = '第二张图片的url'qrcodeImg.onload = () => {// 绘制第一张图片ctx.drawImage(img, 0, 0, windowWidth, windowHeight);// 绘制第二张图片ctx.drawImage(qrcodeImg, windowWidth - 100, windowHeight - 100, 60, 60);// 延时保存图片setTimeout(() => {wx.canvasToTempFilePath({canvas,destWidth: windowWidth * dpr,destHeight: windowHeight * dpr,success(res) {console.log('生成的图片路径:', res.tempFilePath);that.saveImageToAlbum(res.tempFilePath)},fail(err) {console.error('canvasToTempFilePath 保存失败:', err);});}, 500);}};});} catch (err) {console.log('trycatch失败',err)}},saveImageToAlbum(filePath) {wx.saveImageToPhotosAlbum({filePath: filePath,success(res) {wx.showToast({title: '保存成功',icon: 'success',duration: 2000});},fail(err) {console.error('保存失败:', err);}});},
注意：
- 等图片加载完成后开始绘制
- 绘制完成后稍加延迟再转成图片
把图片链接准备好替换代码中的占位文字即可运行
