废话不多说,开始
1.得到当前界面canvas。因为笔者用laya开发,所以介绍在laya中得到当前界面canvas的方法。
var canvas = Laya.stage.drawToCanvas(Laya.stage.width, Laya.stage.height, 0, 0).getCanvas();
2.调用toTempFilePathSync方法将当前 Canvas 保存为一个临时文件。
var tempFilePath = canvas.toTempFilePathSync({
x: 0,
y: 0,
width: 100,
height: 100,
destWidth: 100,
destHeight: 100,
fileType: 'jpg',
quality: 1.0
});
参数详情可通过toTempFilePathSync了解。
3.此时,tempFilePath已经相当于一个图片链接(tips 若需分享,可以tempFilePath直接当做图片链接调用分享接口即可)。通过wx.authorize向用户发起保存图片授权。如果已经授权直接返回成功。
wx.authorize({
scope: 'scope.writePhotosAlbum',//这里表示相册权限
success: function (res) {
//如果有授权过会直接返回成功,我们在这里就可以直接 调用保存图片的接口
Browser.window.wx.saveImageToPhotosAlbum({
filePath: tempFilePath,
success: function (res): void {
Browser.window.wx.showToast({
title: "截图已保存至相册,快快分享到朋友圈吧",
icon: "none",
image: "",
duration: 1500
})
},
fail: function (): void {
}
});
},
fail: function () {
//没有授权过,我们调用showModal弹出弹窗,告诉用户请求给予我们授权。
var alertParam = {
'title': '微信授权',
'content': '保存到相册需要您的授权,请给予我们授权',
'showCancel': true,
'canelColor': '#666',
'confirmText': '去授权',
'confirmColor': '#666',
success: function (ssa) {
//打开设置界面,设置界面只会出现小程序已经向用户请求过的权限。我们请求过保存图片的权限,所以里面会有相册的按钮,允许后点返回。则执行下面的success方法。调用保存图片的接口
if (ssa.confirm == true) {
wx.openSetting({
success: function () {
Browser.window.wx.saveImageToPhotosAlbum({
filePath: tempFilePath,
success: function (res): void {
Browser.window.wx.showToast({
title: "截图已保存至相册,快快分享到朋友圈吧",
icon: "none",
image: "",
duration: 1500
})
},
fail: function (): void {
}
});
}
})
}
}
};
//这里调用弹窗。
wx.showModal(alertParam);
}
})
很想请问下为什么我截图出来特别糊鸭,然后保存后就跟加糊了,头大。求大神帮助~~~
冲你这句 “废话不多说” 点赞了→_→
楼主,调用你的代码在laya中调试,getCanvas()方法报错,有遇到这种情况么?
我这边使用drawToCanvas 一直会报错 ImageData is not defined 你们有没有这种情况
改下标题,这不叫截屏,会误导别人
比文档,妥帖写。不过就是代码 格式有 修修 乱,
已修改格式。
感谢分享!!