java+jsp 浏览某个文件夹下图片(实现分页和浏览特效)
2011-12-21 14:07
351 查看
今天上午不是很忙，浏览QQ空间照片时，突然想到，自己可以做一个类似的，以后可能用得到，就是浏览某个文件夹下所有图片，并实现分页(此处分页比较简单，利用List分页)及浏览特效！(这里传不成实例，需要的Q我，QQ：295047822)具体效果如下图：
都是美女额，呵呵，点击任意一张图片时，出现浏览特效，如下图：
点击图片左侧或右侧，可浏览上一张或下一张照片。
效果看把，直接上代码，上代码之前废话一下，说一处关键的地方：
此处的第一个参数表示路径(d:/a)，第二个参数表示是否浏览子目录，如d:/a/aa/,设置成true，表示aa目录下的图片，一起浏览，显示出来；第三个参数永远为0就好，为什么，我懒得说了，呵呵，，
下面看代码吧，注释已经很详细了。
都是美女额，呵呵，点击任意一张图片时，出现浏览特效，如下图：
点击图片左侧或右侧，可浏览上一张或下一张照片。
效果看把，直接上代码，上代码之前废话一下，说一处关键的地方：
data=recursion(strRealPath+picPath,true,0);
此处的第一个参数表示路径(d:/a)，第二个参数表示是否浏览子目录，如d:/a/aa/,设置成true，表示aa目录下的图片，一起浏览，显示出来；第三个参数永远为0就好，为什么，我懒得说了，呵呵，，
下面看代码吧，注释已经很详细了。
<%@ page language="java" import="java.util.*,java.io.File" pageEncoding="GBK"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>文件夹下图片浏览器</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" href="pic-view/pic-css/lightbox.css" type="text/css" media="screen" />
<script src="pic-view/pic-js/prototype.js" type="text/javascript"></script>
<script src="pic-view/pic-js/scriptaculous.js?load=effects" type="text/javascript"></script>
<script src="pic-view/pic-js/lightbox.js" type="text/javascript"></script>
<style type="text/css">
<!--
.thumbnail {
BORDER-RIGHT: #c1c1c1 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #c1c1c1 1px solid; PADDING-LEFT: 3px; FLOAT: left; MARGIN-BOTTOM: 10px; PADDING-BOTTOM: 8px; BORDER-LEFT: #c1c1c1 1px solid; MARGIN-RIGHT: 10px; PADDING-TOP: 3px; BORDER-BOTTOM: #c1c1c1 1px solid; BACKGROUND-COLOR: #c1c1c1
}
.STYLE1 {color: #FF0000}
.STYLE2 {color: #CC0000}
.STYLE3 {color: #FF0000; font-weight: bold; }
-->
</style>
</head>
<body>
<%
/***
** 梁玉龙 javayulong@qq.com
** 2011-12-21 09:21:32
** content: 文件夹下图片实现浏览并分页效果
*/
String strRealPath = getServletContext().getRealPath("/");//得到项目的绝对路径
List data=null;
String picPath="images";
//out.println("strRealPath="+strRealPath);
data=recursion(strRealPath+picPath,true,0);//第一个参数图片文件夹路径,第二个参数只需设置true,或false,true表示也循环子目录下的图片，第三个参数默认为0即可,千万不要改动
//data=recursion("D:\\resin\\webapps\\PicList\\images",false);
if(data==null){out.println("该文件夹不存在!");return ;}
// out.println("大小："+data.size());
//out.println("-----------------分页开始--------------------");
int pageSize=14;//每页显示多少条
int showPage=1;//第几页
int totle=data.size();//共有多少条数据(多少张照片)
String state="";
String upPage=request.getParameter("upPage");
String nextPage=request.getParameter("nextPage");
if(upPage!=null){
showPage=Integer.parseInt(upPage);
}
if(nextPage!=null){
showPage=Integer.parseInt(nextPage);
}
if(data.size()>0){
if(totle%pageSize==0){
totlePage=totle/pageSize; //共有多少页
}
else{
totlePage=totle/pageSize+1;
}
//当前页小于等于第一页 则按第一页算 如果 当前页大于等于总页数则为最后页
if(showPage <=1){
state="当前已是首页！";
showPage = 1;
}
else if(showPage >= totlePage){
showPage = totlePage;
if(showPage==totlePage){ state="当前已是最后一页！";}
}
%>
<table border="0" align="center">
<tr>
<td align="center" colspan="8"><b>图片列表信息</b><hr/></td>
</tr>
<%
//System.out.println("共 "+totle+" 张图片, "+totlePage+" 页。当前"+showPage+"页，每页显示"+pageSize+"条");
//游标的位置 (当前页 - 1) * 页面大小 + 1
int posion = (showPage-1) * pageSize + 1;
int endData=pageSize*showPage;
for (int i = posion; i <= data.size(); i++) {
if(i>endData){
//out.println("break;---"+i);
break;
}
else{
if((i-posion)%7==0){
%>
<tr>
<%
}
%>
<td align="center">
<DIV class=thumbnail style="margin-left:0">
<A href="<%=basePath+data.get(i-1) %>" rel=lightbox[plants]>
<img src="<%=basePath+data.get(i-1) %>" width="160" height="160" border="0"/>
</A>
</DIV>
</td>
<%
if((i-posion)%7==6){
%>
</tr>
<%
}
//out.println("图片：>>>"+data.get(i-1)+"\r\n");//有问题，要判断，小于4，
}
}
}
else{
out.println("该目录下没有图片");
}
%>
<tr>
<td align="center" colspan="8" nowrap="nowrap" style="font-size: 12px;">
图片数量: <font color="red"><%=data.size() %></font> 张,共 <font color="red"><%=totlePage %></font> 页,当前第 <font color="red"><%=showPage %></font> 页
<a href="index.jsp?upPage=<%=1 %>" style="text-decoration: none">首页</a> <a style="text-decoration: none" href="index.jsp?upPage=<%=showPage-1 %>">上一页</a> <a href="index.jsp?nextPage=<%=showPage+1 %>" style="text-decoration: none">下一页</a> <a href="index.jsp?nextPage=<%=totlePage %>" style="text-decoration: none">尾页</a>
跳转第 <input id="goPage" type="text" style="width:30px;text-align: center;" value="<%=showPage %>" /> 页 <input type="button" value="GO" onclick="ck()"/>
<span><%=state %></span>
</td>
</tr>
</table>
<%!
//遍历某个目录下所有文件
int folderCount;//文件夹个数
int fileCount;//文件个数
int picFilCount=0;//图片个数
// 总共的数据量 (图片个数)
int totle;
// 共有多少页
int totlePage;
// 数据
List list;
/**
*
* @param root 文件夹所在位置
* @param isBlAll 是否连子文件夹下的某个文件(图片)也遍历
* @param isrRef 可设为0或1,为0时，表示是翻页或刷新时请求，为1时表示循环内部所有文件夹时请求，我们调用时,只需要设置为0就ok，其他的不用操心
*/
public List recursion(String root,boolean isBlAll,int isRef){
if(isRef==0){
list=new ArrayList();
}
//Java中读取某个目录下的所有文件和文件夹
String filePath=getServletContext().getRealPath("/");
String picPath=root.replace(filePath,"");
System.out.println("梁玉龙弄国际奥法"+picPath);
// String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
// System.out.println("梁玉龙弄国"+);
File file=new File(root);
if(file.isDirectory()){
File[] tempList = file.listFiles();
//System.out.println("该目录下对象个数："+tempList.length);
for (int i = 0; i < tempList.length; i++) {
if (tempList[i].isFile()) {
fileCount++;
//System.out.println("文 件："+tempList[i]);
String fileName=tempList[i].getName();//文件名称
String hzm=fileName.substring(fileName.indexOf(".")+1,fileName.length()); //文件后缀名
hzm=hzm.toLowerCase();
if(hzm.equals("jpg")||hzm.equals("bmp")||hzm.equals("gif")||hzm.equals("png")){
picFilCount++;
//list.add(tempList[i]);//这里要注意，data.add(fileName);
list.add(picPath+"\\"+fileName);
}
// System.out.println("名称"+hzm);
}
if (tempList[i].isDirectory()) {
folderCount++;
//System.out.println("文件夹："+tempList[i]);
if(isBlAll){
recursion(tempList[i].getAbsolutePath(),isBlAll,1);
}
}
}
totle=picFilCount;
// System.out.println("文件夹个数："+folderCount+"\r\n文件个数："+fileCount+"\r\n图片个数："+picFilCount);
return list;
}
else{
return null;
}
}
%>
</body>
<script type="text/javascript">
function ck(){
var va=document.getElementById("goPage");
var strPage=va.value.replace( / /g,"");
if(strPage==""){alert("跳转的值不能为空!");return ;}
if(isNaN(va.value)){alert("跳转的值必须为数字!");return ;}
window.location.href="index.jsp?nextPage="+va.value;
}
</script>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- JAVA、jsp、数据库实现分页浏览功能
- Java 实现图片水印之文字水印（SpringMVC + Jsp）
- Android图片加载神器之Fresco-更灵活的设置加载特效[Java代码实现XML效果]
- SQLServer数据库的图片存储(Java实现)并显示到jsp上
- ASP.NET或者 js方式实现文件夹多图片浏览的方式
- jsp servlet javaBean实现oracle数据库分页显示
- javaBean+servlet+jsp实现分页效果
- Java 小程序 实现网络下载图片到制定文件夹，压缩和删除文件
- jsp+servlet+javabean实现数据分页方法完整实例
- Java 实现图片水印之水印图片（SpringMVC + Jsp）
- Android QQ空间浏览图片动画特效的实现(※)
- 学习笔记_用hibernateQBC动态查询+jsp的jstl标签库实现的动态查询以及分页特效
- JavaBean+Jsp 实现页面分页
- 浏览文件夹中的图片（用VB实现）
- JSP+servlet+javabean实现分页
- jsp+servlet+javabean实现数据分页
- Android图片加载神器之Fresco-更灵活的设置加载特效[Java代码实现XML效果]
- javabean+jsp+DAO实现分页
- Java Web 图片管理与分享系统（Struts2+Hibernate+JSP实现）
- Java 实现图片等比例缩略图 （Thumbnailator + Jsp+SpringMVC）