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 代码

public class DemoApplication implements EntryPoint {

  /**
   * This is the entry point method.
   */
  public void onModuleLoad() {
    final Button button = new Button("Click me");
    final Label label = new Label();

    button.addClickListener(new ClickListener() {
      public void onClick(Widget sender) {
        if (label.getText().equals(""))
          label.setText("Hello World!");
        else
          label.setText("");
      }
    });

    // Assume that the host HTML has elements defined whose
    // IDs are "slot1", "slot2".  In a real app, you probably would not want
    // to hard-code IDs.  Instead, you could, for example, search for all
    // elements with a particular CSS class and replace them with widgets.
    //
    RootPanel.get("slot1").add(button);
    RootPanel.get("slot2").add(label);
  }
}

我们不难看到，实质上运行是这个类，要说的是这个是一定要是实现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的对话框。

• 录像.rar (2.5 MB)
• 描述: 视频录像
• 下载次数: 1568

• ajaxworkspace.rar (170.3 KB)
• 描述: 源码
• 下载次数: 874

分享到：

webwork初体验 | spring bean的生命周期

• 2007-02-26 19:16
• 浏览 7201
• 评论(4)
• 查看更多

评论

4 楼 zlb824 2012-07-18  

为啥视频没声音呢？？？

3 楼 zhangzao 2007-04-28  

非常感谢！

2 楼 wolftou 2007-03-20  

真的非常感谢您...
这些视频作品对我们新手真的是帮助很大
我会一直关注您的作品~
谢谢谢谢!

1 楼 justcode 2007-02-27  

感谢楼主,继续努力!