1、需求
为更好的完成分页功能,简化实际开发中前后台交互的分页操作。
2、简介
分页组件共有三个类和一个标签描述文件(pager-tag.tld),各类的简介如下:
Pager类:分页工具类,封装后台数据以便前台使用。
LinkScope类:页码连接范围类,记录了对应页面的开始页码和结束页码,辅助Pager类完成页码连接部分。
PagerTag 类:分页标签处理类,处理分页数据连接部分的展示,并输出到标签应用页面。
3、 LinkScope类
公有属性(对外提供get、set方法):
private int startIndex; // 连接页开始页码
private int endIndex; // 连接页结束页码
其它属性(类内部使用,对外只提供get方法):
private int linkSize; // 页码连接数
private int beforeNum; // 当前页之前的页数
private int afterNum; // 当前页之后的页数
构造方法:
/**
* 以默认页码连接数构造一个页码连接范围对象。
*
* <tt>其中,默认页码连接数为10。</tt>
*/
public LinkScope() {...}
/**
* 以指定的页码连接数构造一个页码连接范围对象。
*
* @param linkSize
* 页码连接数,若参数值不大于-1,则使用默认值10。
*/
public LinkScope(int linkSize) {...}
/**
* 以指定的当前页之前、之后的页数构造一个页码连接范围对象。
*
* @param beforeNum
* 当前页之前的页数。
* @param afterNum
* 当前页之后的页数。
*
*/
public LinkScope(int beforeNum, int afterNum) {...}
注意:
1、只有正确设置了linkSize或beforeNum、afterNum,该对象的数据才算合格,而且两组数据只需设置其中一组即可,另一组数据将自动计算得到。(无效参数举例:linkSize==0或beforeNum+afterNum==0)
2、无需手动设置属性startIndex、endIndex的值,并且手动设置的值在应用到Pager类中时会失效。
3、当beforeNum+afterNum<0,在应用到PagerTag类中,并且当前对象未失效时,执行倒序排列,其它时候顺序排列。
4、 Pager类
公有属性(对外提供get、set方法):
private int pageIndex; // 当前页码
private int pageSize; // 页面大小
private List items; // 数据集合
private int totalRows; // 数据总量,总记录数
private LinkScope linkScope; // 页码连接范围对象
private boolean firstPage = false; // 是否仅取第一页, 默认为false。
private boolean supplement = true; // 是否进行前后页序号动态补足,默认为true。
其它属性(类内部使用,对外只提供get方法):
private int totalPage; // 页面总量,总分页数
private int pastRows; // 当前页之前的数据量
private int previousPage; // 上一页页码
private int nextPage; // 下一页页码
private boolean ready = false; // 是否可以工作。默认为false,只有正确设置了数据总量才为true。
private boolean goodState = false; // linkScope关键数据的准备状态, 默认为false。
构造方法:
/**
* 以默认当前页码、页面大小构造一个分页对象。
*
* <tt>其中,默认当前页码为1,默认页面大小为10。</tt>
*/
public Pager() {...}
/**
* 以指定的当前页码、页面大小构造一个分页对象。
*
* @param pageIndex
* 当前页码,若参数值不大于0,则使用默认值1。
* @param pageSize
* 页面大小,若参数值不大于0,则使用默认值10。
*/
public Pager(int pageIndex, int pageSize) {...}
/**
* 以指定的当前页码、页面大小构造一个分页对象。
*
* @param pageIndex
* 当前页码,若参数值不大于0,则使用默认值1。
* @param pageSize
* 页面大小,若参数值不大于0,则使用默认值10。
* @param linkSize
* 页码连接数,如果设置了此参数,将用此创建一个LinkScope对象并设置。
* 若参数值不大于-1,则使用默认值10;若参数值为0,则此参数视为无效参数。
*/
public Pager(int pageIndex, int pageSize, int linkSize) {...}
静态实例:
/**
* 以指定的页面大小构造一个表示第一页的分页对象。
*
* @param pageSize
* 页面大小,若参数值不大于0,则使用默认值10。
* @return 构造好的第一页分页对象。
*/
public static Pager newFirstPager(int pageSize) {...}
注意:
1、只有正确设置了totalRows,则totalPage,pastRows,previousPage,nextPage数据才经计算后一并设置;如果linkScope的数据合格,并且ready的值为true,则在初次调用getLinkScope()获得linkScope时,计算其属性startIndex、endIndex的值并设置。
2、当firstPage的值为true时,设置totalRows将失效。当使用newFirstPager(int pageSize)方法获得Pager实例时,默认设置firstPage的值为true。
5、PagerTag类
此类为标签处理类,只详解其标签描述文件pager-tag.tld相关的内容。
private String homePage; // 首页显示内容
private String lastPage; // 末页显示内容
private String previousPage; // 上一页显示内容
private String nextPage; // 下一页显示内容
private int beforeNum; // 当前页之前的页数
private int afterNum; // 当前页之后的页数
private Pager pager; // 分页对象
private String url; // 链接地址
private String pageIndex; // 当前页码参数名称
private String pageSize; // 页面大小参数名称
private String divClass; // 外层div样式
private boolean display = true; // 是否显示页码连接范围,默认为true。
private boolean supplement = true; // 是否进行前后页序号动态补足,默认为true。
private boolean vertical = false; // 是否纵向排列,默认为false。
注意:
1、pager,url,pageIndex为关键属性,必须设置值,pageIndex为空值时给予默认值“pageIndex”。
2、只有正确设置了beforeNum、afterNum,并且display的值为true,则重新构造linkScope并设置,对象pager中原来的linkScope将失效。
3、当beforeNum+afterNum<0时,执行倒序排列,其它时候顺序排列。
6、测试举例
测试主代码:
Pager pager = new Pager(17, 5, 8);
pager.setTotalRows(1000);
System.out.println(pager);
System.out.print("[首页]" + pager.getHomePage());
System.out.print("[上一页]" + pager.getPreviousPage());
System.out.print("[下一页]" + pager.getNextPage());
System.out.println("[末页]" + pager.getLastPage());
System.out.println(pager.getLinkScope());
控制台输出结果:
class commons.util.Pager[pageIndex=17, pageSize=5, totalRows=1000, ready=true, goodState=false]
[首页]1[上一页]16[下一页]18[末页]200
Link scope information of the page is: 14 to 21
7、 标签使用举例
1、 配置(两种方式,任选其一,推荐使用归档文件)
使用源代码:
需将pager-tag.tld文件放到WEB-INF下,并在web.xml中配置如下:
<jsp-config>
<taglib>
<taglib-uri>pagerTag</taglib-uri>
<taglib-location>/WEB-INF/pager-tag.tld</taglib-location>
</taglib>
</jsp-config>
使用.jar归档文件:
无需在web.xml中配置,只需将pager-tag-1.0.jar文件引入项目中使用即可。
2、 分页页面调用
//引入pager-tag.tld文件的定义
<%@ taglib prefix="util" uri="http://www.codingfarmer.com/tags"%>
//分页显示
<util:pagerTag pager="${pager}" url="www.iteye.com?type=1" pageIndex="index" pageSize="size" homePage="首页" lastPage="末页" previousPage="上页" nextPage="下页" divClass="pageNav"/>
假设当前作用域中的pager为测试举例中设置好的pager,最终输出到页面的代码为:
<div class="pageNav">
<a href="www.iteye.com?type=1&index=1&size=5">首页</a>
<a href="www.iteye.com?type=1&index=16&size=5">上页</a>
<a href="www.iteye.com?type=1&index=14&size=5">14</a>
<a href="www.iteye.com?type=1&index=15&size=5">15</a>
<a href="www.iteye.com?type=1&index=16&size=5">16</a>
<span>17</span>
<a href="www.iteye.com?type=1&index=18&size=5">18</a>
<a href="www.iteye.com?type=1&index=19&size=5">19</a>
<a href="www.iteye.com?type=1&index=20&size=5">20</a>
<a href="www.iteye.com?type=1&index=21&size=5">21</a>
<a href="www.iteye.com?type=1&index=18&size=5">下页</a>
<a href="www.iteye.com?type=1&index=200&size=5">末页</a></div>
以上为例,
当url="www.iteye.com"时,
类似www.iteye.com?type=1&index=1&size=5的将更改为类似www.iteye.com?index=1&size=5的;
当url="javascript:show"时(show为相应的javascript函数名称),
类似www.iteye.com?type=1&index=1&size=5的将更改为类似javascript:show('1','5');的。
倘若未指定pageSize或其值为空值,则&size=5将不追加;相应的类似javascript:show('1','5');的,参数只有前面的一个。
8、 结束语
分页组件的使用就讲解到这里,在下面上传的压缩包中,我还提供了几个CSS分页样式定义。希望大家多提更好的建议和意见,以便改进,谢谢参与,不胜感激。
注:在开发中参考了博客:http://zhangshixi.iteye.com/blog/677469的内容。也在此谢谢博客的作者,正因为看了他的博客,才使我萌生了改进他的分页组件的意念。此分页组件虽参考了他的实现,但却运用了很多自己的思维,重写或更改了很大部分代码。
相对于他写的分页组件,此分页组件主要的改进:
1) 新增了延迟处理逻辑
2) 新增了倒顺序排列
3) 新增了javascript方式提交
4) 新增了是否显示页码连接范围设置
5)新增了是否竖向排列展示设置
6) 更改了部分数据有效性验证
7) 更改了大部分数据的计算逻辑
8) 更改了部分输出到页面的标签,以便更好的应用CSS样式