GWT学习笔记.docx

GWT介绍以开发应用程序的方式开发Web2.0程序。AJAX的概念已经流行了很长时间了，目前比较成功的，“如雷贯耳”的AJAX应用有Google Earth，Gmail等。GWT全称Google Web Toolkit。是Google开发的AJAX开发框架，目前已全部开源。（本文基于GWT提供的开发指南（Developer Guide），所采用的图片，例子均出自GWT，可以认为是GWT的学习笔记J）GWT的核心是通过一个编译器(compiler)把Java代码翻译为JavaScript代码，开发期间，用户以类似开发AWT或SWING应用程序的方式实现所需要的功能，然后通过GWT的编译器可以把您的应用程序翻译为功能相同的Web2.0程序。而且生成的Web2.0程序可以在大部分主流浏览器上运行，如：Internet Explorer, Firefox, Safari。基本概念Hosted Mode：当您利用Java IDE编辑，调试，运行应用程序时，处于Hosted Mode。此时应用程序未翻译为Javascript，而是以字节码(bytecode)形式运行在JVM中。GWT提供一个内嵌的浏览窗口(browser window)运行应用。您可以采用传统的“编码测试调试修改”的方式进行开发。Web Mode：在Host Mode模式下运行正确的应用，可以通过GWT编译器将Java代码翻译为Javascript代码，发布到Web服务器，以浏览器访问，此时您的应用称为处于Web Mode，而不再依赖于JVM或任何浏览器插件(plug-in)来运行。Host Page：任何HTML页面，都可以包含GWT生成的代码，称为Host Page。Client-side Code：Javascript代码在客户的浏览器中运行，称为Client-side Processing。GWT应用中部分Java代码将会最终翻译为Javascript，这部分代码称为Client-side Code。Server-side Code：任何发生Web服务器内部的处理称为Server-side Processing。客户短通过RPC(Remote procedure call)向服务器发起请求，Server-side Code接收请求并处理。模块(Modules)模块是GWT中最重要的概念。可以理解为功能模块，即一个模块实现某一特定功能，如：邮件模块可以收，发，阅读邮件等。模块配置文件以XML文件的格式定义，文件名后缀通常为：gwt.xml。主要属性如下：入口点类(Entry-Point Classes)模块的入口点类需要实现EntryPoint接口，并且入口点类需要有一个无参数的构造函数。当模块加载时，实例化入口点类，onModuleLoad()方法将会被调用。我们通常在这时构造用户界面。可以指定多个入口点类。源路径(Source Path)指定Client-side Code所在的路径，默认为client。公共路径(Public Path)指定公共资源所在的路径，默认为public。继承(inherits)指定要继承其属性的模块。可以指定继承多个模块。通常以逻辑名字引用模块。如：/src/com/example/cal/Calendar.gwt.xml。其逻辑名字为com.example.cal.Calendar。在页面中，通过指定名为gwt:module的meta属性来将页面与模块绑定，如：GWT编译器在处理时，需要指定模块的逻辑名字，通过逻辑名字在当前路径下寻找配置文件，继而确定Client-side Code位置，以及公共资源位置。如：java -cp %dp0src;%dp0bin;%dp0././gwt-user.jar;%dp0././gwt-dev-windows.jar com.google.gwt.dev.GWTCompiler -out %dp0www %* com.example.cal.Calendar其中：%dp0表示当前路径。com.example.cal.Calendar为模块逻辑名字。编译器将在/src/com/example/cal/路径下寻找Calendar.gwt.xml文件。如果该文件采用默认配置，则会将/src/com/example/cal/client目录下的Java代码翻译为Javascript代码并保存置/www/ com.example.cal目录下，/src/com/example/cal/public下的文件则会全部拷贝到/www/ com.example.cal目录下。GWT项目结构假设要开发的Web2.0应用名称为com.example.call。则推荐的目录结构如下：目录路径存放内容com/example/cal/模块配置文件(module XML files)com/example/cal/client/客户端代码(Client-side Code)com/example/cal/server/服务端代码(Server-side Code)，如RPC服务的实现代码com/example/cal/public/静态文件，如：Html页面，图片，Css文件，脚本文件等GWT提供的命令行工具为方便开发GWT应用，提供了几个命令行工具。ProjectCreator构造一个初始的Eclipse项目，并可选生成Ant编译文件ApplicationCreator构造一个出生的GWT应用，包含编译命令，已经启动命令JunitCreator生成Junit测试代码I18nCreator生成国际化处理脚本及属性文件构造用户界面GWT用户界面开发类似于目前流行的UI框架，如：Awt，SWING。可以用GWT提供的DOM接口来处理浏览器的DOM树，也可以用GWT提供的Widget树来构造界面，通常来讲后者要简单很多。GWT通过组合Widgets和Panels来构造界面。界面风格用标准的CSS进行定义。Widgets是单独可复用的界面组件，如按钮（Button），树（Tree），菜单（Menu，MenuItem），文字输入框（TextBox）。ButtonRadioButtonTextAreaMenuBarTreePanels则是用来摆放Widgets的容器，GWT提供了多种Panel。其中RootPanel是每个GWT应用都需要用到的，它是整个UI树的根节点，可通过RootPanel.get()方法获取。默认的RootPanel与HTML页面的Body对应。其他常用的Panel主要有：HorizontalPanelVerticalPanelFlowPanelStackPanelDockPanelTabPanel更多的Widgets和Panels请参考GWT提供的API。和AWT，SWING类似，GWT应用也采用事件监听者（Events-Listeners）方式进行交互。Widgets发布不同的事件，通过绑定相应的监听者类对事件进行处理。熟悉Java开发或.Net开发的可以很容易理解这一点。如果觉得GWT提供的组件不满足要求，也可以开发自定义的组件，主要有三种方法开发自定义组件：1 继承Composite类，在其中组合需要的Widget2 参考GWT提供的Widget实现，从头开始开发3 利用JavaScript通常建议用第一种方法开发自定义组件。GWT所附带的例子程序中有自定义开发组件的例子。RPC Remote Procedure CallGWT应用与传统的HTML Web应用最基本的区别是：GWT应用执行请求时不需要获取整个页面数据，就像运行在浏览器中的一个应用程序，GWT应用可以部分更新用户界面，一个好的GWT应用可以把大部分用户界面逻辑处理放在客户端执行，只在需要业务数据时与服务器交互，获取合适的数据。显而易见，这种方式可以大大节省通讯流量，提高应用性能，降低Web服务器缚在，改善用户体验。这种客户端与服务器的交互，称为RPC。服务端提供给客户端调用的功能称为服务(Service)。要注意，这里的服务与常说的Web Service完全是两个概念。也许大家能够猜到GWT应用底层是如何实现RPC的，核心就是XMLHttp，一个比较古老的东东，借助与GWT框架，发挥出了强大的能量。上图为要实现一个Service所要做的工作。在Client-side Code 声明两个接口：YourService和YourServiceAsync。即一个同步接口和一个异步接口。要求同步接口声明继承com.google.gwt.user.client.RemoteService接口，异步接口所声明的方法必须与同步接口声明的方法具有相同的名称，返回类型一定为void，且参数比同步方法的参数多一个AsyncCallback对象，异步接口的名字为同步接口名+Async。假设我们声明一个同步接口：com.example.foo.client.FooService如下：public interface FooService extends RemoteService ReturnType fooMethod(ParamType1 start, ParamType2 end,);则异步接口要声明为：public interface FooServiceAsync void fooMethod(ParamType1 start, ParamType2 end, AsyncCallback callback);在Server-side Code实现具体的处理类：YourServiceImpl。该类需要具体实现上述同步接口声明的方法，同时要继承RemoteServiceServlet类，该类继承自HttpServlet，即所实现的具体处理类实际上为一个标准的Servlet，在产品发布到应用服务器时，要在web.xml文件中对该Servlet进行配置。在开发过程中，可以利用GWT提供的嵌入Tomcat环境，通过在模块配置文件中配置标签来对RPC服务进行测试。从客户端发起RPC调用的过程如下：1 通过GWT.Create()方法获取服务接口2 通过ServiceDefTarget类指定服务入口地址(Service entry poin URL)3 构造一个AsyncCallback类4 传人上面的AsyncCallback类，调用服务接口方法假设服务接口定义为：public interface MyEmailService extends RemoteService void emptyMyInbox(String username, String password);则对应的异步接口定义为：public interface MyEmailServiceAsync void emptyMyInbox(String username, String password, AsyncCallback callback);客户端调用过程如下：/1。获取服务接口代理类MyEmailServiceAsync emailService = (MyEmailServiceAsync) GWT.create(MyEmailService.class);/2。指定服务入口地址ServiceDefTarget endpoint = (ServiceDefTarget) emailService;String moduleRelativeURL = GWT.getModuleBaseURL() + email;endpoint.setServiceEntryPoint(moduleRelativeURL);/3。构造AsyncCallback类AsyncCallback callback = new AsyncCallback() public void onSuccess(Object result) / do some UI stuff to show success public void onFailure(Throwable caught) / do some UI stuff to show failure ;/4。调用服务接口emailService.emptyMyInbox(fUsername, fPassword, callback);注意：接口参数，和返回值必须为serializable。即可序列化。具体要求请参考GWT文档。国际化GWT应用提供多个接口及类，以辅助进行国际化处理。这些辅助接口及类都定义在com.google.gwt.i18n.client包内。一个国际化的应用必然要包含针对不同Locale的定义文件，其本地化处理方法，定义文件的命名方式，查找顺序与Java应用程序相同，请参考Java相关文档。Constants一个标记接口，本身未定义任何方法。用于对一些应用中用到常量进行国际化处理。实际应用中需要定义需要的接口类，继承该接口，并声明与常量同名的方法。通过GWT.create(Class)实例化接口，GWT编译器会自动生成接口定义类，并根据本地化设置实现合适的方法。假设有常量定义文件：MyCperties，其内容如下：firstName = First NamelastName = Last Name则需要声明接口MyConstants，同时继承Constants接口，并要声明以下方法：String firstName();String lastName();即方法名与常量定义的名称相同。注意：方法名默认需要与常量相同，但可以在源代码中添加 gwt.key constantName来指定匹配的常量，然后给方法取任意的名字，如：/* * Translated First Name. * * return translated First Name * gwt.key firstName */ String anotherfirstName();声明的常量接口通过GWT.Create(MyConstants.class)实例化，GWT会自动生成代理类实现常量接口。常量接口中声明的方法必须未以下格式：Type methodName();Type可以为多种类型：String，String，int，float，boolean，Map。具体每种类型对应的常量定义格式请参考GWT提供的API文档。ConstantsWithLookup该接口与Constants类似。但该接口同时定义了一些查找常量的方法，如：getString(methodName)。其中methodName的规则与Constants相同。显而易见，该类提供的额外功能是可以传人可变的方法名（methodName）以获取常量，更加的“动态”。Messages前面两种接口处理的常量定义文件为完全静态不变的，即其常量访问方法都是无参数的。Message接口则可以在此基础上提供“参数化”的处理。其方法声明为如下格式：String methodName(optional-params)假设常量定义文件内容如下：requiredField = 0 is a requ