在layer组件中,照片显示是不常用,今天做了一些不伤了。

在这里写出来,以备后用。

其中注意几个问题,

1。格式问题。

2.路径问题。

不同的layer有不同的格式,查看layerAPI中发现的格式并能不能很好地运用layer2.1版本(目前最新版)。

另外一定要注意路径问题。这个往往是很多人出错的关键所在。(正常地址最前面是不要斜杠的,后面在原有地址前面增加路径的时候也是在后面加斜杠。)

不多说,下面贴上代码来研究

写作是必须按照此格式:

package mypicture;

import java.util.ArrayList;

public class picService {
public static String getJSON(ArrayList<Picture> list,String contextPath)
{
StringBuilder str =new StringBuilder();
// str.append("{");
// str.append("\"title\": \" 用户相册 \","); //相册标题
// str.append("\"id\": 0,"); //相册id
// str.append("\"start\": 0,");//初始显示的图片序号,默认0
// str.append("\"data\": ["); //相册包含的图片,数组格式
// for(int i = 0; i<list.size() ; i++){
// str.append("{");
// str.append("\"alt\":\""+list.get(i).getName()+"\",");
// str.append("\"pid\": 0,"); //图片id
// str.append("\"src\":\""+contextPath+list.get(i).getUrl() +"\","); //原图地址
// str.append("\"thumb\":\"\","); //缩略图地址
// str.append("}");
// if(i<list.size()-1)
// {
// str.append(",");
// }
// else
// {
// break;
// }
// }
// str.append("]");
// str.append("}"); str.append("{");
str.append("\"status\": 1,"); //请求的状态,1表示成功,其它表示失败
str.append("\"msg\": \" \", "); //状态提示语
str.append("\"title\": \" 用户相册 \","); //相册标题
str.append("\"id\": 0,"); //相册id
str.append("\"start\": 0,"); //初始显示的图片序号,默认0 str.append("\"data\": ["); //相册包含的图片,数组格式 //处理相片
for(int i = 0; i<list.size() ; i++)
{ str.append("{");
str.append("\"name\": \""+list.get(i).getName()+"\","); //图片名
str.append("\"pid\": 0,"); //图片id
str.append("\"src\" : \""+contextPath+"/"+list.get(i).getUrl() +"\","); //原图地址
str.append("\"thumb\": \"\","); //缩略图地址
str.append("\"area\": [638, 851]"); //原图宽高
str.append("}");
if(i<list.size()-1)
{
str.append(",");
}
else
{
break;
}
}
str.append("]"); str.append("}");
return str.toString(); }
}

pictures.get(i).setUrl("image/"+imageFileName[i])    ;String path=app.getRealPath("")+"/image";

,另外参考layer官网中快速入门,测试导入是否导入正确。

关于layer.photos即照片显示的问题。的更多相关文章

  1. layer.photos()异步修改图片地址后显示异常

    项目中有一个图片有预览(用的layer.photos()),需要异步修改图片地址,但是成功修改后第一次预览会显示修改前的大图,第二次以后就都正常了. 尝试修改成功后再次调用layer.photos() ...

  2. layer插件layer.photos()动态插入的图片无法正常显示

    layer插件layer.photos()动态插入的图片无法正常显示,点击后面插入的图片,显示的是之前的图片列表,再次点击又是正常 有朋友遇到同样的问题 http://fly.layui.com/ji ...

  3. layui 图片与表单一起提交 + layer.photos图片层预览

    HTML基本结构: <form class="layui-form" action="" id="feedBackForm"> ...

  4. layer.js 中弹框显示不全的问题

    在使用 layer.js 做弹框的时候,遇到在浏览器缩小时,弹框显示不全的问题,如下: 这是不行的,因为我们有的时候想缩小浏览器视窗,但是一旦缩小到一定程度,就会把弹窗的关闭按钮遮住一部分,并且主体弹 ...

  5. layer 弹框不显示内容

    // layer的弹框不显示信息 可能是背景颜色和字体颜色冲突 改下字体颜色即可 layer.msg('<p style="color:black">用户名不能为空&l ...

  6. layer弹出层显示在top顶层

    父页面 导入 layer.js 或者 layui.all.js,导入后就能正常显示在父窗口页面区域. 1.显示在顶层窗口 top.layer.open({ type: 2, area: ['98%', ...

  7. android 实现照相功能 照片存放在SID卡中,将照片显示在Image中

    protected static final int CAMERA_RESULT = 0; private String fileName; private Button takePhotoBn; p ...

  8. 【layui】layer.photos 相册层动态生成Img 中出现的问题的解决方案

    layui版本:2.5.5 参照文档:https://www.jianshu.com/p/c594811fa882 他的3.8的解决方案有一些调整因为发现他的解决方式有些繁琐而最新的2.5.5版本中有 ...

  9. layui(layer)的loading方法显示位置不居中

    要在layer.load之前使用layer.ready方法 layui.use('layer', function () { layer.ready(function(){ index = layer ...

随机推荐

  1. centsos各个版本的区别

    CentOS-7.0-1406-x86_64-DVD.iso             标准安装版,一般下载这个就可以了CentOS-7.0-1406-x86_64-NetInstall.iso     ...

  2. PHP7新特性的介绍

    关于PHP 20年的发展历史: 迄今为止最流行的WEB开发语言: 超过82%的网站都会使用PHP作为他们的服务端开发语言: 新特性介绍 PHP NG – Zend Engine 3 抽象语法树 64位 ...

  3. [HTML] 使用size和maxlength分别控制文本框宽度和输入字符数的限制

    ① size一般可以直观的看到,就是文本框的宽度,只能决定文本框的宽度,也就是可以看到的字符的个数. 如:size="5"  这意味着如果输入  我的国家是北京 那么只能看见  我 ...

  4. spring复习 -day1:Spring简介 、 Spring容器 、 Spring IOC

    Spring创建对象方法   创建对象过程: 第一步:添加SpringIOC环境 (1)在WebRoot/WEB-INT/lib文件夹下,引入SpringIOC配置环境的jar包 如图: (2)在sr ...

  5. 【转】MFC 对话框Border属性设置(None、Thin、Resizing、Dialog Frame)

    对话框的Border属性对应的值设置 Dialog Frame WS_CAPTION | WS_POPUP | WS_SYSMENU | WS_CLIPSIBLINGS | DS_MODALFRAME ...

  6. android 创建 xml文件

    android创建xml文件的方法. 要操作android的外部存储,所以要在AndroidManifest.xml文件中添加权限. <uses-permission android:name= ...

  7. android activity lifecycle

    学习android的activity,之前一直没有去琢磨,今天正好了解一下activity生命周期. 参考链接: https://developer.android.com/guide/compone ...

  8. am335x 10.1"电容touch 不能识别

    /**************************************************************** * am335x 10.1"电容touch 不能识别 * ...

  9. Oracle数据库表空间与用户的关系是 ( )

    Oracle数据库表空间与用户的关系是 ( )? A.一对一 B.一对多 C.多对一 D.多对多 解答: D 一个用户可以使用一个或多个表空间,一个表空间也可以供多个用户使用.

  10. Xenocode Postbuild 2010 for .NET 混淆工具的详细使用步骤【转】

    1,首先我们需要去下载这个工具去,我这里倒是有一个下载的网址,已经被破解了,而且有序列号 http://download.csdn.net/tag/Xenocode+Postbuild+2010+fo ...