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两个文件。
GWT有两种运动模式:
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的对话框。

你可能感兴趣的:(eclipse,tomcat,Ajax,Google,gwt)