async createNewImg() {
let that = this;
const {mainPic, topPic, avatar, bottomPic, erPic} = this
console.log(mainPic, topPic, avatar, bottomPic, erPic)
// this.mainPic = await this.getImageInfo(this.mainPic)[0].path // 处理图片
// this.erPic = await this.getImageInfo(this.erPic)[0].path // 处理图片
// this.topPic = await this.getImageInfo(this.topPic)[0].path // 处理图片
// this.bottomPic = await this.getImageInfo(this.bottomPic)[0].path // 处理图片
this.mainPic = (await this.getImageInfo(this.mainPic)).path // 处理图片
this.topPic = (await this.getImageInfo(this.topPic)).path // 处理图片
this.bottomPic = (await this.getImageInfo(this.bottomPic)).path // 处理图片
this.avatar = (await this.getImageInfo(this.avatar)).path // 处理图片
// this.erPic = await this.getBase64ImageInfo(this.erPic)
var context = uni.createCanvasContext('mycanvas');
// context.setFillStyle("rgba(0,0,0,0)") // #F24077 // 背景颜色
const cw = this.canvasW
const bl = cw / 750
context.fillRect(0, 0, cw, 1550 / 750 * (cw)) // 667 绘制一个矩形作为背景矩形x坐标、y坐标、图片宽、高
context.drawImage(this.mainPic, 0, 0, cw, 1360 / 750 * cw); // 262 349
context.drawImage(this.topPic, 0, 0, cw, 58 / 750 * cw);
// 绘制圆角矩形
context.save();
context.beginPath();
context.arc(bl * 30 + 25, bl * 145 + 25, 25, 0, 2 * Math.PI); // 圆心坐标(100, 100)，半径为100
context.setStrokeStyle('#333333')
context.stroke()
context.closePath();
context.clip()
//绘制图像
context.drawImage(this.avatar, bl * 30, bl * 145, 50, 50);
context.restore(); // 恢复之前保存的绘图上下文状态
// 绘制圆角矩形
context.save();
context.beginPath();
context.arc(cw / 750 * 6 + cw / 750 * 158 / 2 + 13, 1360 / 750 * cw + cw / 750 * 158 / 2 + 10, cw / 750 * 158 / 2, 0, 2 * Math.PI); // 圆心坐标(100, 100)，半径为100
context.setStrokeStyle('#333333')
context.stroke()
context.closePath();
context.clip()
//绘制右下角小程序二维码
context.drawImage(this.erPic, cw / 750 * 6 + 13, 1360 / 750 * cw + 10, cw / 750 * 158, cw / 750 * 158);
context.restore(); // 恢复之前保存的绘图上下文状态
context.drawImage(this.bottomPic, 0, 1360 / 750 * cw, cw, cw / 750 * 197);
context.setFontSize(26);
// context.setFillStyle('#000'); // #FFF
context.setTextAlign('left');
if(this.txt.length>7) {
this.txt = this.txt.slice(0,7)+ '...'
}
context.fillText(this.txt, bl * 130, bl * 175);
context.stroke();
// context.setFontSize(15);
// context.setFillStyle('#333');
// context.setTextAlign('left');
// // context.fillText(todaySaying, 37, 480);
// this.drawText(context, todaySaying, 37, 470, 30, 300); // 调用行文本换行函数（300则换行）
// context.stroke();
context.draw();
// });
//将生成好的图片保存到本地
setTimeout(function() {
uni.canvasToTempFilePath({
canvasId: 'mycanvas',
success: function(res) {
var tempFilePath = res.tempFilePath;
that.imagePath = tempFilePath;
that.canvasHidden = true
that.baocun()
console.log('将生成好的图片保存到本地', res, that.imagePath)
},
fail: function(res) {
console.log(res);
}
}, that);
}, 200);
},
//点击保存到相册
baocun() {
var that = this
let {
imagePath
} = this
console.log('点击保存到相册', imagePath)
wx.showShareImageMenu({
path: imagePath,
success: ()=>{
},
fail: (res)=> {
console.log(res)
if( res.errMsg.indexOf('deny')!=-1||res.errMsg.indexOf('denied')!=-1 ){
uni.showModal({
title: '提示',
content: '需要您授权保存相册',
showCancel: false,
success() {
uni.openSetting({
success(settingdata) {
if (settingdata.authSetting[
'scope.writePhotosAlbum']) { //是否授权保存到相册
wx.showModal({
title: '提示',
content: '获取权限成功,再次保存图片即可成功',
showCancel: false,
})
} else {
uni.showModal({
title: '提示',
content: '获取权限失败，无法保存到相册',
showCancel: false,
})
}
},
})
},
fail() {
uni.$u.toast('您已取消')
},
})
}
}
})
// uni.saveImageToPhotosAlbum({
// filePath: imagePath,
// success(res) {
// uni.showModal({
// content: '海报已保存到相册',
// showCancel: false,
// confirmText: '去分享',
// confirmColor: '#333',
// success: function(res) {
// if (res.confirm) {
// console.log('用户点击确定');
// wx.showShareImageMenu({
// path: imagePath
// })
// /* 该隐藏的隐藏 */
// that.maskHidden = false
// }
// },
// fail: function(res) {
// console.log(11111)
// }
// })
// },
// fail() {
// uni.showModal({
// title: '提示',
// content: '需要您授权保存相册',
// showCancel: false,
// success() {
// uni.openSetting({
// success(settingdata) {
// if (settingdata.authSetting[
// 'scope.writePhotosAlbum']) { //是否授权保存到相册
// wx.showModal({
// title: '提示',
// content: '获取权限成功,再次保存图片即可成功',
// showCancel: false,
// })
// } else {
// uni.showModal({
// title: '提示',
// content: '获取权限失败，无法保存到相册',
// showCancel: false,
// })
// }
// },
// })
// },
// fail() {
// uni.$u.toast('您已取消')
// },
// })
// },
// })
},
