uniapp 图片涂鸦、画笔 Ba-ImagePaint

图片涂鸦、画笔 Ba-ImagePaint

简介(下载地址

Ba-ImagePaint 是一款uniapp图片涂鸦、画笔插件,可缩放、拖动,更好的支持大图、长图,可用于图片的涂鸦,以及pdf等文档长图的标记、批改等等。

  • 支持切换画笔颜色、粗细
  • 支持橡皮擦
  • 支持拖动缩放
  • 支持上一步、下一步
  • 支持一键清空
  • 支持自定义页面标题

可与uniapp自带的 uni.chooseImage 搭配使用。

也可与原生插件 图片选择插件 Ba-MediaPicker 搭配使用。(文档

插件本身也自带选择图片方法 selectImage (参考使用方法)。

截图展示

在这里插入图片描述

使用方法

script 中引入组件

	const imagePaint = uni.requireNativePlugin('Ba-ImagePaint')

script 中调用

		methods: {
			imageEdit() {//图片涂鸦
				imagePaint.imageEdit({
						titleName: '涂鸦', //编辑页面标题
						path: this.path,//原始图片路径
						outputPath: this.outputPath,//保存图片路径
					},
					(ret) => {
						console.log(ret)
						if (ret.outputPath && ret.isImageEdit) {
							this.path = ret.outputPath;
						}
					});
			},
			selectImage() {//选择图片(本插件)
				imagePaint.selectImage(
					(ret) => {
						console.log(ret)
						if (ret.outputPath) {
							this.path = ret.outputPath;
						}
					});
			},
			selectPicture() {//选择图片(uniapp)
				let that = this;
				uni.chooseImage({
					count: 1, 
					sizeType: ['original', 'compressed'],
					sourceType: ['album'], 
					success: function(res) {
						console.log(JSON.stringify(res.tempFilePaths));
						that.path = res.tempFilePaths[0];
					}
				});
			},
		}

编辑图片 imageEdit 方法参数

属性名类型默认值说明
pathString‘’原始图片路径,不能为空
outputPathString/storage/emulated/0/Pictures/BaImageEditor/tietu{时间毫秒}.png保存图片路径
titleNameString‘图片编辑’编辑页面标题

编辑图片 imageEdit 回调参数

属性名类型说明
isImageEditBoolean是否编辑图片
outputPathString图片编辑输出目录

选择图片 selectImage 回调参数

属性名类型说明
outputPathString图片选择输出目录

系列插件

图片选择插件 Ba-MediaPicker文档

图片编辑插件 Ba-ImageEditor文档

文件选择插件 Ba-FilePicker文档

应用消息通知插件 Ba-Notify文档

应用未读角标插件 Ba-Shortcut-Badge文档

应用开机自启插件 Ba-Autoboot文档

扫码原生插件(毫秒级、支持多码)文档

扫码原生插件 - 新(可任意自定义界面版本)文档

动态修改状态栏、导航栏背景色、字体颜色插件 Ba-AppBar文档

原生sqlite本地数据库管理 Ba-Sqlite文档

安卓保活插件 Ba-KeepAlive文档

安卓快捷方式(桌面长按app图标) Ba-Shortcut文档

自定义图片水印 Ba-Watermark文档

视频压缩插件 Ba-VideoCompressor文档

动态切换应用图标、名称(如新年、国庆等) Ba-ChangeIcon文档

原生Toast弹窗提示(可穿透界面) Ba-Toast文档

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值