extbuilder ext eclipse 插件

extbuilder_update-20081116.zip (1.3 MB)
extjs可视化开发工具.rar (41.9 KB)


extbuilder插件的安装配置及使用


刚开始入手extjs觉得extjs使用起来比较的麻烦特别是js的导入和css样式的导入，于是在网上查了下有没工具可以自动集成extjs类库的，果然找到了extbuilder。ExtBuilder是一个eclipse插件可以帮助自动生成友好风格的JavaScript代码。

要安装extbuilder插件请先确保您的Eclipse版本是3.2以上的，还是老方法可以通过Eclipse上的帮助-》软件更新-》查找并安装-》搜索新功能来安装或者直接到官网（http://code.google.com/p/extbuilder/downloads/list）上下载（当前更新至extbuilder_update-20081116.zip），下载后解压，用link的方式安装，我用的是MyEclipse8.5的，安装的时候需要找到安装目录下的dropins文件夹（我的目录：C:\Program Files\Genuitec\MyEclipse 8.5\dropins），创建一个文本文件内容：path=D:\\zt\\plug\\extbuilder（后面的路径是我的extbuilder解压后的路径），随便命名，但至少要自己要看的懂，并且命名后缀是.link结尾的。重新启动MyEclipse8.5。貌似没有什么反应。

仔细一看官网才知道，在项目中点右键，New-》Other-》Web-》ExtjsPage。输入你想要的命名空间，输入你想要的类名， extbuilder创建在一个文件中一个类，就像Java，输入文件名，默认是类的名称，选择父类，默认为Ext.Panel ，你也可以创建一个由选择Ext.Window窗口。点击完成后会看到项目下面会多出两个文件ext后缀的和js后缀的。我们打开ext后缀的，MyEclipse会默认用ExtJsEditor打开，我们可以在窗口下的js和UI两个视图之间来回切换。

下面的步骤很重要，本应该是之前就该做的，但是我没有，导致后面出了问题。点击window的首选项会看到ExtJsBuilder节点。点击该节点，并指定 ExtJs Directory到我们下载ExtJs源码的目录。

刚开始进行设计的时候比较郁闷，左边工具栏里的控件怎么无法拖动？这是大家都要面对的问题。我们如果在建ExtJsPage的时候如果默认选择SuperClass为Ext.Panel的话，会在大纲视图里看到一个window节点。下面要看仔细了，在设计视图上我们点击右键，发现菜单就是我们机器上IE的菜单。这时你应该有所领悟了吧，UI Editor 其实是一个浏览器，不然ext基于JavaScript的效果不会这么快的显示出来了。所以就自然的工具栏的控件是不能拖动到页面上的。但是我们可以点击工具栏中的控件一下，然后在大纲里面将鼠标移动到容器节点(window、panel、FormPanel)上，会看到鼠标自动变为一个+号，点击鼠标，我们在工具栏里面点击的控件就被添加到该容器里面了。当然，视图中的效果立马就出来了。另外要修改某一个控件，可以在大纲中点击控件在属性窗口中修该其属性。