使用Vaadin的SQLContainer和table实现批量数据的快速浏览

下面是代码，但是有详细的注释，只是一个例子。

给出了：

1、SQLContainer的简单使用方法

2、给出了table控件的使用方法

3、展示了大量数据客户端浏览的一种服务器端实现方法

4、应该比flash、html5的方法要好一些，对客户端的资源需求少。

package cn.com.dareway.quickgrid;

/*
* 批量浏览、编辑数据
* 用于演示OSGi体系架构的Web应用开发
* 使用了Vaadin的SQLContainer数据组件，和Table用户界面组件
* 这是一个没有划分模块的应用
*/

import java.sql.Connection;
import java.sql.SQLException;
import java.sql.Statement;

import com.vaadin.Application;
import com.vaadin.Application.CustomizedSystemMessages;
import com.vaadin.Application.SystemMessages;
import com.vaadin.addon.sqlcontainer.SQLContainer;
import com.vaadin.addon.sqlcontainer.connection.JDBCConnectionPool;
import com.vaadin.addon.sqlcontainer.connection.SimpleJDBCConnectionPool;
import com.vaadin.addon.sqlcontainer.query.TableQuery;
import com.vaadin.data.Item;
import com.vaadin.data.Property;
import com.vaadin.data.Property.ValueChangeEvent;
import com.vaadin.event.ItemClickEvent;
import com.vaadin.event.ItemClickEvent.ItemClickListener;
import com.vaadin.ui.*;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Button.ClickListener;

/*
* QuickGrid扩展了Vaadin的Application，这是任何Vaadin应用的入口
*/
public class QuickGrid extends Application {
private Window mw;//应用的主界面

private Label rows;//现实当前批量数据的记录数
private JDBCConnectionPool connectionPool = null;//数据库连接池
private SQLContainer htContainer = null;//数据组件，类似于PowerBuilder的DataStore
boolean editMode = false;//数据组件当前处于编辑状态，还是数据浏览状态

//初始化数据组件
private void initContainers() {
try {
//建立数据库连接池，这里只是演示的目的，实际生产系统可以使用其他数据库连接池，例如c3p0
connectionPool = new SimpleJDBCConnectionPool(
"com.mysql.jdbc.Driver",
"jdbc:mysql://localhost:3306/csp?Unicode=true&characterEncoding=UTF-8",
"xzs", "xzsxzs", 2, 5);
} catch (SQLException e) {
e.printStackTrace();
}
//设置数据库中一个table作为数据组件的数据源，这里是hugetable
try {
TableQuery q1 = new TableQuery("hugetable", connectionPool);
htContainer = new SQLContainer(q1);
//应用服务器上数据组件的数据缓冲大小，通常设置为用户界面中显示行数的5倍，默认是100
//该设置影响访问数据库的次数，如果数据库服务器压力大，这个数可以调大，减少数据库的访问次数
htContainer.setPageLength(1000);
} catch (SQLException e) {
e.printStackTrace();
}
}

//这个方法是Application必须的，用于初始化Vaadin应用系统
@Override
public void init() {
//初始化数据组件
initContainers();
//建立应用的主界面，这个窗口就是浏览器中的主界面
mw = new Window("快速浏览批量数据-QuickGrid");
//界面顶部显示一个标题和一个按钮
com.vaadin.ui.HorizontalLayout h = new HorizontalLayout();
h.setSpacing(true);
h.setMargin(true);
Label title = new Label("批量数据浏览、编辑实例");
title.setStyleName("bigfont");
h.addComponent(title);
NativeButton helloButton = new NativeButton("你好");
helloButton.setWidth("40px");
helloButton.setHeight("40px");
helloButton.setStyleName("bigfont");
helloButton.addListener(new ClickListener(){
@Override
public void buttonClick(ClickEvent event) {
getMainWindow().showNotification("Hello, 我是批量浏览、编辑数据的Portal。");
}
});
h.addComponent(helloButton);
mw.addComponent(h);
//构造一个表格组件，用于显示或编辑批量数据
final Table ht = new Table();
ht.setSizeFull();//宽度100%
ht.setPageLength(25);//表格显示25行数据
ht.setReadOnly(false);//不是只读
ht.setSelectable(true);//表格中的行可以选择
//设置UI组件的数据源
ht.setContainerDataSource(htContainer);
//设置表格的标题
ht.setCaption("快速数据浏览");
//设置表格的栏目标题
ht.setColumnHeaders(new String[] { "ID", "姓名", "年龄", "住址", "身份证号码" });
//将表格加入的主界面
mw.addComponent(ht);
//插入数据按钮
Button b = new Button("insert 10000 rows");
b.addListener(new ClickListener() {
@Override
public void buttonClick(ClickEvent event) {
for (int i = 0; i < 10000; i++) {
Object itemid = htContainer.addItem();
Item item = htContainer.getItem(itemid);
double r = Math.random() * 10000;
item.getItemProperty("name").setValue("里斯" + r);
item.getItemProperty("age").setValue(
Math.round(100 * Math.random()));
item.getItemProperty("address").setValue("山东大学");
item.getItemProperty("idno").setValue("371012198887122217");
}
try {
htContainer.commit();
} catch (UnsupportedOperationException e) {
e.printStackTrace();
} catch (SQLException e) {
e.printStackTrace();
}
rows.setValue("rows:" + htContainer.size());
}
});
//按钮放到一行上
HorizontalLayout vl = new HorizontalLayout();
vl.addComponent(b);
//删除所有数据的按钮
Button b2 = new Button("删除所有数据");
b2.addListener(new ClickListener() {
@Override
public void buttonClick(ClickEvent event) {
try {
Connection c = connectionPool.reserveConnection();
Statement st = c.createStatement();
st.executeUpdate("delete from hugetable");
c.commit();
} catch (SQLException e1) {
e1.printStackTrace();
}
htContainer.refresh();
rows.setValue("rows:" + htContainer.size());
}
});
vl.addComponent(b2);
//保存按钮
final Button b4 = new Button("保存");
b4.setEnabled(false);
b4.addListener(new ClickListener() {
@Override
public void buttonClick(ClickEvent event) {
try {
htContainer.commit();
} catch (UnsupportedOperationException e) {
e.printStackTrace();
} catch (SQLException e) {
e.printStackTrace();
}
}
});
vl.addComponent(b4);
//撤销修改的按钮
final Button b5 = new Button("撤销修改");
b5.setEnabled(false);
b5.addListener(new ClickListener() {
@Override
public void buttonClick(ClickEvent event) {
try {
htContainer.rollback();
} catch (UnsupportedOperationException e) {
e.printStackTrace();
} catch (SQLException e) {
e.printStackTrace();
}
}
});
vl.addComponent(b5);
//刷新按钮
Button b6 = new Button("刷新");
b6.addListener(new ClickListener() {
@Override
public void buttonClick(ClickEvent event) {
//htContainer.refresh();
ht.refreshRowCache();
}
});
vl.addComponent(b6);
//进入编辑模式的按钮
final Button b3 = new Button("进入编辑数据模式");
vl.addComponent(b3);
b3.addListener(new ClickListener() {
@Override
public void buttonClick(ClickEvent event) {
if (editMode) {
ht.setEditable(false);
b3.setCaption("进入编辑数据模式");
} else {
ht.setEditable(true);
b3.setCaption("进入浏览数据模式");
}
editMode = !editMode;
if (editMode){
b4.setEnabled(true);
b5.setEnabled(true);
}else{
b4.setEnabled(false);
b5.setEnabled(false);
}
}
});

//显示数据的总行数
rows = new Label("rows:" + htContainer.size());
vl.addComponent(new Label(rows));
//将按钮行加入界面
mw.addComponent(vl);
ht.addListener(new ItemClickListener(){
@Override
public void itemClick(ItemClickEvent event) {
getMainWindow().showNotification(""+event.getItem().getItemProperty("name"));
}
});
//设置应用的主界面
setMainWindow(mw);

//设置应用的外观主题
this.setTheme("quickgrid");
}

//这里是设置vaadin的session timeout信息
public static SystemMessages getSystemMessages() {
return customizedSystemMessages;
}

static CustomizedSystemMessages customizedSystemMessages = new CustomizedSystemMessages();
static {//不让vaadin显示超时信息，这种设置会产生一个很好的效果：当超时时，点击界面的一个控件（可点击的）会引起刷新
customizedSystemMessages.setSessionExpiredCaption(null);
customizedSystemMessages.setSessionExpiredMessage(null);
}
}