<tr>
56. <td id="slot1"></td><td
id="slot2"></td>
57. </tr>
58. </table>
59. </body>
60. </html>
2. 主类HelloWorld
主类HelloWorld必须继承自com.google.gwt.core.client.EntryPoint类,并且覆盖其public void onModuleLoad()方法。
在onModuleLoad()方法中,我们使用GWT中提供的默认显示组件(比如Button)和组装组件(比如VerticalPanel)来设计需要显示的界面,所有这些组件都位于com.google.gwt.user.client.ui包下面。这些组件的命名规则和Java AWT的命名规则基本类似,使用方式也和AWT的基本一致,不过GWT中提供了不少的新组建可供选择,比如可以直接用VerticalPanel来实现垂直方向的布局管理。
HelloWorld.java中的19和20行,就声明了Button和Label两个显示组件。
19. final Button button = new Button("Click me");
20. final Label label = new Label();
onModuleLoad()方法中,我们需要把生成的显示组件或者组装组建加入到显示页面的对应显示区域。首先,我们需要在页面上使用id属性为显示区域指定唯一的名称(参见清单1中的56行)。com.google.gwt.user.client.ui.RootPanel的静态方法get可以根据传入的字符串参数(参数值就是显示区域的id属性)获取页面上对应的显示区域。
HelloWorld.java的36、37行,就使用了RootPanel的get方法分别获得页面上id为"slot1"、"slot2"的显示区域,然后调用add方法将生成的Button和Label对象加入到显示区域中。
36. RootPanel.get("slot1").add(button);
37. RootPanel.get("slot2").add(label);
Ajax最重要的功能就是为用户提供更好的交互体验,GWT中使用和AWT中相同的事件监听机制完成客户端事件监听,GWT中支持的Listener接口包括ChangeListener、ClickListener等。我们可以通过各种各样的Listener接口获得用户界面上所发生的动作,通过处理这些动作来完成对应业务逻辑。
HelloWorld.java中的第22行~29行的内容就实现了一个ClickListender接口,并且提供了对应的onClick方法实现,用于处理按钮点击后的业务逻辑(判断是否需要显示"Hello World!"字符串),然后调用Button对象的addClickListener方法增加监听器。
22. button.addClickListener(new ClickListener() {
23. public void onClick(Widget sender) {
24. if (label.getText().equals(""))
25. label.setText("Hello World!");
26. else
27. label.setText("");
28. }
29. });
HelloWorld类的全部源代码内容见清单2。
清单2 src\org\vivianj\gwt\client\HelloWorld.java
1. package org.vivianj.gwt.client;
2.
3. import com.google.gwt.core.client.EntryPoint;
4. import com.google.gwt.user.client.ui.Button;
5. import com.google.gwt.user.client.ui.ClickListener;
6. import com.google.gwt.user.client.ui.Label;
7. import com.google.gwt.user.client.ui.RootPanel;
8. import com.google.gwt.user.client.ui.Widget;
9.
10. /**
11. * Entry point classes define <code>onModuleLoad()</code>.
12. */
13. public class HelloWorld implements EntryPoint {
14.
15. /**
16. * This is the entry point method.
17. */
18. public void onModuleLoad() {
19. final Button button = new Button("Click me");
20. final Label label = new Label();
21.
22. button.addClickListener(new ClickListener() {
23. public void onClick(Widget sender) {
24. if (label.getText().equals(""))
25. label.setText("Hello World!");
26. else
27. label.setText("");
28. }
29. });
31. // Assume that the host HTML has elements defined whose
32. // IDs are "slot1", "slot2". In a real app, you probably would not want
33. // to hard-code IDs. Instead, you could, for example, search for all
34. // elements with a particular CSS class and replace them with widgets.
35. //
36. RootPanel.get("slot1").add(button);
37. RootPanel.get("slot2").add(label);
38. }
39. }
3. 配置文件HelloWorld.gwt.xml
配置文件中包括两个元素。Inherits元素地设置GWT应用的继承信息,而entry-point元素的class属性则用于设置设置GWT应用的主类。
清单3 src\org\vivianj\gwt\HelloWorld.gwt.xml
1. <module>
3. <!-- Inherit the core Web Toolkit stuff. -->
4. <inherits name='com.google.gwt.user.User'/>
6. <!-- Specify the app entry point class. -->
7. <entry-point class='org.vivianj.gwt.client.HelloWorld'/>
9. </module>
结束语
Ajax是当前热门的Web应用开发技术,Java是企业应用开发中的主流技术,GWT框架将这两种技术合二为一,是我们能够应用Java语言来开发Ajax,在保留Ajax技术的优点基础上,解决了Ajax应用开发、调试困难的缺点。
本文中介绍了GWT的基本知识、主要特性,提供了"HelloWorld!"例子说明使用Java和GWT框架开发Ajax应用的开发、编译、测试过程,并且通过对"HelloWorld!"例子中涉及文件的分析,讲解了使用GWT框架开发Ajax应用的技术细节和约束条件。
下载资源
JDK下载地址: http://java.sun.com