其他分享
首页 > 其他分享> > Gallery模块管理系统相册,支持从相册中选择图片或视频文件、保存图片或视频文件到相册等功能。通过plus.gallery获取相册管理对象

Gallery模块管理系统相册,支持从相册中选择图片或视频文件、保存图片或视频文件到相册等功能。通过plus.gallery获取相册管理对象

作者:互联网

方法:

对象:

回调方法:

权限:

5+功能模块(permissions)

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#ffffff">{</span>
<span style="color:#87ceeb">// ...</span>
<span style="color:#ffa0a0">"permissions"</span><span style="color:#ffffff">:{</span>
	<span style="color:#87ceeb">// ...</span>
	<span style="color:#ffa0a0">"Gallery"</span><span style="color:#ffffff">:</span> <span style="color:#ffffff">{</span>
		<span style="color:#ffa0a0">"description"</span><span style="color:#ffffff">:</span> <span style="color:#ffa0a0">"系统相册"</span>
	<span style="color:#ffffff">}</span>
<span style="color:#ffffff">}</span>
<span style="color:#ffffff">}</span>
			</code></span></span>

pick

从系统相册选择文件(图片或视频)

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">pick</span><span style="color:#ffffff">(</span><span style="color:#ffffff">successCB</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> errorCB</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> options</span><span style="color:#ffffff">);</span>
				</code></span></span>

说明:

从系统相册中选择图片或视频文件。每次仅能选择一个文件,选择后将返回选择的文件路径。

参数:

返回值:

void : 无

平台支持:

示例:

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#87ceeb">// 从相册中选择图片 </span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> galleryImg</span><span style="color:#ffffff">()</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// 从相册中选择图片</span><span style="color:#ffffff">
	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"从相册中选择图片:"</span><span style="color:#ffffff">);</span><span style="color:#ffffff">
    plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">pick</span><span style="color:#ffffff">(</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">path</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffffff">path</span><span style="color:#ffffff">);</span>
    <span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>function</strong></span> <span style="color:#ffffff">(</span><span style="color:#ffffff"> e </span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span> <span style="color:#ffa0a0">"取消选择图片"</span> <span style="color:#ffffff">);</span>
    <span style="color:#ffffff">},</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">filter</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">"image"</span><span style="color:#ffffff">}</span> <span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
<span style="color:#87ceeb">// 从相册中选择多张图片 </span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> galleryImgs</span><span style="color:#ffffff">(){</span>
	<span style="color:#87ceeb">// 从相册中选择图片</span><span style="color:#ffffff">
	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"从相册中选择多张图片:"</span><span style="color:#ffffff">);</span><span style="color:#ffffff">
    plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">pick</span><span style="color:#ffffff">(</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span>
    	<span style="color:#f0e68c"><strong>for</strong></span><span style="color:#ffffff">(</span><span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> i </span><span style="color:#f0e68c"><strong>in</strong></span><span style="color:#ffffff"> e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">files</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
	    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">files</span><span style="color:#ffffff">[</span><span style="color:#ffffff">i</span><span style="color:#ffffff">]);</span>
    	<span style="color:#ffffff">}</span>
    <span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>function</strong></span> <span style="color:#ffffff">(</span><span style="color:#ffffff"> e </span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span> <span style="color:#ffa0a0">"取消选择图片"</span> <span style="color:#ffffff">);</span>
    <span style="color:#ffffff">},{</span><span style="color:#ffffff">filter</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">"image"</span><span style="color:#ffffff">,</span><span style="color:#ffffff">multiple</span><span style="color:#ffffff">:</span><span style="color:#f0e68c"><strong>true</strong></span><span style="color:#ffffff">});</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

uni-app使用plus注意事项

save

保存文件到系统相册中

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">save</span><span style="color:#ffffff">(</span><span style="color:#ffffff"> path</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> successCB</span><span style="color:#ffffff">,</span><span style="color:#ffffff"> errorCB </span><span style="color:#ffffff">);</span>
				</code></span></span>

说明:

保存文件到系统相册中。 每次仅能保存一个文件,支持图片文件(jpg/jpeg、png、bmp等格式)和视频文件(3gp、mov等格式)。 若保存的文件类型当前系统不支持,则通过errorCB回调返回错误信息。

参数:

返回值:

void : 无

平台支持:

示例:

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#87ceeb">// 保存图片到相册中 </span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> savePicture</span><span style="color:#ffffff">()</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
	plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">save</span><span style="color:#ffffff">(</span> <span style="color:#ffa0a0">"_doc/a.jpg"</span><span style="color:#ffffff">,</span> <span style="color:#f0e68c"><strong>function</strong></span> <span style="color:#ffffff">()</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
		alert</span><span style="color:#ffffff">(</span> <span style="color:#ffa0a0">"保存图片到相册成功"</span> <span style="color:#ffffff">);</span>
	<span style="color:#ffffff">}</span> <span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

uni-app使用plus注意事项

GalleryOptions

JSON对象,从相册中选择文件的参数

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>interface</strong></span><span style="color:#ffffff"> plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#98fb98">GalleryOptions</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Boolean</span><span style="color:#ffffff"> animation</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">String</span><span style="color:#ffffff"> confirmText</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">GalleryCropStyles</span><span style="color:#ffffff"> crop</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Boolean</span><span style="color:#ffffff"> editable</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">String</span><span style="color:#ffffff"> filename</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">GalleryFilter</span><span style="color:#ffffff"> filter</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Number</span><span style="color:#ffffff"> maximum</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Boolean</span><span style="color:#ffffff"> multiple</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Boolean</span><span style="color:#ffffff"> permissionAlert</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">PopPosition</span><span style="color:#ffffff"> popover</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Array</span><span style="color:#ffffff"><</span><span style="color:#98fb98">String</span><span style="color:#ffffff">></span><span style="color:#ffffff"> selected</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Boolean</span><span style="color:#ffffff"> system</span><span style="color:#ffffff">;</span><span style="color:#ffffff">
	attribute </span><span style="color:#98fb98">Function</span><span style="color:#ffffff"> onmaxed</span><span style="color:#ffffff">;</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

属性:

GalleryCropStyles

裁剪图片设置项

说明:

注意:HBuilderX3.1.19及以上版本支持。

属性:

GalleryFilter

相册选择文件过滤类型

属性:

GallerySaveEvent

保存图片到相册成功事件

属性:

PopPosition

JSON对象,弹出拍照或摄像界面指示位置

属性:

GalleryPickSuccessCallback

单选系统相册图片成功的回调

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onSuccess</span><span style="color:#ffffff">(</span><span style="color:#ffffff"> file </span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// Success code</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

说明:

系统相册中单选图片或视频文件成功的回调函数,在选择文件操作成功时调用。

参数:

返回值:

void : 无

示例:

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#87ceeb">// 从相册中选择单张图片 </span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> galleryImg</span><span style="color:#ffffff">()</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// 从相册中选择图片</span><span style="color:#ffffff">
	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"从相册中选择图片:"</span><span style="color:#ffffff">);</span><span style="color:#ffffff">
    plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">pick</span><span style="color:#ffffff">(</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">path</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffffff">path</span><span style="color:#ffffff">);</span>
    <span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>function</strong></span> <span style="color:#ffffff">(</span><span style="color:#ffffff"> e </span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span> <span style="color:#ffa0a0">"取消选择图片"</span> <span style="color:#ffffff">);</span>
    <span style="color:#ffffff">},</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">filter</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">"image"</span><span style="color:#ffffff">}</span> <span style="color:#ffffff">);</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

uni-app使用plus注意事项

GalleryMultiplePickSuccessCallback

多选系统相册图片成功的回调

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onSuccess</span><span style="color:#ffffff">(</span> <span style="color:#f0e68c"><strong>event</strong></span> <span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// Pick success</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> files </span><span style="color:#ffffff">=</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">.</span><span style="color:#ffffff">files</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb">// 保存多选的图片或视频文件路径</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

说明:

系统相册中多选图片或视频文件成功的回调函数,在多选择文件操作成功时调用。

参数:

返回值:

void : 无

示例:

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#87ceeb">// 从相册中选择多张图片 </span>
<span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff"> galleryImgs</span><span style="color:#ffffff">(){</span>
	<span style="color:#87ceeb">// 从相册中选择图片</span><span style="color:#ffffff">
	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffa0a0">"从相册中选择多张图片:"</span><span style="color:#ffffff">);</span><span style="color:#ffffff">
    plus</span><span style="color:#ffffff">.</span><span style="color:#ffffff">gallery</span><span style="color:#ffffff">.</span><span style="color:#ffffff">pick</span><span style="color:#ffffff">(</span> <span style="color:#f0e68c"><strong>function</strong></span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">){</span>
    	<span style="color:#f0e68c"><strong>for</strong></span><span style="color:#ffffff">(</span><span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> i </span><span style="color:#f0e68c"><strong>in</strong></span><span style="color:#ffffff"> e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">files</span><span style="color:#ffffff">){</span><span style="color:#ffffff">
	    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span><span style="color:#ffffff">e</span><span style="color:#ffffff">.</span><span style="color:#ffffff">files</span><span style="color:#ffffff">[</span><span style="color:#ffffff">i</span><span style="color:#ffffff">]);</span>
    	<span style="color:#ffffff">}</span>
    <span style="color:#ffffff">},</span> <span style="color:#f0e68c"><strong>function</strong></span> <span style="color:#ffffff">(</span><span style="color:#ffffff"> e </span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span><span style="color:#ffffff">
    	console</span><span style="color:#ffffff">.</span><span style="color:#ffffff">log</span><span style="color:#ffffff">(</span> <span style="color:#ffa0a0">"取消选择图片"</span> <span style="color:#ffffff">);</span>
    <span style="color:#ffffff">},{</span><span style="color:#ffffff">filter</span><span style="color:#ffffff">:</span><span style="color:#ffa0a0">"image"</span><span style="color:#ffffff">,</span><span style="color:#ffffff">multiple</span><span style="color:#ffffff">:</span><span style="color:#f0e68c"><strong>true</strong></span><span style="color:#ffffff">});</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

uni-app使用plus注意事项

GallerySuccessCallback

操作系统相册成功的回调

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> onSuccess</span><span style="color:#ffffff">(</span><span style="color:#98fb98">GallerySaveEvent</span> <span style="color:#f0e68c"><strong>event</strong></span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// Success code</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

说明:

系统相册操作成功的回调函数,在保存文件到系统相册操作成功时调用。

参数:

返回值:

void : 无

GalleryErrorCallback

系统相册操作失败的回调

<span style="background-color:#333333"><span style="color:#474747"><code>
<span style="color:#f0e68c"><strong>void</strong></span><span style="color:#ffffff"> one rror</span><span style="color:#ffffff">(</span><span style="color:#ffffff"> error </span><span style="color:#ffffff">)</span> <span style="color:#ffffff">{</span>
	<span style="color:#87ceeb">// Handle error</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> code </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> error</span><span style="color:#ffffff">.</span><span style="color:#ffffff">code</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb">// 错误编码</span>
	<span style="color:#f0e68c"><strong>var</strong></span><span style="color:#ffffff"> message </span><span style="color:#ffffff">=</span><span style="color:#ffffff"> error</span><span style="color:#ffffff">.</span><span style="color:#ffffff">message</span><span style="color:#ffffff">;</span> <span style="color:#87ceeb">// 错误描述信息</span>
<span style="color:#ffffff">}</span>
				</code></span></span>

说明:

系统相册操作失败的回调函数,在选择或保存图片操作失败时调用。

参数:

返回值:

void : 无

标签:function,console,log,相册,选择,视频文件,图片
来源: https://blog.csdn.net/qq_40575646/article/details/122812440