在MyEclipse 6.5中配置ext開發環境

https://code.google.com/p/extbuilder/wiki/UserGuide


要用到ext,就將我配置的過程跟大家說說,第一次用,有沒有多餘的步驟,暫時不知道呢,歡迎大家指正。

剛開始也是在網上找了一大堆的,都是轉載又轉載,或說得不清楚的,本人是昨天搞到現在才總算是把環境給搭建起來了。

原環境:MyEclipse 6.5 + jdk1.6.0_18

這個過程需要下載的文件:

spket-1.6.18.jar

ext-3.3.1.zip

extbuilder_update-20081116.zip

extbuilder-src-20081116.zip

GEF-ALL-3.7.0RC4.zip

總共安裝過程包括下面3步:



第一步:安裝Spket(參考:http://blog.csdn.net/lizh0912/archive/2009/02/23/3929925.aspx,不用每一步都按裏面的走,根據自己看到的界面參考這篇文章設置就ok了)


1、方法一:在線安裝

MyEclipse -> Help -> Software Updates -> Find and Install...-> Search for new features to install ->New remote site...
Name: "Spket", Url: "http://www.spket.com/update/",選擇finish後,提示錯誤。(這種方法安裝不成功)


2、方法二:下載jar包安裝

我這裏下載的是最新版spket-1.6.18.jar,在網上一搜一大堆下載鏈接的。

直接雙擊spket-1.6.18.jar運行安裝,安裝過程參考:http://blog.csdn.net/lizh0912/archive/2009/02/23/3929925.aspx

重啓MyEclipse,初始化插件。

然後就是配置ext,也參考http://blog.csdn.net/lizh0912/archive/2009/02/23/3929925.aspx這裏,因爲這裏已經介紹得很詳細了,圖文並貌。簡單文字說明:

Window -> Preferences -> Spket -> JavaScript Profiles -> New ;
輸入“ExtJS”點擊OK;
選擇“ExtJS” 並點擊“Add Library”然後在下拉條中選取“ExtJS”;
選擇 “ExtJS”並點擊“Add File”,然後在你的./ext-3.3.1目錄中選取“ext.jsb2” 文件。

Add File這步要注意的是,3.0以後的版本添加的文件是:ext.jsb2(D:/design soft/ext/ext-3.3.1這是我的文件所在目錄)。

這種方法安裝成功


3、方法三:下載壓縮包

下載spket的壓縮包文件,將features和plugins文件夾裏的內容copy到MyEclipse的對應文件夾下(D:/Program Files/MyEclipse 6.5/eclipse這是我的目錄)。(這種方法沒有嘗試


第一步只是安裝了開發ext的IDE,要實現可視化界面開發,還需要安裝extbuilder。




第二步:安裝extbuilder

extbuilder插件的安裝配置及使用
下載地址:http://code.google.com/p/extbuilder/downloads/list

(extbuilder-src-20081116.zip,extbuilder_update-20081116.zip)
用戶手冊: http://code.google.com/p/extbuilder/wiki/UserGuide

參考網址:
http://blog.sina.com.cn/s/blog_4b3b7aff0100eimi.html
http://hi.baidu.com/zst89/blog/item/2c00c089d9af92729e2fb4ef.html


1、方法一:在線安裝
(1)、make sure you eclipse version is 3.2,3.3 or 3.4 with GEF installed.
(2)、download archived update site from http://code.google.com/p/extbuilder/downloads/list
(3)、Click Help->Software Updates->Find and Install...->Search for new features to install,Click Next
(4)、Click New Archived Site-> Browse to extbuilder_update.zip and click Open.
(5)、Click OK and follow the instructions to install.
(6)、Restart you myeclipse
這種方法安裝不成功


2、方法二:link方法
D:/Program Files/MyEclipse 6.5/eclipse/links在這個文件夾下創建extbuilder.link文件,

文件內容:path=D://dragon//lib//extbuilder_update-20081116
這種方法在myEclipse裏沒看到有反應。(這種方法安裝不成功


3、方法三:下載壓縮包
(1)、D:/dragon/lib/extbuilder_update-20081116將這個文件夾下features、plugins文件夾裏的內容複製到D:/Program Files/MyEclipse 6.5/eclipse文件夾下對應的文件夾裏面
(2)、重啓myeclipse,在prefrences下面找到ExtJs Builder,裏面的ExtJs Directory就是你存放extjs的目錄D:/design soft/ext/ext-3.3.1

這種方法安裝成功


做完第二步之後,New -> Other... -> ExtJs Page新建一個ext頁面:

0_1307609320I1up.gif


問題來了!!!!!

(問題1:ExtBuilder沒顯示界面,解決:第三步)

剛開始的時候,UI Editor界面是一片空白,沒有顯示控件,但js代碼正常,待做完第三步之後,纔會出現上圖看到的界面。

(問題2:工具欄控件無法拖動,解決:參考http://hi.baidu.com/zst89/blog/item/2c00c089d9af92729e2fb4ef.html

到這裏有一點是很多初初接觸extbuilder的人不解的地方,網上也很少有人說到這點,我是找了很久,纔看到有一個人說到點上的。

這裏只是大家對extbuilder不理解,因爲一般的圖形開發工具,控件都是直接拖動的,如JBPM等。

UI Editor 其實是一個瀏覽器,不然ext基於JavaScript的效果不會這麼快的顯示出來了。所以工具欄的控件是不能拖動到頁面上的。用鼠標點擊左邊工具欄,如Button按鈕後,將鼠標移動到Outline裏某個panel上,就會在這個panel上新建一個button了。如下圖:

0_1307610332XM4M.gif





第三步:安裝GEF

下載地址:http://www.eclipse.org/gef/http://www.eclipse.org/gef/downloads/index.php

我這裏下載的是GEF-ALL-3.7.0RC4.zip

0_1307610939912T.gif


1、方法一:在線安裝

這種方法安裝不成功


2

方法二:下載壓縮包

解壓後,將.../GEF-ALL-3.7.0RC4/eclipse文件夾裏features、plugins文件夾裏的內容分別copy到D:/Program Files/MyEclipse 6.5/eclipse文件夾下對應的文件夾裏面
重啓myeclipse,再次打開UI Editor,界面能正常顯示控件了。



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章