《GWT揭秘》连载1/3_gwt揭秘源代码-CSDN博客

本文链接：https://blog.csdn.net/xubin_sh/article/details/5405194

《GWT揭秘》

书名：GWT揭秘
作者：徐彬
ISBN：9787111294016
丛书名：揭秘系列丛书
出版社：机械工业出版社
出版日期：2010 年1月
开本：16
页码：320
版次：1-1
定价：49元
豆瓣网讨论地址：http://www.douban.com/subject/4223579/
China-pub预订地址：http://www.china-pub.com/196306

国内第一本基于GWT 2.0的经典著作，4大专业社区联袂推荐，权威性毋庸置疑！

本书内容全面，不仅详细介绍了GWT的主要模块和控件、GWT与JavaScript对象的交互、在GWT中使用XML、开发自定义GWT控件、GWT-RPC和Ext GWT等必备的基础知识，而且还深入讲解了GWT与Flex整合、图片缓存、本地化、GWT动画、历史管理、延时/等待/分片执行等高级知识；本书注重实战，所有知识点都配有精心设计的范例，尤为值得一提的是，还以迭代的方式重现了经典的俄罗斯方块游戏和一个完整的报销审批系统的开发全过程，既可以以它们为范例进行实战演练，又可以将它们直接应用到实际开发中去。

准备篇

第1章准备开发环境

本章内容
* 安装JDK
* 安装Eclipse
* 安装Eclipse插件
* 辅助工具

1.1 安装JDK
开始开发GWT应用程序之前，需要做一些准备工作。Java环境对于开发GWT应用是必不可少的。GWT需要Java 5以上的版本。

提示 GWT的调试器依赖32位的SWT界面库。要在系统上调试GWT项目，必须安装32位JDK。当然在64位JDK环境中也可以编译GWT项目。最新的Mac系统，Java 6只提供64位JDK。调试GWT项目需要额外安装32位Java 5。
打开命令行输入java -version检查JDK的版本。系统报告“'java'不是内部或外部命令，也不是可执行程序或批处理”或版本低于1.5，则需要更新机器上的JDK。

进入网站http://java.sun.com/javase/downloads下载JDK安装程序。

提示安装完成后，要检查JDK是否配置正确。安装程序会把java.exe等可执行程序复制到系统的system32目录下。某些第三方的程序会把自己的JDK的路径添加到系统Path环境变量中。这样，即便安装最新版本的JDK，系统还是会使用第三方程序所带的旧版本JDK。这种情况下GWT可能无法正常运行。例如机器上已安装Oracle，就会发现这种现象。手工修改系统Path路径以解决此类问题。

1.2 安装Eclipse
开发GWT只需要JDK。但有个好的开发环境可以极大提高工作效率。Eclipse是最流行的Java集成开发环境。Google提供了GWT的Eclipse开发插件。目前Google提供的插件只支持Eclipse 3.3以上版本。

打开网址http://www.eclipse.org/downloads/，进入到Eclipse Downloads页面选择下载Eclipse IDE for Java EE Developers。下载完成后得到一个zip包。Eclipse是绿色软件，解压后就能使用。

GWT 1.6发布的时候，Google同时发布了Google Plugin for Eclipse。安装后，可以方便地在Eclipse中创建、运行、调试项目和进行单元测试等工作。最新版本的Google插件中包含GWT SDK 1.7版，安装插件后就不再需要下载单独的GWT SDK了。
在Eclipse的“Help”菜单下选择“Software Updates...”，打开Software Updates and Add-ons对话框，选择“Available Software”面板，如图1-1所示。

1-1

图1-1 软件升级和插件管理界面

单击“Add Site...”按钮打开“Add Site”对话框。在Location中输入http://dl.google.com/eclipse/plugin/3.4，结果如图1-2所示。

说明如果你使用的是Eclipse 3.3版，那么在Location中输入http://dl.google.com/eclipse/plugin/3.3。
如果是Eclipse 3.5版，则Eclipse安装插件的菜单移至“Help”下的“Install New Software...”，单击菜单项后弹出Install对话框，在“Work with:”输入框中输入 http://dl.google.com/eclipse/plugin/3.5 即可进行安装。

1-2

图1-2 添加GWT插件更新站点

单击“OK”按钮关闭Add Site对话框。Eclipse获取插件列表。更新Software Updates and Add-ons对话框的内容，如图1-3所示。

1-3

图1-3 刷新后的软件升级和插件管理界面

勾选http://dl.google.com/eclipse/plugin/3.4及其子项。单击“Install...”按钮，显示Progress Information进度对话框开始下载安装包。经过漫长的等待，下载完成。

1-4

图1-4 安装确认和许可权确认

下载完成后，Eclipse核对要安装的软件包，单击“Next”按钮确认许可权。选择“I accept the terms of the license agreements”单选按钮，单击“Finish”按钮后开始安装。如图1-4所示。

又是一番漫长的等待后，插件安装完成。重新启动Eclipse后Google Plugin for Eclipse安装完成。

1.4 安装GWT 2.0的SDK以及Eclipse插件
使用GWT 2.0的开发人员需要独立下载最新版本的GWT 2 SDK， GWT 2.0不再有平台特殊性，也就是说任何操作系统平台使用的都是相同的SDK。将下载的zip文件解压至任意目录。在本书的例子中，我们将其解压至c:/jee/ gwt-2.0.0-rc1中。

接着为Eclipse安装GWT 2.0的插件，GWT 2.0的插件需要有Eclipse Web Standard Tools （WST）插件的支持，可以到Eclipse官方网站下载独立的WST插件，或者直接下载安装Java EE Developers版本的Eclipse。根据安装运行的Eclipse版本下载对应的插件版本：
3.5 (Galileo): http://dl.google.com/eclipse/plugin/3.5/zips/gpe-e35-1.2rc1.zip
3.4 (Ganymede): http://dl.google.com/eclipse/plugin/3.4/zips/gpe-e34-1.2rc1.zip
3.3 (Europa): http://dl.google.com/eclipse/plugin/3.3/zips/gpe-e33-1.2rc1.zip

注意下载地址的URL路径会根据插件的版本变化有所不同，请查阅GWT官方网站，以获得最新的插件包。

下载完成后，将zip包中的文件安装到Eclipse中。插件的安装方法很简单，直接将插件包中eclipse目录下的features、plugins子目录解压缩到Eclipse的安装目录中的dropins目录即可。

插件安装完成后，启动Eclipse主程序。选择“Windows”→“Perferences”菜单，弹出“Perferences”对话框。展开“Google”→“Web Toolkit”配置节点，如图1-5所示。

图1-5 GWT SDK设置

单击“Add...”按钮，弹出添加SDK对话框，输入前面SDK的解压目录“c:/jee/gwt-2.0.0-rc1”，以及为SDK起一个唯一的名称“GWT 2.0 rc1”，如图1-6所示。

1-6

图1-6 添加GWT SDK

单击“OK”按钮，并关闭Perferences对话框，完成插件的配置。

1.5 辅助工具
AJAX程序的本质是动态修改DOM和Style。能够查看浏览器中DOM状态，将十分有助于程序的开发和调试工作。

1.5.1 Internet Explorer Developer Toolbar
Internet Explorer Developer Toolbar是微软提供的工具。可以查看IE中DOM状态，查找DOM元素，动态修改DOM属性及Style。

进入http://www.microsoft.com，搜索Internet Explorer Developer Toolbar关键字，就能找到下载页面。安装后，选中IE的“查看”→“浏览器栏”→“IE Developer Toolbars”菜单项，打开“IE Developer Toolbar”界面，如图1-7所示。

1-7

图1-7 IE Developer Toolbar主界面

“IE Developer Toolbar”面板上方是工具按钮和菜单条。左边面板是DOM树，中间是选中“DOM”的属性，右边是选中“DOM”的“Style”。可以在“DOM”属性面板中修改“DOM”属性和“Style”。

1.5.2 Firebug
Firebug是Firefox的插件。可以查看和修改Firefox中DOM的状态。使用Firefox访问https://addons.mozilla.org/zh-CN/firefox/addon/1843安装Firebug。安装后Firefox状态栏里增加了“Firebug”按钮。单击按钮打开Firebug界面，如图1-8所示。

1-8