Gwt-Ext学习笔记之中

Gwt-Ext学习笔记之中,第1张

概述转帖:http://www.javaeye.com/topic/192772   一、 配置 Gwt-Ext开发环境 a.       请参照 Gwt-Ext学习笔记之基础篇 b.      此教程是在 基础篇 和 进级篇 的基础上做的扩展,具体细节请参照前面教程。 二、 在 gwtext项目上创建客户端模型文件 a.       创建模型文件 InfoList.java,内容如下   Java代

转帖:http://www.javaeye.com/topic/192772

一、 配置 Gwt-Ext开发环境

a. 请参照 Gwt-Ext学习笔记之基础篇

b. 此教程是在 基础篇 进级篇 的基础上做的扩展,具体细节请参照前面教程。

二、 gwtext项目上创建客户端模型文件

a. 创建模型文件 InfoList.java,内容如下

Java代码 publicclassInfoListimplementsEntryPoint{ publicvoIDonModuleLoad(){ ExtElementmain=Ext.get("main"); PanelmainPanel=newPanel(){ { setTitle("测试"); setHeight(300); setWIDth(500); setFrame(true); setHTML("<p>如果看到这些信息,说明你的环境已经配置成功了!</p>"); setStyle("margin:10px0px0px10px;"); } }; if(main!=null){ mainPanel.setApplyTo(main.getDOM()); mainPanel.render(""); }else{ RootPanel.get().add(mainPanel); } } }
public class InfoList implements EntryPoint {	public voID onModuleLoad() {		ExtElement main = Ext.get("main");		Panel mainPanel = new Panel() {			{				setTitle("测试");				setHeight(300);				setWIDth(500);				setFrame(true);				setHTML("<p>如果看到这些信息,说明你的环境已经配置成功了!</p>");				setStyle("margin: 10px 0px 0px 10px;");			}		};		if (main != null) {			mainPanel.setApplyTo(main.getDOM());			mainPanel.render("");		} else {			RootPanel.get().add(mainPanel);		}	}}

b. 修改 HTML宿主页面 InfoList.HTML文件

i. InfoList.HTML文件中加入以下代码

Java代码 <linkhref="Js/resources/CSS/ext-all.CSS"rel="stylesheet"type="text/CSS"/> <scripttype="text/JavaScript"src="Js/adapter/ext/ext-base.Js"></script> <scripttype="text/JavaScript"src="Js/ext-all.Js"></script>
<link href="Js/resources/CSS/ext-all.CSS" rel="stylesheet" type="text/CSS"/><script type="text/JavaScript" src="Js/adapter/ext/ext-base.Js"></script><script type="text/JavaScript" src="Js/ext-all.Js"></script>

c. InfoList.gwt.xml文件中加入以下代码

Java代码 <inheritsname="com.gwtext.GwtExt"/>
<inherits name="com.gwtext.GwtExt"/>

d. 测试环境是否配置成功,运行方式参考 Gwt-Ext学习笔记之基础篇 ,效果如下图

三、 定义服务

a. gwtext项目上,创建名为 InfoListAction.java远程服务接口。

b. Postgresql数据库的 JDBC postgresql-8.2-505.jdbc3.jar加入到项目中(其他数据库,加入相应的 JDBC包)。

c. 远程服务的实现类,在 InfoListActionImpl.java中加入如下代码:

Java代码 /** *@author七月天 * */ publicclassInfoListActionImplextendsRemoteServiceServletimplements InfoListAction{ publicString[][]queryData(){ Connectionconn=null; String[][]allinfo=null; try{ Class.forname("org.postgresql.Driver"); StringconnString="jdbc:postgresql://127.0.0.1:5432/gwtext"; conn=DriverManager.getConnection(connString,"julycn","julycn"); Stringsqlquery="selectusername,password,email,phonefromperson"; Statementstmt=conn.createStatement( ResultSet.TYPE_SCRolL_INSENSITIVE, ResultSet.CONCUR_READ_ONLY); ResultSetrst=stmt.executequery(sqlquery); //行数 introws=0; if(rst.last()){ rows=rst.getRow(); rst.beforeFirst(); } //表的列数 ResultSetMetaDatarsm=rst.getMetaData(); intcolumns=rsm.getColumnCount(); //初始化输组 allinfo=newString[rows][columns]; inti=0; while(rst.next()){ for(intj=0;j<columns;j++){ allinfo[i][j]=rst.getString(j+1); } i++; } }catch(Exceptione){ e.printstacktrace(); }finally{ if(conn!=null){ try{ conn.close(); }catch(sqlExceptione){ e.printstacktrace(); } } } returnallinfo; } }
/** * @author 七月天 * */public class InfoListActionImpl extends RemoteServiceServlet implements		InfoListAction {	public String[][] queryData() {		Connection conn = null;		String[][] allinfo = null;		try {			Class.forname("org.postgresql.Driver");			String connString = "jdbc:postgresql://127.0.0.1:5432/gwtext";conn = DriverManager.getConnection(connString,"julycn","julycn");String sqlquery = "select username,phone from person";			Statement stmt = conn.createStatement(					ResultSet.TYPE_SCRolL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);			ResultSet rst = stmt.executequery(sqlquery);			// 行数			int rows = 0;			if (rst.last()) {				rows = rst.getRow();				rst.beforeFirst();			}			// 表的列数			ResultSetMetaData rsm = rst.getMetaData();			int columns = rsm.getColumnCount();			// 初始化输组			allinfo = new String[rows][columns];			int i = 0;			while (rst.next()) {				for (int j = 0; j < columns; j++) {					allinfo[i][j] = rst.getString(j + 1);				}				i++;			}		} catch (Exception e) {			e.printstacktrace();		} finally {			if (conn != null) {				try {					conn.close();				} catch (sqlException e) {					e.printstacktrace();				}			}		}		return allinfo;	}}

四、 绑定代码

a. 定义一个远程接口类 InfoListAction.java,代码如下:

Java代码 /** *@author七月天 * */ publicinterfaceInfoListActionextendsRemoteService{ publicstaticfinalStringSERVICE_URI="/InfoListAction"; publicstaticclassUtil{ publicstaticInfoListActionAsyncgetInstance(){ InfoListActionAsyncinstance=(InfoListActionAsync)GWT .create(InfoListAction.class); ServiceDefTargettarget=(ServiceDefTarget)instance; target.setServiceEntryPoint(GWT.getModuleBaseURL()+SERVICE_URI); returninstance; } } publicString[][]queryData(); }
/** * @author 七月天 *  */public interface InfoListAction extends RemoteService {	public static final String SERVICE_URI = "/InfoListAction";	public static class Util {		public static InfoListActionAsync getInstance() {			InfoListActionAsync instance = (InfoListActionAsync) GWT					.create(InfoListAction.class);			ServiceDefTarget target = (ServiceDefTarget) instance;			target.setServiceEntryPoint(GWT.getModuleBaseURL() + SERVICE_URI);			return instance;		}	}	public String[][] queryData();}

b. 定义远程异步接口类 InfoListActionAsync.java,代码如下:

Java代码 /** *@author七月天 * */ publicinterfaceInfoListActionAsync{ publicvoIDqueryData(AsyncCallbackcallback); }
/** * @author 七月天 *  */public interface InfoListActionAsync {	public voID queryData(AsyncCallback callback);}

c. 注册服务器代码,将下面的一行加入到 InfoList.gwt.xml

Java代码 <servletclass="com.gwtext.julycn.server.InfoListActionImpl"path="/InfoListAction"/>
<servlet  path="/InfoListAction" />

五、 执行客户端调用

a. 修改模型文件 InfoList.java,代码如下:

Java代码 /** *@author七月天 * */ publicclassInfoListimplementsEntryPoint{ publicvoIDonModuleLoad(){ InfoListActionAsyncaction=InfoListAction.Util.getInstance(); action.queryData(newAsyncCallback(){ publicvoIDonFailure(Throwablecaught){ //Todoauto-generatedmethodstub } publicvoIDonSuccess(Objectresult){ Panelpanel=newPanel(); panel.setborder(false); panel.setpaddings(15); RecordDefrecordDef=newRecordDef(newFIEldDef[]{ newStringFIEldDef("username"), newStringFIEldDef("password"), newStringFIEldDef("email"), newStringFIEldDef("phone")}); finalGrIDPanelgrID=newGrIDPanel(); String[][]data=(String[][])result; MemoryProxyproxy=newMemoryProxy(data); ArrayReaderreader=newArrayReader(recordDef); Storestore=newStore(proxy,reader); store.load(); grID.setStore(store); ColumnConfig[]columns=newColumnConfig[]{ newColumnConfig("用户名","username",160,true,null,"username"), newColumnConfig("密码","password",45), newColumnConfig("邮箱","email",65), newColumnConfig("电话","phone",65)}; ColumnModelcolumnModel=newColumnModel(columns); grID.setColumnModel(columnModel); grID.setFrame(true); grID.setStripeRows(true); grID.setautoExpandColumn("username"); grID.setHeight(350); grID.setWIDth(600); grID.setTitle("用户信息"); ToolbarbottomToolbar=newToolbar(); bottomToolbar.addFill(); bottomToolbar.addbutton(newToolbarbutton("清除排序", newbuttonListenerAdapter(){ publicvoIDonClick(buttonbutton,EventObjecte){ grID.clearSortState(true); } })); grID.setBottomToolbar(bottomToolbar); panel.add(grID); RootPanel.get().add(panel); } }); } }
/** * @author 七月天 * */public class InfoList implements EntryPoint {	public voID onModuleLoad() {		InfoListActionAsync action = InfoListAction.Util.getInstance();		action.queryData(new AsyncCallback() {			public voID onFailure(Throwable caught) {				// Todo auto-generated method stub			}			public voID onSuccess(Object result) {				Panel panel = new Panel();				panel.setborder(false);				panel.setpaddings(15);				RecordDef recordDef = new RecordDef(new FIEldDef[] {						new StringFIEldDef("username"),new StringFIEldDef("password"),new StringFIEldDef("email"),new StringFIEldDef("phone") });				final GrIDPanel grID = new GrIDPanel();				String[][] data = (String[][]) result;				MemoryProxy proxy = new MemoryProxy(data);				ArrayReader reader = new ArrayReader(recordDef);				Store store = new Store(proxy,reader);				store.load();				grID.setStore(store);				ColumnConfig[] columns = new ColumnConfig[] {new ColumnConfig("用户名","username",160,true,null,"username"),new ColumnConfig("密码","password",45),new ColumnConfig("邮箱","email",65),new ColumnConfig("电话","phone",65) };				ColumnModel columnModel = new ColumnModel(columns);				grID.setColumnModel(columnModel);				grID.setFrame(true);				grID.setStripeRows(true);				grID.setautoExpandColumn("username");				grID.setHeight(350);				grID.setWIDth(600);				grID.setTitle("用户信息");				Toolbar bottomToolbar = new Toolbar();				bottomToolbar.addFill();				bottomToolbar.addbutton(new Toolbarbutton("清除排序",new buttonListenerAdapter() {public voID onClick(button button,EventObject e) {								grID.clearSortState(true);							}						}));				grID.setBottomToolbar(bottomToolbar);				panel.add(grID);				RootPanel.get().add(panel);			}		});	}}

b. AsyncCallback 接口定义了两个方法: onSuccess(Object result) onFailure(Throwable caught)。必须定义一个可以实现这两个方法的类。当执行远程调用时,模型类的实例并将其传递给异步服务方法。最后,服务器端资源完成,然后调用代码中两个方法之一。成功方法的参数是接口和实现中的调用的返回值。

六、 展示效果

a. 凌晨1点了,收工睡觉;先看看效果吧

总结

以上是内存溢出为你收集整理的Gwt-Ext学习笔记之中全部内容,希望文章能够帮你解决Gwt-Ext学习笔记之中所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/sjk/1180579.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-02
下一篇 2022-06-02

发表评论

登录后才能评论

评论列表(0条)

保存