《《GWT入门介绍》PPT课件》由会员分享，可在线阅读，更多相关《《GWT入门介绍》PPT课件（29页珍藏版）》请在金锄头文库上搜索。
1、.,1,GWT技术介绍,GiftCJW BUAA-ACT 2007-3-19,-如何使用Java语言开发Ajax应用,.,2,什么是Ajax,Ajax是 Asynchronous JavaScript and XML（以及 DHTML 等）的缩写，由XHTML、CSS、JavaScript、XMLHttpRequest、XML等技术组合而成，是当前Web应用开发领域的热门技术，用于创建更加动态和交互性更好的Web应用程序，提升用户的浏览体验。 Ajax的核心是JavaScript对象XmlHttpRequest。XmlHttpRequest处理所有服务器通信的对象，是一种支持异步请求的技术。
2、XmlHttpRequest可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。,.,3,困难在哪,如何解决,因为JavaScript不易调试,所以编写AJAX应用程序往往让人头痛。 Google Web Toolkit (GWT) 是一个使用Java语言 开发Ajax应用的开发框架。在开发和调试AJAX 应用程序时，和其它的Java程序没有任何区别，选用什么样的Java 开发工具完全由自己的喜好所定。 开发完毕以后要部署到应用服务器中，GWT自带的编译器将Java应用程序编译成与浏览器兼容的JavaScript和HTML页面。,.,4,GWT的特点,动态，可重用的UI组件
3、简单的RPC调用 方便的调试功能 浏览器兼容性（IE，Opera，Firefox） 可扩展性（JSNI）,.,5,GWT四大组成,一个 Java-to-JavaScript compiler 一个 “hosted” web 浏览器, 两套 Java 类库,.,6,两种模式,HostMode（宿主模式）：未编译前，在GWT提供的Host Mode的浏览器中查看。可以用于调试GWT程序，会打出异常位置。 WebMode：编译后，在浏览器中查看。,.,7,如何开发GWT应用,a.将用到的GWT库添加到IDE里，在IDE中 用Java语言编写和调试一个应用程序。 b.使用GWT自带的Java2Java
4、Script编译器将写出来的代码编译成JavaScript和HTML文件。 c.将编译后的代码发布到Web Server上。 d.检测是否满足主流的浏览器。（一般没有问题）,.,8,在Eclipse下开发-第一步-创建工程,1 创建Eclipse工程 第一步使用： projectCreator eclipse 工程名称 比如： projectCreator -eclipse DemoProject 第二步使用：applicationCreator -eclipse 工程名称 类包名称.client.类名 比如：applicationCreator -eclipse MyProject org.
5、buaa.client.DemoApplication,.,9,Eclipse下开发-第二步-导入Eclipse,.,10,在Eclipse下开发-第二步-修改入口类，添加相应代码,每一个GWT程序都有一个入口点，必须继承自EntryPoint接口，实现OnModuleLoad方法 其事件触发模式是类似于AWT当中的处理模式。,事件 触发,入口 点,.,11,在Eclipse下开发-第三步-编译,点击Test-Shell.cmd可以开启Hosted Mode ，并察看运行结果 或者点击Test-Compile.cmd，可以开启Web Mode，将代码解析成为javascript，并可以在Web
6、浏览器中察看。,.,12,在Eclipse下开发-第四步-部署和执行,部署到Tomcat等应用服务器当中。,.,13,GWT类库总览,com.google.gwt.core.client 用于客户端的GWT基本代码 com.google.gwt.core.ext 用于扩展GWT编译器的类. com.google.gwt.core.ext.typeinfo 为支持自动生成功能的类库 com.google.gwt.http.client 提供对HTTP的请求响应处理类 com.google.gwt.i18n.client 国际化 com.google.gwt.json.client 解析和创建Js
7、on类型的类库 com.google.gwt.junit.client Junit测试 com.google.gwt.user.client 客户端使用的基本GWT接口. com.google.gwt.user.client.rpc客户端为使用RPC功能的GWT接口. com.google.gwt.user.client.ui Widgets, Panels, 以及其他的UI接口 com.google.gwt.user.server.rpc 服务端为了实现RPC调用实现的接口. com.google.gwt.xml.client XML的解析和使用,.,14,GWT类库-UI,在UI类库中，G
8、WT提供了若干种widgets 和panels。所有的类都继承自widget，并被加入到panel中被显示。 Panels 包括DockPanel, HorizontalPanel, 和RootPanel等 Widgets 包括Composite, FileUpload, FocusWidget, Frame, Hidden, Hyperlink, Image, Label, MenuBar, Panel和 Tree等等,.,15,GWT类库-UI组件,.,16,GWT类库-RPC,.,17,GWT类库-RPC,客户端和服务端进行交互。 在服务端加入对RPC服务的处理。 在客户端的AsyncC
9、allback接口实现中对结果进行处理。（异步处理） GWT自动的对各种数据类型进行序列化和反序列化处理。,.,18,GWT类库-HTTP,支持POST和GET两种HTTP方法。 例子：GET的使用 HTTPRequest.asyncGet(customerRecord.xml, new ResponseTextHandler() public void onCompletion(String responseText) / In the real world, this text would come as a RPC response. This / technique is great
10、for testing and samples though! renderXML(responseText); ,.,19,GWT类库-DOM的处理,Package com.google.gwt.xml.client 包括对XML类型的解析处理类 Document doc = XMLParser.parse(string); XMLParser.removeWhitespace(doc); 对XML的使用 Node,Element.etc.,.,20,GWT类库-JSON的支持,JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同
11、时也易于机器解析和生成。它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999的一个子集。 JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C, C+, C#, Java, JavaScript, Perl, Python等）。这些特性使JSON成为理想的数据交换语言。 GWT对JSON进行了支持。 JSON的功能可以用XMLDOM代替。,.,21,JSON格式的例子,使用JSON：comments:id:1,author:someone1,url:,con
12、tent:hello,id:2,author:someone2,url:,content:hello,id:3,author:someone3,url:,content:hello;,使用XML表示 1someone1hello2someone2someone13someone3hello,.,22,GWT类库- JSNI native接口,JavaScript Native Interface (JSNI) JSNI方法被声明为native方法，并在如下的格式中包含了JavaScript代码。他可以支持在Java代码中嵌入JavaScript. public static native vo
13、id alert(String msg) /*- $wnd.alert(msg); -*/;,.,23,GWT类库-Junit-对GWT进行测试,继承GWTTestCase抽象类 实现getModuleName方法 public class FooTest extends GWTTestCase public String getModuleName() return com.example.foo.Foo; public void testStuff() assertTrue(2 + 2 = 4); ,.,24,GWT-Designer像VB那么拖拽开发,演示 1）如何建立GWT工程 2）如
14、何在Eclipse里进行开发 3）开发GUI以及进行相应的事件处理 4）RPC调用以及同GUI的结合 5）HTTP异步调用以及DOM-XML格式的处理,.,25,GWT小结,使用一、二种技术(gwt、css)取代web应用中的各种技术(html，javascript，jsp，以及java的各种框架)，使开发者不再需要在各种技术之间debug; 为webapp开发的vb化提供了API，可以使用拖拽的形式开发。,.,26,以此纪念我在ACT度过的3年的美好时光,My Last Contribution To My Dear BUAA-ACT,Q&A,.,27,参考资料,官方网站： 国内的介绍： IBM的相关文章： ,.,28,参考资料,开发工具： JSON： ,感谢亲观看此幻灯片，此课件部分内容来源于网络， 如有侵权请及时联系我们删除，谢谢配合！,
