GWT编写hello world

GWT是Google Web Toolkit的缩写.是google为了开发ajax而做的一个框架.采用的概念是用java开发程序之后,用GWT转换成js和html.debug之类的也可以在java的IDE中调试。为java程序员开发ajax提供也方便。也给那些熟练c/s开发b/s人带来了惊喜。本文主要介绍用gwt编写一个hello world!

准备工作：

eclipse3.2

gwt

安装GWT： http://code.google.com/webtoolkit/直接解压就可以了。c:\open\gwt-windows-1.3.3。

设置系统环境变量

•          新增一个环境变量GWT_HOME　　GWT_HOME= c:\open\gwt-windows-1.3.3

•          将GWT_HOME变量添加到PATH变量中 path=%GWT_HOME%

新建工作目录，将我们的程序代码都放在这个目录中，比如我新建目录d:\ajaxworkspace

打开“命令行窗口”并切换到我的工作目录，即d:\ajaxworkspace

输入如下命令：

 projectCreator -eclipse GWTHello

打开d:\ajaxworkspace，我们可以看到已经GWT帮我们生成了一个Eclipse工程的基本框架

接着再输入命令：

applicationCreator -eclipse GWTHello com.lyx. client.DemoApplication

此时GWT帮我们生成了一个GWT工程所需要的所有支持文件

注意：包名的最后一个一定发是 client

到了这步程序就可以运行了。

在项目目录下你可以看到DemoApplication-shell.cmd，DemoApplication-compile.cmd两个文件。

ＧＷＴ有两种运动模式：

Host mode:执行d:\ajaxworkspace下的DemoApplication-shell.cmd即单机运行，也就是我们在开发阶段要用的，也就是debug模式

Web mode:执行d:\ajaxworkspaces下的DemoApplication-compile.cmd应用时运行，也就是我们开发完要发布到服务器上去，像tomcat，jboss之类。

打开Eclipse，使用Eclipse来编辑我们生成GWT工程

在Eclipse中选择: File -> Import ,

在“导入向导”的第一个窗口中选择 “Existing Projects into Workspace”,

在“导入向导”的第二个窗口中选择文件目录，即d:\ajaxworkspace 。

就能看到GWTHello已被打勾。

完成导入工作后在Eclipse中就可以看到我创建的GWT 工作的文件结构

右击Eclipse左侧的工程，选择“Run as”->“Run…”,在窗口中选择“Java Application”-> “DemoApplication”,单击 “Run”按钮运行。

注意： main class: com.google.gwt.dev.GWTShell 一定要是这个

运行会看到同样的效果。

接下来我们找到 client 包下的 DemoApplication 类

java 代码

1. public class DemoApplication implements EntryPoint {   
2.   
3.   /**  
4.    * This is the entry point method.  
5.    */  
6.   public void onModuleLoad() {   
7.     final Button button = new Button("Click me");   
8.     final Label label = new Label();   
9.   
10.     button.addClickListener(new ClickListener() {   
11.       public void onClick(Widget sender) {   
12.         if (label.getText().equals(""))   
13.           label.setText("Hello World!");   
14.         else  
15.           label.setText("");   
16.       }   
17.     });   
18.   
19.     // Assume that the host HTML has elements defined whose   
20.     // IDs are "slot1", "slot2".  In a real app, you probably would not want   
21.     // to hard-code IDs.  Instead, you could, for example, search for all    
22.     // elements with a particular CSS class and replace them with widgets.   
23.     //   
24.     RootPanel.get("slot1").add(button);   
25.     RootPanel.get("slot2").add(label);   
26.   }   
27. }   

我们不难看到，实质上运行是这个类，要说的是这个是一定要是实现 EntryPoint 接口。

当程序加载时，声明了两个控件，一个 button, 一个 label 。 Button 有一个监听器，如果单击并且 label 的内容为空则给予 label 值为 hello world!. 否则为空。这样就实现了单击一次，显示 hello world! 再次单击就为空。

我们将 label.setTest(“hello world”); 这行代码改为：

com.google.gwt.user.client.Window.alert("Hello world!");

当你运行时就会弹出一个hello world的对话框。