探索 Eclipse 的 Ajax Toolkit Framework.docx
- 文档编号:10581314
- 上传时间:2023-02-21
- 格式:DOCX
- 页数:21
- 大小:474.64KB
探索 Eclipse 的 Ajax Toolkit Framework.docx
《探索 Eclipse 的 Ajax Toolkit Framework.docx》由会员分享,可在线阅读,更多相关《探索 Eclipse 的 Ajax Toolkit Framework.docx(21页珍藏版)》请在冰豆网上搜索。
探索Eclipse的AjaxToolkitFramework
探索Eclipse的AjaxToolkitFramework
文档选项
窗体顶部
将此页作为电子邮件发送
未显示需要JavaScript的文档选项
窗体底部
级别:
中级
TimMcIntire,顾问,FreelanceWriter
2007年1月22日
AjaxToolkitFramework(ATF)是新的OpenAjaxInitiative的核心部分,旨在通过EclipseFoundation提高对功能强大的Web编程技术的可访问性。
通过为各种开源Ajax工具包(包括Dojo、Zimbra和Rico)添加AsynchronousJavaScriptandXML(Ajax)开发环境,ATF扩展了EclipseWebToolsPlatform(WTP)。
本文包括一个HelloWorld示例,您将在其中安装和配置ATF,然后使用Eclipse和Dojo来创建基本的Web应用程序。
本文是我在2006年5月介绍OpenAjaxInitiative的标题为“将Ajax带入Eclipse的AjaxToolkitFramework的两个工具”的文章和近期的ATF(请参阅参考资料)的后续延展。
从那时到现在,项目已从当初的宣布发行到alphaWorks版本再到现在的Eclipse项目发布的V0.1版本。
ATF位于EclipseWTP的顶部,WTP在Web开发社区中使用得十分广泛。
WTP通过添加用于开发Java™2Platform,EnterpriseEdition(J2EE)Web应用程序的工具扩展了Eclipse。
ATF通过为各种开发源码的Ajax工具包(包括Dojo、Zimbra和Rico)添加Ajax开发环境扩展了WTP。
它增强了JavaScript编辑功能,提供了edit-time语法检查、文档对象模型(DocumentObjectModel,DOM)和层叠样式表(CascadingStyleSheet,CSS)Inspector和集成Mozilla浏览器。
ATF允许开发人员使用Eclipse作为开源工具包所需的企业级集成开发环境(IDE)。
ATF背后的OpenAjaxInitiative的目标是提高对Ajax的可访问性,Ajax正在迅速流行开来,但是对于新的开发人员来说概念还是很晦涩难懂。
本文使用Eclipse、ATF和Dojo将ATF的安装步骤和创建示例Ajax应用程序紧密联系在一起。
“将Ajax带入Eclipse的AjaxToolkitFramework的两个工具”介绍了Dojo和Zimbra,并且先提供了“HelloWorld!
”示例,然后提供了用ATF将Dojo集成到Eclipse中的方法。
本文利用了V0.1版来创建类似的项目,并且更加简单。
安装ATF
启动之前,请先阅读在Microsoft®Windows®下安装的快速说明(有关详细信息和下载,请参阅参考资料)。
如果尚未使用Eclipse,请下载J2EE项目包,其中包括CoreEclipseV3.2.1和EclipseWTP(使用ATF时要求使用WTP)。
如果尚未安装和使用Eclipse,这是满足ATF基本要求的最简单方法。
要开始使用ATF,请执行以下操作:
1.从Eclipse.org下载ATF的最新版本。
本文是基于V0.1版(0.1-20060912)。
在下载并安装以下所有必需的组件之前,请先不要安装。
2.下载JavaRuntimeEnvironment(JRE)V1.4.2,它在当前的V0.1版中是必需的。
SunMicrosystems或IBM®版本都可以使用。
3.下载ApacheTomcatV5用作本地Web服务器和XULRunner,用于帮助Eclipse建立与Mozilla的接口(请参阅参考资料)。
4.安装XULRunner、JRE,然后安装TomcatV5。
注:
TomcatV5更倾向于使用JREV5,因此还可能需要下载它,以避免特殊的Tomcat安装指导。
5.安装Eclipse(如果系统中没有安装的话)。
安装了Eclipse之后,您就可以准备安装ATF了。
有关详细的安装细节,请参阅参考资料。
要将ATF安装到Eclipse中,请打开Eclipse,然后单击Help>SoftwareUpdates>FindandInstall>SearchforNewFeaturestoInstall>NewArchivedSite。
然后选择包含ATF的压缩文件。
通过安装屏幕的提示指导您完成安装,其间应当确保选择所有ATF组件。
确保仔细阅读ATFDownload信息。
一些ATF版本(包括V0.1)包含特殊安装说明,末尾介绍了如何安装附加文件。
回页首
在ATF中构建Dojo应用程序
现在您已经准备好构建第一个Dojo应用程序。
开始先创建一个新项目。
参考资料包含一个指向flash动画的链接,该动画将演示此过程的初始步骤,但是您将越过此进程创建一个互动的HelloWorld应用程序。
新项目打开后,请完成以下步骤:
1.打开Eclipse,然后单击File>New>Project。
2.单击Web>StaticWebProject,然后单击Next。
图1.选择项目类型
3.在Projectname字段中键入HelloWorld,然后单击TargetRuntime下方的New。
此名称将是整个项目的封闭名称,可以在其中包括与所选名称同名的子文件夹和Web应用程序。
图2.为项目命名
4.单击HTTP>HTTPServer,然后单击Next。
在此步骤中,您将告诉Eclipse需要使用本地HTTP服务器作为运行时目标。
这就是安装步骤过程中必须安装TomcatV5(或其他支持HTTP的服务器)的原因,允许您在本地分析Eclipse内应用程序行为。
图3.设置指向本地HTTP服务器的链接
5.为本地HTTP服务器键入正确的端口(可能80或8080),然后键入希望用于应用程序的目录的名称。
6.选择PublishProjectstothisServer,然后单击Browse以选择本地Web目录。
该示例在我的系统中的路径是C:
\ProgramFiles\ApacheSoftwareFoundation\Tomcat5.5\webapps\ROOT\helloworld。
您可能需要创建helloworld目录,但父目录可能已经存在了。
7.单击Finish。
图4.设置本地HTTP目录
8.单击Next,然后单击ATF>Dojo。
9.取消选中Rico复选框,然后单击Finish。
此步骤将按照使用DojoToolkit开发Ajax应用程序的所有必要要求来设置项目。
图5.启用DojoToolkit
上述步骤将在Eclipse中创建Dojo项目骨架。
现在必须开始着手创建一个应用程序。
创建应用程序
在Navigator中,展开HelloWorld。
接下来,右键单击WebContent,然后单击New>Other。
图6.创建新的Web内容
现在,展开Dojo并单击DojoApplication>Next。
以上步骤将设置应用程序的框架,但是此步骤实际上将创建一个文件,用于项目内的单个Dojo应用程序的编辑和构建过程。
您可以在单个项目中创建多个应用程序。
图7.创建Dojo应用程序
在Name字段中键入helloworldapp,然后单击Finish。
每个应用程序名称与项目名称至少应当略有不同,以区分此组文件所代表的内容。
图8.为Dojo应用程序命名
此步骤将在Eclipse的中央框架中装入helloworldapp.html。
在此框架中,编辑helloworldapp.html将其从只有骨架的应用程序更改为可运行的HelloWorld应用程序。
图9.检验编辑窗格
生成运行的HelloWorld应用程序
首先将标题更改为HelloWorld。
这是一个常规的HTML文件,它支持您所熟悉的语法和HTML,而且还包括使用Dojo和Dojo控件的JavaScript代码。
您可以像处理任何其他Web页面一样处理基本的HTML元素。
图10.改变HTML以包括相应的项目名称
现在,为HelloWorld应用程序添加代码。
这些代码片段在先前的HelloWorld示例中也有使用,但在本例中,应用程序的框架是用Eclipse设置的。
将此脚本插入helloworldapp.html代码的head部分的末尾。
使用此代码片段创建一个按钮,用户可以按下该按钮将“HelloWorld!
”写入调试窗口。
图11.向代码中添加Button控件
最后,在body部分的顶部,添加代码使按钮实际显示在用户的屏幕上。
由于您已经装入了DojoButton控件,因此现在可以在HTML的主体中引用它。
注意,这比只打印出helloworld句子而没有用户交互的典型HelloWorld应用程序稍高级一些,但消息被输出到了调试窗口。
图12.向内容区域中添加实际按钮
保存、编译并运行应用程序
现在需要保存、编译和运行您创建的HelloWorld应用程序:
1.单击File>Save。
2.在Eclipse的Navigator框架中展开HelloWorld、WebContent和helloworldapp。
3.右键单击helloworldapp.html,然后单击RunAs>RuninMozilla。
4.单击Finish将打开运行HelloWorld应用程序的集成Mozilla浏览器。
图13.检验Dojo应用程序的输出
单击PressMe,然后您将看到“HelloWorld!
”显示在调试控制台中。
如果正常显示并且没有其他消息,则可以确信ATF安装和项目代码运行正常。
图14.尝试使用按钮
扩展应用程序的功能
现在,您已经有了一个基本的运行应用程序,接下来利用ATF附带的代码片段来扩展功能。
如果Eclipse视图中还没有Snippets窗格,请单击Window>ShowView>Other。
展开General,单击Snippets,然后单击OK。
Snippets窗格应当会出现在Eclipse窗口的右侧。
图15.预制的代码片段
展开Snippets窗格中的Dojo,然后将dojo.require拖入helloworldapp.html编辑窗格的JavaScript块中。
系统将显示一个对话框要求输入软件包名称。
对于本例,请键入dojo.widget.Tree。
这样做将添加一行代码用于装入Tree控件,它将允许您在代码的内容区域使用控件。
图16.装入Tree控件
向下滚动至helloworldapp.html的主体部分,并将Tree从Snippet窗格拖到编辑窗格中。
Eclipse将询问是否包括示例数据。
取消此复选框,从而仅添加封装Tree代码。
然后,将TreeNode片段从Snippet窗格拖入编辑窗格的Tree标记内,然后将节点命名为Hello。
随后,在Hello节点内再添加三个Tree节点。
图17.用HelloWorld数据创建Tree节点
需要再次保存、编译和运行已创建的HelloWorld应用程序。
单击File>Save。
然后在Eclipse的Navigator框架中展开HelloWorld、WebContent和helloworldapp。
在helloworldapp.html上单击鼠标右键,然后单击RunAs>RuninMozilla。
单击Finish将打开运行HelloWorld应用程序的集成Mozilla浏览器。
您应当可以单击展开和收缩Hello节点,这样可以显示或隐藏其子节点。
回页首
结束语
现在,您已经基本了解了如何在Eclipse中使用ATF创建Dojo项目的组件。
要成为更高级的用户,请了解如何在Eclipse中使用所选Ajax工具包的全部内容。
而且,需要研究EclipseATF中使用的高级功能,例如DOMInspector、CSSInspector和JavaScript调试程序。
使用Dojo创建一个简单的HelloWorld应用程序极大地简化了使用Eclipse的过程,构建完整的Web应用程序的优势会在项目变得越来越复杂时不断累积。
接下来的文章将提供新版本及功能的更新,并进一步讨论关于ATF及其他支持工具包(例如Zimbra和Rico)更多组件的详细信息。
参考资料
学习
∙您可以参阅本文在developerWorks全球站点上的英文原文。
∙访问IBMdeveloperWorks的Eclipse项目资源中心,了解关于Eclipse的更多信息。
∙Ajax技术资源中心:
在这里您可以找到更多关于Ajax的知识,包括Ajax基础入门、使用Java,PHP等语言开发Ajax应用的各种技巧和多种Ajax框架的技术信息。
∙阅读“将Ajax带入Eclipse的OpenAjaxToolkit的两个工具”关于ATF的介绍。
∙阅读“使用AjaxToolkitFramework开发Dojo应用”介绍如何利用AjaxToolkitFramework工具来使用DojoToolkit开源工具包,从而简化和增强Ajax应用的开发。
∙“TechTitansContributeBrowser-BoostingAjaxTechnologiestoOpenSourceCommunity”:
2006年2月的这篇IBM新闻稿提供了关于OpenAjaxInitiative的详细信息。
∙访问Eclipse.org以获得关于EclipseIDE的详细信息。
∙观看Flash动画DojoProjectCycleDemo,它是关于如何在Ajax中创建Dojo项目的。
您可以将此信息用在本文的某些步骤中。
∙查看DojoToolkit文档获得关于Dojo的更多信息。
∙查看JotSpotwiki中HelloWorld的详细示例。
∙要获得Eclipse平台的优秀介绍,请参阅“Eclipse平台入门”。
∙随时关注developerWorks技术讲座和网络广播。
∙查阅最近将在全球举办的面向IBM开放源码开发人员的会议、展览、网络广播和其他活动。
∙访问developerWorksOpensource专区以获得大量的how-to信息、工具和项目更新信息,可以帮助您利用开放源码技术进行开发,并与IBM的产品结合使用。
∙要收听针对软件开发人员的有趣访谈和讨论,一定要访问developerWorkspodcasts。
获得产品和技术
∙查看ATF项目。
∙查看EclipseWTP项目。
∙下载EclipseCallisto包获得安装ATF所需的基本组件。
∙从Eclipse下载最新版本的ATF。
∙下载JRE,这是使用ATF所必需的组件。
∙下载ApacheTomcatV5,它是将集成到ATF中的兼容Web服务器。
∙请参阅IBMalphaWorks中最新的Eclipse技术下载。
∙使用IBM试用软件改进您的下一个开放源码开发项目,这些软件可以通过下载或从DVD中获得。
讨论
∙Eclipse新闻组有很多参考资料适用于对使用和扩展Eclipse感兴趣的人士。
∙通过参与developerWorksblogs加入developerWorks社区。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 探索 Eclipse Ajax Toolkit Framework
![提示](https://static.bdocx.com/images/bang_tan.gif)