业务场景
生成一个由背景图片、文字、icon、二维码组合的图片,保存至本地相册。由于生成的二维码为支付二维码切真实存在,这里做了马赛克处理。不是我canvas生成上去的吼。
实现思路:定义一个canvas,然后将他隐藏。生成了二维码后点击保存二维码时在canvas中绘制图形,然后调用canvasToTempFilePath方法把当前画布内容导出成指定大小的图片,返回图片路径,然后调用saveImageToPhotosAlbum将图片保存到本地。完成操作。
前端代码: (只展示了canvas和保存二维码的前端代码,其中页面显示的图像是html语言,并不是canvas)
js代码: canvasHidden:true控制canvas隐藏。
data: {
canvasHidden:true
},
保存二维码按钮的函数:
hidePayLayer(e){
var codeimgs = this.data.codeimgs //生成的二维码图像
const ctx = wx.createCanvasContext('share'); //获取到canvas实