uniapp实现附有二维码的图片的本地保存代码
时间: 2023-06-04 22:07:52 浏览: 227
uniapp小程序绘制二维码生成图片保存到本地
3星 · 编辑精心推荐
以下是使用uniapp实现附有二维码的图片本地保存的代码:
```javascript
//获取网络图片信息并下载保存
downloadImg() {
uni.downloadFile({
url: '网络图片url地址',
success: (res) => {
//临时文件路径
const filePath = res.tempFilePath;
//canvas绘图
this.getImageInfo(filePath)
}
})
},
//绘制图片和二维码
getImageInfo(imageSrc) {
uni.getImageInfo({
src: imageSrc,
success: (res) => {
const canvas = uni.createCanvasContext('canvas');
//图片宽高
const imgWidth = res.width;
const imgHeight = res.height;
//将图片绘制到canvas上
canvas.drawImage(imageSrc, 0, 0, imgWidth, imgHeight);
//二维码图片路径,自行生成
const codeSrc = '二维码图片url地址';
//绘制二维码到canvas上
canvas.drawImage(codeSrc, imgWidth - 100, imgHeight - 100, 80, 80);
//保存图片到相册
this.saveCanvas()
}
})
},
//保存canvas图片到相册
saveCanvas() {
uni.canvasToTempFilePath({
x: 0,
y: 0,
width: 400,
height: 400,
destWidth: 400,
destHeight: 400,
canvasId: 'canvas',
success: (res) => {
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
uni.showToast({
title: '保存成功',
icon: 'none'
})
},
fail: () => {
uni.showToast({
title: '保存失败',
icon: 'none'
})
}
})
}
})
}
```
请注意:这段代码不一定适用于所有情况,需要根据具体需求进行调整。
阅读全文