Eclipse Forms設計漂亮UI之簡介

設計

本文將告訴你如何在你的富客戶程式中加入Eclipse Forms。Eclipse Forms可以在你的程式裡不通過嵌入瀏覽器而達到Web效果.這樣可以不僅對組件保持完全控制而且不失eclipse所有的可移植性，這篇文章將從Eclipse Forms的基本特性到進階特性一步一步指導你。
曆史
一個Eclipse平台的基本特性是:所有基於Eclipse平台開發的程式介面能夠象本地程式一樣.因為SWT，菜單，視窗，樹，表格，按鈕和其它組件在任何作業系統上都和系統風格保持一致.作為Eclipse小組最早的一個成員，我記得開發eclipse原型代碼快樂的日子.菜單是真的，工具列是真的，複選菜單，文字框，按鈕，複選框，選項按鈕都是真的.它們不是畫出來的，都是調用的作業系統的本機群組件。
很長一段時間裡，如果你寫過Eclipse外掛程式，它們基本上是屬於下面的範圍:
1.Editors (編輯器)
2.Views (視圖)
3.Wizards (嚮導)
4.Dialog (視窗)
這個範圍都有明確的規則規定了如何編寫外掛程式.我們已經看過了views裡的樹，表格，editors裡的文檔，還有簡單的象在嚮導和視窗裡的按鈕和文字框。
Eclipse 3.x裡的RCP在系統上擴充了一系列新的特性，它帶來了許多問題有效解決方案，你現在可以在eclipse上構建和IDE完全不同的RCP程式。
雖然一般的工作台部分比如視圖和編輯器工作的很好，但是構成這些部分的組件(樹，表格，文字編輯器等)在RCP裡有時候可能不是最好的解決辦法.從Eclipse 3.0起，Eclipse Forms被設計為來提供替代的解決方案。
具有諷刺意味的是，我們開發出的Eclipse Forms解決了一個比RCP早很長時間就存在於Eclipse SDK中的一個問題.使用專門編輯plugin.xml的帶文法分析，顏色顯示的文字編輯器的PDE開發人員並不高興.Eclipse的Java編輯器並沒有什麼問題，它非常強大，對於這個任務也很理想。但是，它是用來編輯Java代碼的，在外掛程式manifests裡，xml是用來在更高層次上抽象描述資料結構的。手工編輯xml，即使是使用帶文法分析，顏色顯示的編輯器，大部分使用者也覺得不太合適。在外掛程式manifests裡，文法不是重點，具體的資料和它的意思才是重點。
一個很好的不同例子是用HTML識別工具來查看標記.在代碼的角度，我們可以清楚地看見含有相關屬性的元素.雖然我們看到文法，但是很難看清楚它到底要表現什麼.一個WYSIWYG視圖可以顯示表格，顏色，還有一些含有表格，圖片等的常值內容.在這個角度使用html檔案更加具有生產效率。
因為文法和標記被隱藏在後台了。
弄明白對於html文檔的WYSIWYG概念很簡單，因為HTML標籤是用來展示為瀏覽器寫一個來表現屬性，超連結和圖片的文字文件結構的，WYSIWYG在這方面意味著在它最終的形式上編輯文檔--近可能和它在瀏覽器上的形式相同。指出用不同的方法的一個編輯外掛程式manifest編輯器的外觀很難.最終工作小組做出了以下決定:
1.用最合適它的方法來展示manifest的每個部分。舉個例子，象外掛程式名稱，提供者等重要訊息可以簡單的通過一個文字框來編輯，象擴充點定義這樣帶有階層的資料結構則通過樹來展現。
2.通過各個單獨的編輯頁面來展示manifest的各個部分，順序則按照它本來在代碼中的順序。
3.編輯器的每個頁面應該保持文檔的風格，並能夠容納不同的組件，超級連結，圖片，文本，並在對於頁面尺寸內容太多時提供一個捲軸.

圖片1：Eclipse SDK1.0中的外掛程式manifest編輯器.它容納了SWT組件，超連結和圖片，並且當尺寸不夠時能夠滾動(就象web瀏覽器一樣).注意為了看起來和常值內容更加融合，所有組件都是平滑的(flat).

第三點有效地促使了它作為現在以Eclipse Forms為名稱的外掛程式產生.在1.0發布後，其它的開發人員希望能夠複製PDE多頁面編輯器的富客戶介面。
它最終作為Eclipse3.0中帶有公用API的外掛程式發布了。
在下面的文章裡，我們將告訴你什麼是Eclipse Forms(和什麼不是Eclipse Forms)，並如何用簡單的使用它們來創造漂亮的介面。
Eclipse Forms Mission

Eclipse Forms是一個貫穿所有Eclipse UI的基於SWT和JFace的來提供可移植Web風格使用者介面的可選Rich Client外掛程式。
Eclipse Forms打破了只能用於特定Eclipse UI(編輯器，視圖，嚮導，視窗)的模式。為了滿足開發人員的需要，一個Eclipse form能夠以任何UI的形式出現。UI開發人員能夠使用為他們的任務選擇最合適的概念。
Eclipse不是用來設計完全替代SWT或JFace的.這個外掛程式只有一些精心挑選的專有定製組件 ，布局和支援類，以便使用SWT和JFace時達到預期效果.
很明顯的，一個Eclipse Form通常看起來象網頁一樣.事實是form的綱領可行性的各方面都是使forms強大的和具有吸引力.要同過瀏覽器達到這樣的彈性需要DOM支援，並且經常幾乎是聚耦的.Eclipse Forms是可移植的，並且是在SWT和JFace之上寫的.
Eclipse Forms已經在3.0 release中重寫來只依賴於平台UI外掛程式，而不再依賴於PDE UI外掛程式.雖然它們還不是RCP的最小化部分，但是你能夠在任何RCP程式中添加Eclipse Forms.
要點不能被低估.當構建Eclipse Forms時，你是在使用SWT.沒有Eclipse Forms按鈕，也沒有Eclipse Forms tree組件等等.你只是使用Eclipse Forms來讓現有的組件達到富客戶體驗.
Eclipse Forms是通過下列元素來達到目的的:
"form"概念和視圖，編輯器等是一個層次的概念.
一個工具包(toolkit)來管理顏色，超連結組還有其它方面.並且充當許多SWT組件的工廠類.
一個新的layout manager來管理布局，和HTML表格相似.
一組定製的組件用來配合form.(超連結，圖片超連結，滾動組合<scrollable composite>，段<section>)
一個各個頁面都是forms的多頁面編輯器(e.g. PDE manifest編輯器)
雖然Eclipse Forms的設計中沒有任何阻止您在一個視窗中建立form.但是大部分時候都是在視圖和編輯器中使用forms，而不是視窗或嚮導.的確，在一個普通的視窗或嚮導中加入form看上去有點怪，畢竟其他部分都是普通的SWT組件.無論如何，在未來，這是一個探索的方向.
Baby steps
在您的使用者介面中使用Eclipse Forms非常簡單.在開始前你在外掛程式依賴部分加入org.eclipse.ui.forms外掛程式.我們會建立一個擁有form的
Eclipse view，然後往裡面填充內容.注意這篇文章外掛程式的所有代碼都以zip檔案格式提供下載.
Hello， Eclipse Forms
我們從往view裡添加一個空白form來開始遊戲:

public class FormView extends ViewPart {
private FormToolkit toolkit;
private ScrolledForm form;
/**
* The constructor.
*/
public FormView() {}
/**
* This is a callback that will allow us to create the viewer and
* initialize it.
*/
public void createPartControl(Composite parent) {
toolkit = new FormToolkit(parent.getDisplay());
form = toolkit.createScrolledForm(parent);
form.setText("Hello， Eclipse Forms");
}
/**
* Passing the focus request to the form.
*/
public void setFocus() {
form.setFocus();
}
/**
* Disposes the toolkit
*/
public void dispose() {
toolkit.dispose();
super.dispose();
}
}

就象你在這段代碼中看到一樣，不需要太多就可以建立一個form.我們開始是建立一個toolkit執行個體().我們通過toolkit以提供的composite為parent來建立一個可以滾動的form.我們設定了form的標題.而且我們確定在需要的時候把focus傳給form，當view dispose時把toolkit也dispose掉。
這個視圖應該看起來象這樣:

圖片2

在view裡的一個空的form，使view變窄一點會讓form標題包裹起來，一旦沒有空間來容納整個form，捲軸就會顯示。
注意我們用到了可滾動的form，因為我們把它放到了一個可以改變大小的視圖中.在更複雜的環境裡，比如一個form需要作為一個布局的一部分，沒有滾動能力的form也可以用.在這種情況下，我們會調用FormToolkit.createForm()，讓外層的parent來解決需要捲軸的問題。