photoBrowserTodayNew
概述
当今是图文信息发达的时代，图文信息会通过APP第一时间发送给用户，然而用户对图文信息的查看也提出了更高的要求。如何将图文信息更好的呈现给用户查看、互动成为了困扰很多APP设计者的难题。
不仅如此，单纯的图文信息已不能提起大部分用户的兴趣，在浏览图文信息的同时，我们还需要提供炫酷的交互体验，比如图片手势缩放、分享、收藏、点赞、评论等功能，以提升用户体验。
photoBrowserTodayNew插件应运而生，插件封装了最新主流图文信息展示界面，开发者只需要简单的设置图文、宽高、颜色就可以拥有高品质的图文信息交互界面，大大降低了开发难度，节约开发成本。插件由原生代码开发，速度极快，界面时尚华丽，并有动画交互，提供评论输入框，开发者可获取用户输入的评论内容，插件可以当做html元素嵌入到html页面中。开发者也可在插件上层增加一层透明的frame或window，用于用户点击插件各按钮时的界面响应，如点击分享按钮后，在上层透明的frame或window弹出分享对话框；
##插件特点：
① 向左或向右无限循环轮播；
② 点击伪评论框动画弹出新的评论输入框，开发者可获取用户输入的评论内容；
③ 可单独设置评论数和收藏状态；
④ 可设置各个功能按钮是否可见；
⑤ 单击主界面可在纯图模式/功能模式之间切换；
⑥ 可对图片进行手势缩放；
⑦ 长按主界面弹出保存图片相关菜单；
⑧ 开发者可在插件上层增加一层透明的frame或window，用于用户点击插件各按钮时的界面响应，如点击分享按钮后，在上层透明的frame或window弹出分享对话框；
##图片优化说明：
开发中大部分情况下我们需要缓存图片，本插件实现了三级缓存，加载网络图片后,插件会把图片缓存到内存，同时把图片缓存文件存到手机自带的sd卡，缓存文件文件名用md5加密，提高了文件安全性。 再次加载图片时插件会先从内存找，如果找到则马上显示在界面上,如果内存没有则从sd卡查找图片缓存文件加载显示，再没有才从网络加载显示，三级缓存大大节省了用户的手机流量，相对js代码更具高效性，切换更加流畅。并且内存中只保留三张图片(左、中、右各一张)，左右预加载，用以提高浏览速度，同时也不会有一次性加载所有图片所导致的内存暴涨问题，大大降低了app内存占用率。
Widget示例代码下载地址：https://community.yonyou.com/thread-161166-1-1.html
插件接口
open
打开图片浏览器。
open({params},callback(ret))
params
images:
- 类型：JSON数组
- 描述：（必填项）要显示的图片url数组,图片数量应大于等于1。支持 fs://、widget://、http://、https://格式
- 内部字段：
images: [
'fs://images/abc.jpg',
'widget://images/abc.jpg',
'http://p0.so.qhimgs1.com/t0182bf0097557b65fc.jpg'
]
texts:
- 类型：JSON数组
- 描述：（可选项）要显示的图片描述字符串数组，images和texts一 一对应，即images中的第一个元素对应texts中的第一个元素，以此类推。字符串数量应等于图片数量，如大于图片数量，则插件从左往右选取数量等于图片数量的那些字符串，如小于图片数量，则剩下的描述字符串插件会自动用空字符串("")补全。参数visibility中的textArea为true时，该字段才有效。
- 内部字段：
texts: [
'描述1',
'描述2',
'描述3'
]
frame:
- 类型：字符串
- 描述：必填项，要将该插件添加到哪个frame显示，一般本插件需要全屏显示（除去手机状态栏，即除去手机顶部的状态栏，其他区域都用来显示本插件），所以frame的区域建议为除去手机顶部状态栏的其他区域。沉浸式模式下，建议将状态栏的背景色设置成黑色(#000000)，以便与本插件的背景色保持一致。
####注意：frame页面要设置成不可弹动，这是为了让本插件有更好的滑动效果。设置frame页面不可弹动的方法：在用openFrame打开frame时将bounces参数设置成false即可。
visibility:
类型：JSON对象
描述：（可选项）用于设置功能按钮是否显示，当input为2时，此时点击伪输入框弹出真正的评论输入框，要想图片不跟随键盘上移，则在config.xml中配置如下参数：
内部字段：
visibility: {
back : true, //返回按钮是否显示，true为显示，默认true
publisher : true,//发布人头像是否显示，true为显示，默认true
menu : true,//右上角菜单按钮是否显示，true为显示，默认true
input : 1,//左下角伪输入框是否显示，默认2，
0：不显示
1：显示但不弹出输入框(对应的回调event值为inputClick，见ret说明)
2：显示且弹出输入框(对应的回调event值为inputUpload，见ret说明)
comment : true,//评论数量按钮是否显示，true为显示，默认true
favorite : true,//收藏按钮是否显示，true为显示，默认true
share : true,//分享按钮是否显示，true为显示，默认true
save : true //长按图片是否弹出保存框，true为弹出，默认true
true时对应的回调event值为save，见ret说明
false时对应的回调event值为longClick，见ret说明
textArea : true //显示文字区域是否显示，true为显示，默认true
}
textHeight:
- 类型：JSON对象
- 描述：（可选项）用于设置文字描述区域高度所占的百分比，公式如下：
百分比 = 文字显示区域高度/允许显示区域高度（当前设备屏幕的高度减去顶部导航条、手机状态栏和底部控制器的高度）。 参数visibility中的textArea为true时，该字段才有效。 - 内部字段：
textHeight:{
//取值范围：1~100,建议不要取值过低或过高
normal : 20,//数值型，默认20.正常高度，即初始情况下文字描述区域高度所占的百分比为20%.
scale : 40//数值型，默认40.当文字过长（此时可滚动浏览）时，点击文字区域会增加文字显示区域高度，scale值就是用于设置增加后的高度占比
}
start:
- 类型：数值型
- 描述：（可选项）用于设置从第几张图片开始显示，默认1，该值从1计数，而不是0。
count:
- 类型：数值型
- 描述：（可选项）用于设置评论按钮上的红色评论数量，默认0，>0时显示红色数量, <=0时不显示红色数量; 大于999时显示"999+"
status:
- 类型：布尔型
- 描述：（可选项）用于设置是否收藏，默认false不收藏。
publisher:
- 类型：字符串
- 描述：（可选项）用于设置发布人头像，为空或不传时头像不显示，支持 fs://、widget://、http://、https://格式
virtualInputHint:
- 类型：字符串
- 描述：（可选项）用于设置伪输入框的提示文字，默认"写评论..."；参数visibility中的input为1或2时，该字段才有效。
realInputHint:
- 类型：字符串
- 描述：（可选项）用于设置可输入评论内容的输入框的提示文字，默认"优质评论将会被优先展示"；参数visibility中的input为2时，该字段才有效。
callback(ret)
ret:
- 类型：JSON对象
- 描述：返回各个用户点击事件和值
- 内部字段：
{
"event": "show", //字符串类型；用户触发的事件类型，
//取值范围：
//show（插件打开成功）
//back（返回按钮被点击）
//publisher（发布人头像被点击）
//menu （菜单按钮被点击）
//save（图片保存按钮被点击，当参数visibility中的save设置为true时有该字段）
//longClick（图片长按事件，当参数visibility中的save设置为false时有该字段）
//comment（评论数量按钮被点击时触发）
//favorite（收藏按钮被点击时触发）
//share（分享按钮被点击时触发）
//inputClick（伪输入框被点击，当参数visibility中的input设置为1时有该字段）
//inputUpload（用户输入评论内容完毕后点 确定 按钮事件，当参数visibility中的input设置为2时有该字段）
//pageChanged 用户每次左右滑动切换图片时触发，切换一张图就触发一次
"index": 指当前显示的图片的索引,根据images参数的图片顺序来定索引，event为pageChanged时有该字段，
"status": true, //布尔类型；收藏按钮的收藏状态，event为favorite时有该字段，
"content": "这是评论", //字符串；用户输入的评论内容，event为inputUpload时有该字段，
"savePath": "/mnt/sdcard/abc.jpg", //字符串；用户保存图片成功后的图片本地路径，event为save时有该字段，
"error": "图片数量不能少于1", //字符串,图片数量少于1时有该字段
}
示例代码
var photoBrowserTodayNew = api.require("photoBrowserTodayNew");
photoBrowserTodayNew.open({
images: [
'http://p0.so.qhimgs1.com/t0182bf0097557b65fc.jpg',
'http://p3.pstatp.com/origin/1f8200056b5761e07d57',
'http://p3.pstatp.com/origin/1f7d0003d59c120d3cfd',
'http://p3.pstatp.com/origin/1f7e0001c7d1202dc931'
],
texts: [
'描述1',
'描述2',
'描述3',
'描述4'
],
frame: "index_frm",//注意：该frame页面要设置成不可弹动，即openFrame时将bounces参数设置成false即可
visibility: {
back : true,
publisher : true,
menu : true,
input : 2,
comment : true,
favorite : true,
share : true,
save : true
},
textHeight:{
normal : 20,
scale : 40
},
start : 1 ,//从1开始
count : 33 ,
status : true ,
publisher: "http://p0.so.qhimgs1.com/t0182bf0097557b65fc.jpg"
},function(ret){
api.toast({
msg: JSON.stringify(ret)+""
});
});
可用性
Android系统
可提供的1.0.0及更高版本
setCommentCount
设置评论数量。应在调用open方法后调用该方法
setCommentCount({params},callback(ret))
params
count:
- 类型：数值型
- 描述：（可选项）用于设置评论按钮上的红色评论数量，默认0，>0时显示红色数量, <=0时不显示红色数量; 大于999时显示"999+"
callback(ret)
ret:
- 类型：JSON对象
- 描述：返回是否设置成功
- 内部字段：
{
"status": 1, //1 or 0. 1设置成功
"msg": "图片浏览器未打开", //status为0时显示该字段
}
示例代码
var photoBrowserTodayNew = api.require("photoBrowserTodayNew");
photoBrowserTodayNew.setCommentCount({
count: 123
},function(ret){
api.toast({
msg: JSON.stringify(ret)+""
});
});
可用性
Android系统
可提供的1.0.0及更高版本
setFavorite
设置收藏状态。应在调用open方法后调用该方法
setFavorite({params},callback(ret))
params
status:
- 类型：布尔型
- 描述：（可选项）用于设置收藏状态，默认false不收藏。
callback(ret)
ret:
- 类型：JSON对象
- 描述：返回是否设置成功
- 内部字段：
{
"status": 1, //1 or 0. 1设置成功
"msg": "图片浏览器未打开", //status为0时显示该字段
}
示例代码
var photoBrowserTodayNew = api.require("photoBrowserTodayNew");
photoBrowserTodayNew.setFavorite({
status: true
},function(ret){
api.toast({
msg: JSON.stringify(ret)+""
});
});
可用性
Android系统
可提供的1.0.0及更高版本
clearCache
清除缓存到本地的网络图片，本接口只清除本插件缓存的数据，若要清除本 app 缓存的所有数据则调用 api.clearCache。清除缓存后保存图片会失败，所以开发者要在适当的时候清除缓存或不清除缓存。
clearCache(callback(ret))
callback(ret)
ret:
- 类型：JSON对象
- 描述：返回清除成功
- 内部字段：
{
"status": 1, //1 清除成功
}
示例代码
var photoBrowserTodayNew = api.require("photoBrowserTodayNew");
photoBrowserTodayNew.clearCache(function(ret, err){
api.toast({
msg: JSON.stringify(ret)+""
});
});
可用性
Android系统
可提供的1.0.0及更高版本
close
关闭图片浏览器，open和close应一 一对应，调用open后应在适当时候调用close。
close(callback(ret))
callback(ret)
ret:
- 类型：JSON对象
- 描述：返回关闭是否成功
- 内部字段：
{
"status": 1, //1 or 0. 1关闭成功
"msg": "图片浏览器未打开", //status为0时显示该字段
}
示例代码
var photoBrowserTodayNew = api.require("photoBrowserTodayNew");
photoBrowserTodayNew.close(function(ret, err){
api.toast({
msg: JSON.stringify(ret)+""
});
});
可用性
Android系统
可提供的1.0.0及更高版本