Google Web Toolkit上手指南

[b]目录[/b]
安装Google Web Toolkit
构建一个简单的程序
从零开始创建一个程序(不用Eclipse)
从零开始创建一个程序(使用Eclipse)

[b]安装Google Web Toolkit[/b]
1,安装Java SDK
如果你没有安装最新版本的Java SDK,下载并安装[url=http://java.sun.com/javase/downloads/]Sun Java标准版本SDK[/url]
2,安装Google Web Toolkit
下载你的操作系统的[url=http://code.google.com/webtoolkit/download.html]Google Web Toolkit包[/url]
3,解压Google Web Toolkit包
在Windows上,使用一个类似于[url=http://www.winzip.com/]WinZip[/url]的程序从gwt-windows-1.3.3.zip解压文件。在Mac和Linux上,你可以使用如下命令解压包:
[code]
tar xvzf gwt-mac-1.3.3.tar.gz
[/code]
4,完成了!开始使用Google Web Toolkit
GWT没有一个安装程序。你所需要用来运行和使用GWT的所有文件位于解压的目录。你将需要用来使用GWT的主要程序为applicationCreator,它在下面描述了。
以构建GWT自带的例子程序中的一个开始可能是最简单的。

[b]构建一个简单的程序[/b]
所有的例子程序位于你的GWT包的samples/目录。每个例子都有一个你可以以[url=http://code.google.com/webtoolkit/overview.html#Modes]hosted模式[/url]运行的脚本和一个你可以将它编译成JavaScript和HTML来以[url=http://code.google.com/webtoolkit/overview.html#Modes]web模式[/url]
运行的脚本。

[b]以Hosted模式运行[/b]
为了以[url=http://code.google.com/webtoolkit/overview.html#Modes]hosted模式[/url]运行[url=http://code.google.com/webtoolkit/documentation/examples/kitchensink/]Kitchen Sink[/url]例子,进入samples/KitchenSink/目录并运行KitchenSink-shell脚本。这将打开具有Kitchen Sink程序在其中运行的GWT浏览器:
[img]http://code.google.com/webtoolkit/images/kitchensink-hosted.jpg[/img]
既然你以[url=http://code.google.com/webtoolkit/overview.html#Modes]hosted模式[/url]运行,程序将运行在Java Virtual Machine(JVM)里。这是你将用来debug你的程序的典型模式。

[b]以Web模式运行[/b]
为了以[url=http://code.google.com/webtoolkit/overview.html#Modes]模式[/url]运行,通过运行KitchenSink-compile脚本来编译程序。GWT编译器将从Kitchen Sink Java源代码在www/子目录生成一些JavaScript和HTML文件。
为了查看程序,在你喜欢的浏览器里打开www/com.google.gwt.sample.kitchesink.KitchenSink/KitchenSink.html文件。
[img]http://code.google.com/webtoolkit/images/kitchensink-web.jpg[/img]
既然你已经编译了项目,你现在将在IE,Firefox或者Safari里运行纯JavaScript和HTML。
如果你想以产品部署Kitchen Sink例子项目,你将发布你的www/com.google.gwt.sample.kitchensink.KitchenSink/目录里的文件到你的web服务器。

[b]做些改动[/b]
Kitchen Sink的源代码位于src/子目录。试着关闭你的浏览器窗口,并在一个文本编辑器里打开src/com/google/gwt/sample/kitchensink/client/Info.java。
文件的第26行为Kitchen Sink程序的第一个tab("Info")的静态初始化方法的第一行:
[code]
return new SinkInfo("Info", "Introduction to the Kitchen Sink.") {
[/code]
将第二个string从"Introduction to the Kitchen Sink."改为"Foo bar":
[code]
return new SinkInfo("Info", "Foo bar") {
[/code]
现在保存文件,并再一次运行KitchenSink-shell脚本来启动你最近更改的程序(确认你首先关闭了你的老的hosted模式浏览器窗口,否则新的hosted浏览器不会
启动)。现在最上面的tab应该为"Foo bar"而不是"Introduction to the Kitchen Sink":
[img]http://code.google.com/webtoolkit/images/kitchensink-modified.jpg[/img]

[b]从零开始创建一个程序(不用Eclipse)[/b]
GWT自带一个称为applicationCreator的命令行工具,它自动生成你将需要来开始一个GWT项目的所有文件。它也可以生成[url=http://www.eclipse.org/]Eclipse[/url]项目文件并为简单的hosted
模式debugging启动配置文件,这在下面描述了。
基于[url=http://code.google.com/webtoolkit/documentation/com.google.gwt.doc.DeveloperGuide.Fundamentals.ProjectStructure.html]推荐的GWT项目结构[/url],你的主要的GWT项目类应该在一个子包client下。你可以使用以下命令创建一个新的称为MyApplication的项目:
[code]
applicationCreator com.mycompany.client.MyApplication
[/code]
applicationCreator脚本将在src/com/mycompany/生成一些文件,src/com/mycompany/client/MyApplication.java类包括一些基本的"Hello, world"功能。
该脚本也生成了一个称为MyApplication-shell的[url=http://code.google.com/webtoolkit/overview.html#Modes]hosted模式[/url]启动脚本和一个称为MyApplication-compile的编译脚本,类似于上面的例子程序。
运行MyApplication-shell脚本来以hosted模式运行你新创建的程序:
[img]http://code.google.com/webtoolkit/images/myapplication-hosted.jpg[/img]
试着编辑src/com/mycompany/client/MyApplication.java和src/com/mycompany/public/MyApplication.html来看看它怎样更改你的程序。

[b]从零开始创建一个程序(使用Eclipse)[/b]
GWT自带一个称为applicationCreator的命令行工具,它自动生成你将需要来开始一个GWT项目的所有文件。它也可以生成[url=http://www.eclipse.org/]Eclipse[/url]项目文件并为简单的hosted
模式debugging启动配置文件。为了给一个新的程序生成一个Eclipse项目,首先使用projectCreator脚本来为你的程序生成一个shell Eclipse项目:
[code]
projectCreator -eclipse MyProject
[/code]
然后像上面描述的那样生成你的GWT程序,但是需要一个额外的指定你的Eclipse项目名的-eclipse标志:
[code]
applicationCreator -eclipse MyProject com.mycompany.client.MyApplication
[/code]
当你完成这些脚本,除了MyApplicatio-shell和MyApplication-compile脚本,你应该在你的当前目录看到.project,.classpath和MyApplication.launch文件。
为了在Eclipse中打开你的项目,启动Eclipse并点击File->Import菜单。在wizard的第一个screen中选择"Existing Projects into Workspace",并在wizard的
下一个screen里输入你生成.project文件的目录。当你完成这些,你应该看到你的GWT项目载入到了你的Eclipse workspace:
[img]http://code.google.com/webtoolkit/images/myapplication-eclipse.jpg[/img]
点击窗口上面的绿色的"Run"按钮来以[url=http://code.google.com/webtoolkit/overview.html#Modes]hosted模式[/url]启动你的项目。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值