手机相册管理(gallery) ---- HTML5+
模块:gallery
Gallery模块管理系统相册,支持从相册中选择图片或视频文件、保存图片或视频文件到相册等功能。通过plus.gallery获取相册管理对象。
管理我们手机上用到的相册:选择图片,和保存图片;
应用场景:朋友圈发照片,QQ空间发视频,添加图片附件,添加视频附件;
这个不需要初始化(new): 它有两个核心的方法:pick() 选取,save();保存;
void plus.gallery.pick(successCB,errorCB,option);
void plus.gallery.save(path,successCB,errorCB);
option选项:
animation //是否显示系统相册文件选择界面的动画,可取值true、false,默认值为true。
filename //某些系统不能直接使用系统相册的路径,这时需要将选择的文件保存到应用可访问的目录中,可通过此参数设置保存文件的路径。
filter //系统相册选择器中可选择的文件类型,可设置为仅选择图片文件(“image”)、视频文件(“video”)或所有文件(“none”),默认值为“image”。
maximum //仅在支持多选时有效,取值范围为1到Infinity,默认值为Infinity,即不限制选择的图片数。 如果设置的值非法则使用默认值Infinity。
multiple //(Boolean 类型 )是否支持多选图片
onmaxed: //(Function 类型 )超过最多选择图片数量事件
popover: //(PopPosition 类型 )相册选择界面弹出指示区域
selected: //(Array[ String ] 类型 )已选择的图片路径列表
system: //(Boolean 类型 )是否使用系统相册文件选择界面
具体示例:
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">手机相册管理</h1>
</header>
<div class="mui-content mui-content-padded">
<button type="button" id="btnselectImg" class="mui-btn mui-btn-blue mui-btn-block">选择一张图片</button>
<img src="" alt="" id="selectImg" />
<button type="button" id="btnselectMoreImg" class="mui-btn mui-btn-blue mui-btn-block">多选图片</button>
<div id="imglist"></div>
</div>
<script src='http://libs.baidu.com/jquery/1.8.3/jquery.min.js'></script>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.plusReady(function(){
// 选择一张图片
$("#btnselectImg").bind('tap',function(){
plus.gallery.pick(function(file){
plus.io.resolveLocalFileSystemURL(file,function(entry){
$("#selectImg").attr("src",entry.fullPath);
});
},function(e){},{});
});
//多选图片
$("#btnselectMoreImg").bind('tap',function(){
plus.gallery.pick(function(event){
var files = event.files;
for(var i=0;i<files.length;++i){
var file = files[i];
plus.io.resolveLocalFileSystemURL(file,function(entry){
//$("#imglist").attr("src",entry.fullPath);
$("#imglist").append("<img src='"+entry.fullPath+"' />");
});
}
},function(e){},{});
});
});
</script>
手机相册管理(gallery) ---- HTML5+的更多相关文章
- PhoneGap奇怪的现象:File FileTransfer download, 手机相册检测不到下载下来的图片(解决)
我有个从服务器下载相片的功能在使用 File FileTransfer download api时,碰到了很奇怪的现象:图片已经从服务器里下载了,手机文件夹里也可以看到下载过来的图片,但是我的手机相册 ...
- WebApp调用手机相册或摄像头、拨打电话
WebApp调用手机相册或摄像头.拨打电话 一.总结 一句话总结:input标签,指定type为file,选择好对应的accept即可.camera——相机,相应的accept为image : cam ...
- iOS 从手机相册里选取图片
#import <UIKit/UIKit.h> @interface AppDelegate : UIResponder <UIApplicationDelegate> @pr ...
- 微信公众号与HTML 5混合模式揭秘2——分享手机相册中照片
本书是分享微信jssdk开发的第二篇. 4.2.1 项目需求 需求说明:实现微信端的手机用户,点击按钮选取1张图片,分享到朋友圈. 4.2.2 需求分解 通过对需求的了解,可以将其分解为: ( ...
- 小程序canvas生成海报保存至手机相册
小程序canvas画图保存至手机相册 (1)可直接展示生成的海报 .因手机分辨率不同可能导致生成的海报会有细微差别,这里隐藏canvas海报,页面正常设置海报样式保存时保存隐藏的canvas海报 (2 ...
- 【小白技术笔记】保存皮皮虾APP无水印视频到手机相册,只需要三步 [技术干货]
百万段友回皮皮虾,转身一变,都成了皮友.作为当年的资深段友,今天的皮友的我.看到好视频,经典视频,搞笑视频,就想保存一份到手机相册,然后皮皮虾啊皮皮虾,有个让人很讨厌的地方,保存视频的时候就有皮皮虾的 ...
- MVC3学习:实现简单的相册管理和图片管理
相册管理说白了就是文件夹管理,因此要用到命名空间using System.IO; 一.先来做相册管理,添加相册我就不做了,就是添加文件夹,这里主要做一下相册的显示.相册在页面上显示,需要一张图片,可以 ...
- 强大的安卓手机远程管理工具 – Droidjack
免责声明:本站提供安全工具.程序(方法)可能带有攻击性,仅供安全研究与教学之用,风险自负! Droidjack是一款针对安卓手机远程管理工具,你可以利用它在PC上对手机进行远程操控,不仅功能强大,使用 ...
- ios最新调用手机相册选取头像(UIActionSheet过期)
由于 UIActionSheet过期所以可以使用如下调用手机相册 前提不要忘记添加代理如下两个 UIImagePickerControllerDelegate,UINavigationControll ...
随机推荐
- dvi 中的内容居中
text-align:right; 文本居中 line-height:35px;*垂直居中*
- Js加密与解密
<html><head><META HTTP-EQUIV="MSThemeCompatible" CONTENT="Yes"> ...
- SpringMVC & SpringBoot小记
SpringMVC 1.SpringMVC常用注解 https://blog.csdn.net/lipinganq/article/details/79155072 :@Component.@Serv ...
- delete指针以后应赋值为NULL——QT deletelater指针以后也同样要马上赋值为NULL
delete p后,只是释放了指针指向的内存空间.p并不会自动被置为NULL,而且指针还在,同时还指向了之前的地址 delete NULL编译器不会报错(因为delete空指针是合法的) 例: 对一个 ...
- k-means算法及matlab实现
K-means算法很简单,它属于无监督学习算法中的聚类算法中的一种方法吧,利用欧式距离进行聚合啦. 解决的问题如图所示哈:有一堆没有标签的训练样本,并且它们可以潜在地分为K类,我们怎么把它们划分呢? ...
- nodejs基础 -- 交互式解析器(REPL)
------------类似在浏览器中调试js代码----------------------- Node.js REPL(交互式解释器) Node.js REPL(Read Eval Print L ...
- Python3的tcp socket接收不定长数据包接收到的数据不全。
Python Socket API参考出处:http://blog.csdn.net/xiangpingli/article/details/47706707 使用socket.recv(pack_l ...
- tarjan算法-解决有向图中求强连通分量的利器
小引 看到这个名词-tarjan,大家首先想到的肯定是又是一个以外国人名字命名的算法.说实话真的是很佩服那些算法大牛们,佩服得简直是五体投地啊.今天就遇到一道与求解有向图中强连通分量的问题,我的思路就 ...
- hbase 单机+伪分布环境搭建学习-1
1.单机模式: (1)编辑hbase-env.sh user@EBJ1023.local:/usr/local/flume_kafka_stom/hbase_1.1.2> vim conf/hb ...
- JavaScript编码encode和decode escape和unescape
encodeURI() 函数可把字符串作为 URI 进行编码. 语法 encodeURI(URIstring) 参数 描述 URIstring 必需.一个字符串,含有 URI 或其他要编码的文本. 返 ...