canvas签字后保存生成图片全部是黑色的了,但是在模拟器中生成的图片是正常的 [图片]
canvas保存生成图片部分是黑色了- 当前 Bug 的表现(可附上截图) 点击生成后一是手上会出现字的重叠, 保存到相册中的图下部分是黑色 [图片] [图片] - 预期表现 如图一,只是没有字的重叠 - 复现路径 - 提供一个最简复现 Demo [代码]<view style=[代码][代码]'width:0px;height:0px;overflow:hidden;'[代码][代码]>[代码][代码]<canvas canvas-id=[代码][代码]"myCanvas"[代码] [代码]style=[代码][代码]'width:375px;height:{{totheight}}px;'[代码][代码]>[代码][代码]</canvas>[代码][代码]</view>[代码]上面这个代码是想隐藏canvas,但会出现字的重叠,说明并么有实现 [代码]const ctx = wx.createCanvasContext([代码][代码]'myCanvas'[代码][代码])[代码] [代码] [代码][代码]ctx.drawImage(that.data.bgimg, 0, 0, that.data.screenwidth, that.data.useheight)[代码] [代码] [代码][代码]ctx.drawImage([代码][代码]"../../images/aaa.png"[代码][代码], 285, 10, 80, 83)[代码] [代码] [代码][代码]ctx.setFontSize(14);[代码][代码] [代码][代码]ctx.setFillStyle([代码][代码]'#'[代码] [代码]+ that.data.quot.color);[代码][代码] [代码][代码]ctx.fillText(that.data.date[[代码][代码]'0'[代码][代码]] + [代码][代码]' / '[代码] [代码]+ that.data.date[[代码][代码]'1'[代码][代码]], 292,30);[代码] [代码] [代码][代码]ctx.setFontSize(32);[代码][代码] [代码][代码]ctx.setFillStyle([代码][代码]'#'[代码] [代码]+ that.data.quot.color);[代码][代码] [代码][代码]ctx.fillText(that.data.date[[代码][代码]'2'[代码][代码]] , 307, 65);[代码] [代码] [代码][代码]ctx.setFontSize(16);[代码][代码] [代码][代码]ctx.setFillStyle([代码][代码]'#'[代码] [代码]+ that.data.quot.color);[代码][代码] [代码][代码]ctx.fillText(that.data.date[[代码][代码]'3'[代码][代码]],299,85);[代码] [代码] [代码] [代码] [代码][代码]var[代码] [代码]content = that.data.quot.content;[代码][代码] [代码][代码]var[代码] [代码]chr = content.split([代码][代码]""[代码][代码]);[代码] [代码] [代码][代码]var[代码] [代码]temp = [代码][代码]""[代码][代码];[代码][代码] [代码][代码]var[代码] [代码]row = [];[代码][代码] [代码][代码]ctx.setFontSize(17);[代码][代码] [代码][代码]ctx.setFillStyle([代码][代码]'#000000'[代码][代码]);[代码][代码] [代码][代码]for[代码] [代码]([代码][代码]var[代码] [代码]a = 0; a < chr.length; a++) {[代码][代码] [代码][代码]if[代码] [代码](ctx.measureText(temp).width < 355) {[代码][代码] [代码][代码]temp += chr[a];[代码][代码] [代码][代码]}[代码][代码] [代码][代码]else[代码] [代码]{[代码][代码] [代码][代码]a--; [代码][代码] [代码][代码]row.push(temp);[代码][代码] [代码][代码]temp = [代码][代码]""[代码][代码];[代码][代码] [代码][代码]}[代码][代码] [代码][代码]}[代码][代码] [代码][代码]row.push(temp); [代码][代码] [代码][代码]for[代码] [代码]([代码][代码]var[代码] [代码]b = 0; b < row.length; b++) {[代码][代码] [代码][代码]ctx.fillText(row[b], 10, that.data.useheight + 30 + b * 30, 355);[代码][代码] [代码][代码]var[代码] [代码]totheight = that.data.useheight + 100 + b * 30;[代码][代码] [代码][代码]}[代码][代码] [代码][代码]that.setData({[代码][代码] [代码][代码]totheight: totheight[代码][代码] [代码][代码]})[代码][代码] [代码][代码]ctx.draw([代码][代码]true[代码][代码],[代码][代码]function[代码][代码](res){[代码][代码] [代码][代码]wx.canvasToTempFilePath({[代码][代码] [代码][代码]canvasId: [代码][代码]'myCanvas'[代码][代码],[代码][代码] [代码][代码]fileType: [代码][代码]'jpg'[代码][代码],[代码][代码] [代码][代码]success: [代码][代码]function[代码] [代码](res) {[代码][代码] [代码][代码]wx.saveImageToPhotosAlbum({[代码][代码] [代码][代码]filePath: res.tempFilePath,[代码][代码] [代码][代码]success(res) {[代码][代码] [代码][代码]wx.hideLoading();[代码][代码] [代码][代码]wx.showToast({[代码][代码] [代码][代码]title: [代码][代码]'海报已存到相册'[代码][代码],[代码][代码] [代码][代码]})[代码][代码] [代码][代码]},[代码][代码] [代码][代码]fail() {[代码][代码] [代码][代码]wx.hideLoading();[代码][代码] [代码][代码]}[代码][代码] [代码][代码]})[代码][代码] [代码][代码]}[代码][代码] [代码][代码]})[代码][代码] [代码][代码]})[代码]请高手指点,再此谢过!
2020-11-23