当前位置: 移动技术网 > IT编程>脚本编程>Shell > uniapp对图片的操作

uniapp对图片的操作

2020年07月17日  | 移动技术网IT编程  | 我要评论

1、查看图片(这个方式可以长按图片进行保存)

//查看图片
lookImage(){
	// 预览图片
	let imgArr = [];
	/* 这里可以使用网络路径,也可以使用图片的base64编码 */
	imgArr.push('图片网络地址或者base64编码')
	//预览图片
	uni.previewImage({
		urls: imgArr,
		current: imgArr[0]
	});
},

2、保存图片到相册

downLoad(){
	/* 如果是这么写的,可以不使用button设置open-type属性*/
	/* 判断是否授权 */
	uni.authorize({
	    /* 这个就是保存相册的 */
	    scope: 'scope.writePhotosAlbum',
	    success:res=> {
			uni.getImageInfo({
				src:'../../static/yqh1.jpeg',
				success:res1=>{
					/* 保存图片方法 */
					uni.saveImageToPhotosAlbum({
						filePath:res1.path,
						success:res2=> {
							uni.showToast({
								title: "保存成功",
								icon: "none"
							});
						},
						fail:res=> {
							uni.showToast({
								title: "保存失败,请稍后重试:"+e.errMsg,
								icon: "none"
							});
						}
					});
				},
				fail:res1=> {
					console.log(res1)
				}
			})
	    },
		complete:res=> {
			/* 这里判断一下如果没有授权重新打开设置选项 */
			uni.getSetting({
				success:res1=> {
					if (!res1.authSetting['scope.writePhotosAlbum']) {
						/* 打开设置的方法 */
						this.hitAuth()
					}
				}
			});
		}
	});
},
/* 授权提示 ,这里就是重复提示用户去授权*/
hitAuth() {
	uni.showModal({
		content: '由于您还没有允许保存图片到您相册里,这无法进行保存操作点击确定去允许授权',
		success:res=>{
			if (res.confirm){
				/* 这个就是打开设置的API*/
				uni.openSetting({
					success:res1=>{
						console.log(res1.authSetting);
					}
				});
			}else if(res.cancel){
				uni.showModal({
					cancelText: '依然取消',
					confirmText: '重新授权',
					content: '很遗憾你点击了取消,这将无法进行保存操作,请在考虑一下',
					success:res1=>{
						if(res1.confirm) {
							uni.openSetting({
								success:res2=> {
									console.log(res2.authSetting);
								}
							});
						}else if(res1.cancel) {
							uni.showToast({
								title: "取消授权",
								icon: "none"
							});
						}
					}
				});
			}
		}
	});
}

本文地址:https://blog.csdn.net/weixin_39809852/article/details/107383207

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网