GWT demo中的分页研究.
Mail
类是主要的模块.
private MailList
mailList; 是分页所需要的主要的类.
public class MailList extends Composite implements ClickHandler {
MailList下面有一个
private FlexTable
table = new FlexTable
();
是用来动态显示分页数据的类.
private HorizontalPanel
navBar
= new HorizontalPanel
();
navBar是用来显示 [上一页][下一页] 这样的信息的.
public MailList() { // Setup the table. table.setCellSpacing(0); table.setCellPadding(0); table.setWidth("100%"); // Hook up events. table.addClickHandler(this); newerButton.addClickHandler(this); olderButton.addClickHandler(this); // Create the 'navigation' bar at the upper-right. HorizontalPanel innerNavBar = new HorizontalPanel(); navBar.setStyleName("mail-ListNavBar"); innerNavBar.add(newerButton); innerNavBar.add(countLabel); innerNavBar.add(olderButton); navBar.setHorizontalAlignment(HorizontalPanel.ALIGN_RIGHT); navBar.add(innerNavBar); navBar.setWidth("100%"); initWidget(table); setStyleName("mail-List"); initTable(); update(); }
在构造函数里面进行数据的初始化.
因为MailList实现了ClickHander.所以属性添加监听的时候可以添加this
table.addClickHandler(this); newerButton.addClickHandler(this); olderButton.addClickHandler(this);
其实在
public void onClick(ClickEvent event) { Object sender = event.getSource(); if (sender == olderButton) {
方法里面进行判断.是那个按钮发出的相应然后在做处理.
可以从Event中得到发出响应的部件的类.
然后就可以进行事件处理了..
仿照这个自己写了一个类:
private Button firestButton = new Button("首页"); private Button previousButton = new Button("上一页"); private Button nextButton = new Button("下一页"); private Button lastButton = new Button("末页"); private Button jumpButton1 = new Button(); private Button jumpButton2 = new Button(); private Button jumpButton3 = new Button(); private Button jumpButton4 = new Button(); private Button jumpButton5 = new Button(); private int startRow, endRow = 0; private int totalRows = 100; private int maxRows = 10; private HTML showPageInfo = new HTML("", true); /* 设置分页显示的信息. */ private FlexTable dateTable = new FlexTable(); /* 数据存放的table */ private VerticalPanel mainPanel = new VerticalPanel(); /* 主要窗体. */ private HorizontalPanel jumpPanel = new HorizontalPanel(); public UserPageList() { mainPanel.setWidth("100%");/* 设置显示100% */ dateTable.setCellSpacing(0); dateTable.setCellPadding(0); dateTable.setWidth("100%"); dateTable.setBorderWidth(1);/* 添加一个border=0 */ /* 为按钮添加时间相应. */ dateTable.addClickHandler(this); firestButton.addClickHandler(this); previousButton.addClickHandler(this); nextButton.addClickHandler(this); lastButton.addClickHandler(this); jumpButton1.addClickHandler(this); jumpButton2.addClickHandler(this); jumpButton4.addClickHandler(this); jumpButton5.addClickHandler(this); /* 设置按钮条. */ HorizontalPanel navBar = new HorizontalPanel(); HorizontalPanel innerNavBar = new HorizontalPanel(); navBar.setStyleName("mail-ListNavBar"); innerNavBar.add(showPageInfo); innerNavBar.add(firestButton); innerNavBar.add(previousButton); innerNavBar.add(jumpPanel); innerNavBar.add(nextButton); innerNavBar.add(lastButton); /* 添加按钮. */ navBar.setHorizontalAlignment(HorizontalPanel.ALIGN_RIGHT); navBar.add(innerNavBar); navBar.setWidth("100%"); mainPanel.add(dateTable); mainPanel.add(navBar); setWidget(mainPanel); setWidth("700px"); setText("用户分页演示.");// 并不是setTitle设置标题. initTable(); } public void onClick(ClickEvent event) {/* 分页事件添加. */ Object obj = event.getSource(); if (firestButton == obj) {/* 第一页. */ startRow = 0; endRow = startRow + maxRows; initTable(); } else if (previousButton == obj) {/* 前一页 */ startRow -= maxRows; if (startRow < 0) { startRow = 0; } endRow = startRow + maxRows; initTable(); } else if (nextButton == obj) {/* 下一页 */ if (!(startRow + maxRows >= totalRows)) { startRow += maxRows; endRow = startRow + maxRows; } initTable(); } else if (lastButton == obj) {/* 末页. */ endRow = totalRows; startRow = totalRows - maxRows; if (startRow < 0) { startRow = 0; } initTable(); } else if (jumpButton1 == obj) { jumpPage(-2); } else if (jumpButton2 == obj) { jumpPage(-1); } else if (jumpButton4 == obj) { jumpPage(1); } else if (jumpButton5 == obj) { jumpPage(2); } } private void initTable() { // Create the header row. if (startRow == 0 && endRow == 0) { endRow = maxRows; } /* 设置标题. */ dateTable.setText(0, 0, "ID"); dateTable.setText(0, 1, "用户名"); dateTable.setText(0, 2, "邮编"); dateTable.setText(0, 3, "其他"); int j = 1; for (int i = startRow; i < endRow; ++i) {/* 随机填入数据.将数据放到dataTable里面. */ dateTable.setText(j, 0, "aa" + i); dateTable.setText(j, 1, "aa" + Random.nextInt()); dateTable.setText(j, 2, "bb" + Random.nextInt()); dateTable.setText(j, 3, "cc"); j++; } showPageInfo.setHTML("开始:\t" + startRow + "记录\t结束:\t" + endRow + "记录");/* * 更新显示信息. */ int currentPage = (startRow / maxRows) + 1; int maxPage = (totalRows / maxRows) ; System.out.println("currentPage:\t"+currentPage+"\tmaxPage:\t"+maxPage); for (int i = 0; i < jumpPanel.getWidgetCount(); i++) { jumpPanel.remove(i); } if ((currentPage - 2) >= 1) { jumpButton1.setText("" + (currentPage - 2)); jumpPanel.add(jumpButton1); System.out.print("\t"); System.out.print(currentPage - 2); } if ((currentPage - 1) > 1) { jumpButton2.setText("" + (currentPage - 1)); jumpPanel.add(jumpButton2); System.out.print("\t"); System.out.print(currentPage - 1); } jumpButton3.setText("" + currentPage); jumpPanel.add(new Button("" + currentPage)); System.out.print("\t"); System.out.print(currentPage); if ((currentPage + 1) < maxPage) { jumpButton4.setText("" + (currentPage + 1)); jumpPanel.add(jumpButton4); System.out.print("\t"); System.out.print(currentPage + 1); } if ((currentPage + 2) <= maxPage) { jumpButton5.setText("" + (currentPage + 2)); jumpPanel.add(jumpButton5); System.out.print("\t"); System.out.print(currentPage + 2); } System.out.println(); } private void jumpPage(int pageNo) { int currentPage = (startRow / maxRows) + 1; System.out.println("pageNo:\t" + pageNo + "currentPage:\t" + currentPage); startRow = startRow + (maxRows * pageNo); endRow = startRow + maxRows; initTable(); }
如图显示.目前这个还有一个小的bug.
在分页点击的时候.后台显示的是正确的.但是页面的组件有的时候会多出来几个button.
好像是没有清除掉该删除的东西.
还得仔细研究下呢.
附件是代码.
在添加上数据库操作就是一个ajax的分页了.这样开发一个分页.一个ajax的效率还是挺快的.
基本上是没有去弄那个麻烦的javascript.
速度也还是挺快的.想要看看什么类下面的方法都是很方便的呢.
时间: 2024-09-22 01:45:38