index.js
bindSave: function() {
let that = this;
wx.downloadFile({
url: 'https://xxxx', //头像
success: (res) => {
that.setData({
headimgFiles: res.tempFilePath
})
}
})
wx.showLoading({
title: '正在保存图片',
});
//先创建一个画布
var ctx = wx.createCanvasContext("poster")
//填充背景色
wx.downloadFile({
url: 'https://xxxx.jpg', //二维码地址
success: (res) => {
console.log('downloadFile成功')
ctx.drawImage("aaaaa.png", 0, 0, 960, 1200);//背景
ctx.setFontSize(153);
ctx.fillStyle = '#FFE401';
ctx.fillText(that.data.moneyNumber + '元', that.data.canvasMoneyLeft * that.data.windowWidth, 340 * that.data.windowWidth);
ctx.save();
ctx.beginPath();
ctx.arc(33 * that.data.windowWidth + 74, 39 * that.data.windowWidth + 74, 74, 0, Math.PI * 2, false);
ctx.clip();
ctx.drawImage(that.data.headimgFiles, 33 * that.data.windowWidth, 39 * that.data.windowWidth, 148, 148);
ctx.restore();
ctx.save(); //圆形头像
ctx.beginPath();
ctx.arc(350 * that.data.windowWidth + 144, 475 * that.data.windowWidth + 144, 144, 0, Math.PI * 2, false);
ctx.clip();
ctx.drawImage(res.tempFilePath, 350 * that.data.windowWidth, 475 * that.data.windowWidth, 284, 284);
ctx.restore(); //圆形二维码
ctx.draw(false, function() {
console.log('draw成功')
wx.canvasToTempFilePath({
canvasId: 'poster',
success: function(res) {
console.log('canvasToTempFilePath成功')
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
console.log(res)
wx.hideLoading();
wx.showToast({
title: '保存成功',
});
},
fail() {
wx.hideLoading()
}
})
}
})
})
}
})
}
复制代码