wxml
js:
//点击保存运行方法
save: function () {
var that = this;
that.setData({
hide: true
})
//获取相册授权
wx.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success() {//这里是用户同意授权后的回调
that.draws();
},
fail() {//这里是用户拒绝授权后的回调
that.setData({
saveImgBtnHidden: true,
openSettingBtnHidden: false
})
}
})
} else {//用户已经授权过了
that.draws();
}
}
})
},
//自带获取相册方法
handleSetting: function (e) {
let that = this;
// 对用户的设置进行判断,如果没有授权,即使用户返回到保存页面,显示的也是“去授权”按钮;同意授权之后才显示保存按钮
if (!e.detail.authSetting['scope.writePhotosAlbum']) {
wx.showModal({
title: '警告',
content: '若不打开授权,则无法将图片保存在相册中!',
showCancel: false
})
that.setData({
saveImgBtnHidden: true,
openSettingBtnHidden: false
})
} else {
wx.showModal({
title: '提示',
content: '您已授权,赶紧将图片保存在相册中吧!',
showCancel: false
})
that.setData({
saveImgBtnHidden: false,
openSettingBtnHidden: true
})
}
},
// 截取绘制的图片
draws: function () {
var that = this;
wx.canvasToTempFilePath({ //把当前画布指定区域的内容导出生成指定大小的图片
x: 0,
y: 0,
destWidth: 375 * 2,//输出图片宽度
destHeight: 603 * 2,//输出图片高度
canvasId: 'canvas', //画布标识
fileType: 'jpg', //保存的图片格式,默认是png
success: function (res) { //接口调用成功的回调函数
console.log(res.tempFilePath);
/* 这里 就可以显示之前写的 预览区域了 把生成的图片url给image的src */
that.setData({
prurl: res.tempFilePath,
})
wx.saveImageToPhotosAlbum({ //保存图片到系统相册
filePath: that.data.prurl, //图片文件路径
success(res) {
wx.showModal({ //显示模态弹窗
// title: '友好提醒',
content: '图片已保存到相册,邀请同道中人吧~', //提示的内容
showCancel: false, //是否显示取消按钮,默认为 true
confirmText: '好的', //确定按钮的文字
confirmColor: '#2aa145', //确定按钮的文字颜色
success: function (res) {
//接口调用成功的回调函数
if (res.confirm) {
})
} else {
}
}
})
},
fail: function () {
}
})
}
})
},