利用 Rational Application Developer Visual Editor 實現 Swing 可視化組件與數據的綁定
引言
Java™可視化編輯器允許用戶以圖形化的方式編輯 Java 用戶界面。在 IBM Rational Application Developer for WebSphere® Software V6 中，這一功能得到了進一步的增強。因為 V6 支持可視化組件與不 同來源的數據快速綁定，比如，這些數據可以來源於 Web 服務，也可以來源於 EJB 組件。這篇文章講述了如何利用數據綁定的優秀特性，用一種快速而強大的 方法，來定義用戶界面的數據讀取和數據寫入。
Swing 概覽
如同 許多其它部件一樣，AWT（抽象窗口工具）和 Swing 圖形界面組件均被包括在 JAVA 基礎類庫(JFC)中，它們提供了一個框架，可以輕松的構造圖形用戶界面 (GUI)，為 JAVA 應用程序添加豐富的圖形化功能性和互操作性。Swing 是一個 功能豐富的通用工具包，它提供了很多非常實用的功能。但出於我們的目標需要 ，在這裡我們只集中描述兩個重要的功能，因為這兩個功能對於理解可視化編輯 器的綁定模型和綁定操作是最為重要的。
使用 Swing 的數據模型
大部分的 Swing 組件均有一些模型，利用這些模型，您可以靈活地決定 如何存儲和檢索應用程序中的數據。其中，在 Rational Application Developer（以下簡稱為Application Developer）的數據綁定工具中就有兩個這 樣的模型，它們是文檔和表格模型，下面讓我們看看這兩個模型：
圖 1 ：文擋模型
在文檔模型中（如圖 1），使用文本組件從它的數據視圖中分離出數 據（稱為模型），該模型實現了 javax.swing.text.Document 接口，並提供以 下的服務：
包含文本。文檔把文本內容存儲在 javax.swing.text.Element 對象中，同時還可表示任意文本邏輯結構，比如段 落、共享樣式文本等等。
通過 remove(String aString) 和 insertString(int position, String aString, AttributeSet anAttributeSet) 來提供對文本編輯的支持。
將文本的改動通知給文檔 監聽器並使編輯監聽器可撤銷改動。
管理 Position 對象。當文本內容 被更改時，Position 對象會跟蹤文本中的特定位置。
使您能夠獲取文本 的相關信息（例如它的長度），以及文本片段。
下面是在文本域中設置 一個文檔的例子：
Document doc = new MyDocument();
...
textfield = new JTextField();
textfield.setDocument (doc);
圖 2：表格模型
在表格模型中（圖 2），圖形化組件使您可以列出行和列的數據，同 時有滾動條來提供分頁功能。每一個表格都從實現 javax.swing.table.TableModel 接口的對象中獲取數據。通常，您可以將表格 模型作為 javax.swing.table.AbstractTableModel 類的子類來實現。
您的表格模型可以用 array、list、或 hash map 來存儲數據，或者可以從外部 數據源（比如數據庫）獲取內容。在某些情況下，模型可以在執行期間實際生成 數據。
我們可以用 JTable 顯示任意數據模型，並通過下面的代碼來實 現 TableModel 接口:
TableModel myData = new MyTableModel ();
JTable table = new JTable();
table.setModel (myData);
使用 Swing 操作
當有兩個或更多執行相同功能 的組件時，我們通常使用操作對象將功能封裝起來，並實現 javax.swing.Action 接口。操作對象是一種操作監聽器，它提供操作--事件的 處理。使用 setAction 方法將操作添加到組件中，就會產生以下效果：
組件的狀態被更新以匹配操作的狀態。例如，如果設置了操作的文本和圖標的值 ，組件的文本和圖標就會更新，以反映這種變化。
在組件中，操作對象 被注冊為操作監聽器
如果操作的狀態發生改變，組件的狀態會被更新以 匹配該操作。例如，如果您改變了操作的啟用狀態，所有與之關聯的組件都會改 變各自的啟用狀態，以匹配操作的改變。
這裡有一個為按鈕設置操作的 例子:
Action myAction = new MyAction();
...
button = new JButton();
button.setAction (myAction);
Swing 可視化組件的數據綁定
Eclipse 中的 可視化編輯器使用 AWT/Swing 組件來支持可視化結構。設計選項板包含了常用 的組件、容器、菜單及控件，並使用可擴展、壓縮和打開的 drawer 將它們組織 起來。
如果在綁定 Swing 可視化組件時不使用 Application Developer binder， 那麼就是一種手動操作處理，這就要求我們在設計代碼編輯器（design source editor）中加入正確的代碼。然而，如果我們使用 binder，就可以使用數據源 、數據對象以及 Swing binder 助手類的組合，並利用可視化反饋，從而可以更 加快速、更加簡便的進行可視化組件的數據綁定。
Application Developer 中支持的缺省 Swing 可視化組件包括文本域、表格 、按鈕。如果需要，您還可以通過實現所提供的接口，為其它組件編寫 binder 。Visual Editor 提供的對話框可以幫助您創建數據對象和數據源，您可以使用 它們來綁定可視化組件。然而，如果不使用這些對話框，您還可以通過選項板添 加基本數據對象、數據源數據對象及數據源，並使用 Properties 視圖對它們進 行配置。考慮到將來可能要支持其它選件（widget）庫，數據源和數據對象類均 完全獨立於可視化組件。
當您將可視化組件綁定到數據源和數據對象時，binder 代碼會根據需要被生 成到您的項目源文件目錄中。在缺省情況下，所生成的類會被添加到項目的 jve.generated 包中。然後，您可以自由地擴展、替換、或重寫數據綁定邏輯。 倘若您更改了 jve.generated 類並添加一些自定義的業務邏輯，它們將不會被 Visual Editor 改寫。
Swing binder
Binder 將可視化組件連接到數據對象。可視化組件和它的 binder 之間是一 對一的關系。但數據對象和同它發生交互的 binder 之間則是一對多關系。換句 話說，就是可以將多個可視化組件綁定到一個給定的數據對象，但每個可視化組 件都需要它自己的 binder。
數據源
數據源如同數據工廠，它的目的是為數據對象提供數據，以及獲取原始數據 。Application Developer 的可視化編輯器支持的數據源包括 J2EE 會話 bean 、Web 服務以及JavaBean。數據源可以看作是虛包（facade）工廠，它提供了各 種配置屬性，從而可以實現數據源虛包的實例化和初始化。虛包是包含一套方法 的類，利用它，你可以從後台創建數據對象，或提供一些其它的業務功能。當然 ，這需要數據源實現者正確地實例化虛包。
數據對象
數據對象代表本地可用數據的對象。利用它，客戶端組件可以進行交互；它 也是對象的封裝器，可以管理該對象的屬性變更事件。
圖 3 顯示的是 Application Developer 中的設計選項板，包括可視化組件 的 drawer，以及數據 binder。
圖 3：Rational Application Developer 設計選項板
MyBooks 應用程序范例
這裡，我們對 MyBooks 程序做了一些改動，以便我們能更好地關注 Application Developer visual editor for data binding 所支持的三個 Swing 可視化組件：JTextField、JTable 和 JButton。圖 4 顯示了 MyBooks 應用程序的一個屏幕截圖，該程序將 XML 數據顯示在 JTable 中，XML 文件名 顯示在 JTextField 裡，同時還有一個名為 SAVE 的 JButton。
圖 4 MyBooks 應用程序表格模型
MyBooks 采用了一個參數：XML 文件的名稱，它包含了所有在表格中顯示的 書籍清單。當我們按下了 SAVE 按鈕後，表格中的內容將被保存在文本域中指定 的 XML 文件裡。
為了創建 MyBooks 應用程序，我們在 A 部分中設計好基本 GUI，然後在 B 部分中使用 Application Developer 可視化地將 GUI 與數據綁定起來。
A 部分：構建用戶界面和 JAVA 數據工廠
為了構建 MyBooks 的用戶界面，我們將使用可視化編輯器：
創建一個 JAVA 項目
在 Application Developer 中，選擇 File => New => Project。
選擇 Java Project 並按下 Next 按鈕。
為項目輸入名稱 MyBooks ，然後按下 Next 按鈕。
從 Application Developer 安裝程序中將 xsdbeans.jar 添加到 Java 構建 路徑中，這個 JVR 文件位於：
<rad_install>/SDP/6.0/rwd/eclipse/plugins/com.ibm.etools.xsd.codegen.xsdbeans_6.0.0\jars\xsdbeans.jar。
按下 Finish 按鈕。
創建包 ve.eclipse 和 ve.rad。
添加主要的可視類
在 Package Explorer 中，右鍵單擊項目並選擇 New => Other。
選擇 Visual Class 然後按下 Next 按鈕。
指定壓縮包的名稱為 ve。
指定類的名稱為 MyBooksApp。
確保超類 Superclass 是 javax.swing.JFrame，並且 public static void Main(String[] args) 被選中。
按下 Finish 按鈕。
定制 JFrame
將私有變量 filename 添加到該類中，數據類型為 String。
修改構造函數 MyBooksApp() 的結構，使其如下所示：
public MyBooksApp(String f) {
super();
filename = f;
initialize();
}
修改 main()，使其如下所示： public static void main(String[] args) {
MyBooksApp app = new MyBooksApp(args[0]);
app.show();
}
在可視化編輯器窗口中選擇文本 JFrame，並在彈出的可編輯文本框中，輸入 MyBooks。
在可視化編輯器窗口中選擇 JFrame 組件，並確保當前處於 Properties 視 圖。
從 Properties 視圖中，將屬性 defaultCloseOperation 設置為 EXIT，然 後按下 Enter 按鈕。
從 Properties 視圖中，將屬性 size 設置為 400,200，然後按下 Enter 按 鈕。
添加一個文本域
功能：這一可視化組件將顯示 XML 文件名。
在選項板的 Swing Containers 部分中選擇 JPanel。 然後把它拖放到可視 化編輯器中 JFrame 組件之外的位置。
在選項板的 Swing Containers 部分中選擇 JLabel，然後把它拖放到 JPanel 中。
從 Properties 視圖中，將 JLabel 的 text 屬性設為 XML filename:，然 後按下 Enter。
在選項板的 Swing Containers 部分中選擇 JTextField，然後把它拖放到 JPanel 中。
將 JPanel 放置在 JFrame 的 North 部分。
添加一個按鈕
功能：這個可視化組件可以將表格中的數據保存到指定的 XML 文件中。
在選項板的 Swing Components 部分中選擇 JButton，並將它放置在 JFrame 的 South 部分。
從 Properties 視圖中，將 JButton 的 text 屬性設為 SAVE，然後按 Enter。
添加一個表格
功能：該可視化組件將顯示 XML 文件的內容
在選項板的 Swing Containers 部分中，選擇 JScrollPane 上的 JTable， 並把它放置到 JFrame 的 Center 部分。
按下 CTRL-S 以保存可視類，然後關閉編輯器。
將類復制到 ve.eclipse 和 ve.rad 中。
這個練習的用戶界面部分現在已經完成：我們創建了一個 JAVA 項目以存儲 可視類 JFrame, 可視類由三個關鍵的 Swing 組件構成，即 JTextField、 JButton 和 JTable.
不過，我們只是完成了第一部分工作的一半，下一步就要編寫業務邏輯。利 用這些業務邏輯，我們可以在可視類和數據源之間進行數據的讀取或寫入。在這 個案例中，我們的數據源就是 XML 文本。此時，可視化編輯器中的 GUI 如圖 5 所示。
圖 5：MyBooks GUI
Java 數據工廠的主要功能在於讀取 XML 文件的內容。不過，在我們創建 Java 數據工廠以前，我們得先創建 XML 文件和兩個數據類型：
創建 XML 文件
在 MyBooks 項目中新建一個文件，命名為 books.xml ，然後把下面的這些 內容復制到所生成的文件中： <?xml version="1.0" encoding="UTF-8"? >
<books>
<book>
<title>VisualAge for Java for Non-Programmers</title>
<author>Parkin, Burrus, Pullin</author>
<copyrightDate>2002</copyrightDate>
</book>
<book>
<title>Bird Life & Behavior</title>
<author>Sibley</author>
<copyrightDate>2001</copyrightDate>
</book>
</books>
創建 book 數據類型
XML 文件的每個條目都會存儲在 book 對象中。新建一個 JAVA 類，並把它 命名為ve.book，然後把下面的代碼粘貼到文件內容中： =package ve;
import com.ibm.etools.xmlschema.beans.*;
public class book extends ComplexType {
public book() {
}
public void setTitle(String title) {
setElementValue("title", title);
}
public String getTitle() {
return getElementValue("title");
}
public boolean removeTitle() {
return removeElement("title");
}
public void setAuthor(String author) {
setElementValue("author", author);
}
public String getAuthor() {
return getElementValue("author");
}
public boolean removeAuthor() {
return removeElement("author");
}
public void setCopyrightDate(String copyrightDate) {
setElementValue("copyrightDate", copyrightDate);
}
public String getCopyrightDate() {
return getElementValue ("copyrightDate");
}
public boolean removeCopyrightDate () {
return removeElement("copyrightDate");
}
}
創建 books 的數據類型
books 對象存儲 book 的條目清單。新建一個 JAVA 類，並把它命名為 ve.books ，將內容設置為： package ve;
import com.ibm.etools.xmlschema.beans.*;
public class books extends ComplexType {
public books() {
}
public void setBook(int index, book book) {
setElementValue(index, "book", book);
}
public book getBook(int index) {
return (book) getElementValue("book", "book", index);
}
public int getbookCount() {
return sizeOfElement ("book");
}
public boolean removeBook(int index) {
return removeElement(index, "book");
}
}
創建 Java 數據工廠
新建一個 Java 類，並把它命名為 ve.MyBooksDataSource，其內容如下： package ve;
import com.ibm.etools.xmlschema.beans.*;
public class MyBooksDataSource extends Factory {
public MyBooksDataSource() {
super();
}
public book[] getBooks() {
books iBooks = (books) loadDocument("books", getXMLFilename());
book[] result = new book[iBooks.getbookCount()];
for (int i = 0; i < iBooks.getbookCount(); i++) {
result[i] = iBooks.getBook(i);
}
return result;
}
public BaseType loadDocument(String className, String filename) {
return super.loadDocument(className, filename);
}
}
如果我們現在運行 MyBooks 應用程序，會發現應用程序還沒有數據內容，因 為所有的 Swing 組件都尚未和數據綁定。在接下來的這一部分，我們將把數據 綁定到可視化組件。
B 部分：使用可視化編輯器綁定 MyBooks 用戶界面
我們繼續以自頂向下的方式來構建 GUI，各個組件已經被放置好。一旦看上 去沒什麼缺陷，我們現在可以提供邏輯，使組件可以訪問並更新數據。現在，我 們將可視化組件與對應的數據綁定起來。
打開 JFrame
在 Application Developer 中，選擇 File => Import。
選擇 Existing Project into Workspace，然後按下 Next 按鈕。
選擇之前已創建的 MyBooks 項目，然後按下 Finish 按鈕。
在可視化編輯器中打開 ve.rad.MyBooksApp。
綁定文本域
選擇 textfield，這時，在 textfield 的左上方會出現一個 Bind... 選項 。
選擇 Bind...，會打開一個對話框，該對話框可以讓您指定如何綁定到數據 的細節。
在 Field Data Bindings 窗口中，選擇 New Data Source Data Object... 。
在 New Data Source Data Object 窗口中，選擇 Java Bean Factory 作為 source type。
選擇 Data source 下拉框後面的 New...。
在 Choose a Bean 窗口中，搜索並選擇 ve.MyBooksDataSource。然後按下 OK 按鈕以添加該數據源。
在 Source service 文本框中，選擇 getXMLFilename() ，這是數據源虛包 MyBooksDataSource.java 中一個方法的名稱。
在 Name 文本域中，將 stringObject 改為 xmlFilename，然後按下 OK 按 鈕。
再次按下 OK 按鈕。
綁定表格
選擇表格，在表格的左上方會出現一個 Bind... 選項
選擇 Bind...。
在 Table Data Bindings 窗口中，選擇 New Data Source Data Object... 。
在 New Data Source Data Object 窗口中，只出現一個 source service 方 法 getBooks()，這是返回數組數據的唯一方法，這些數據可以在表格中使用。 按下 OK 按鈕，這時我們就選用了 getBooks() 方法。
將數據對象屬性 author、copyrightDate及 title 添加到表格的列清單中。
按下 OK 按鈕。
在可視化編輯器中，選擇非可視 bean MyBooksDataSource，打開或激活 Properties 視圖。
展開屬性 dataSource。
將屬性 encoding 設為 UTF-8 ，然後按下 Enter 按鈕。
將屬性 encodingTab 設為 UTF-8 ，然後按下 Enter按鈕。
將屬性 packageName 設為 ve，然後按下 Enter 按鈕。
將屬性 xmlFilename 設為 filename ，並按下 Enter. 按鈕，然後在代碼編 輯器中修改生成的代碼， 將
myBooksDataSource1.setXMLFilename("filename");
改為：
myBooksDataSource3.setXMLFilename(filename);.
綁定按鈕
選擇按鈕，在按鈕的左上方會出現一個Bind...選項
選擇 Bind... .
在 Component Action Bindings 窗口中，選擇 source service 文本框裡的 save(java.lang.String)。
在 Argument 下拉列表框中，選擇 xmlFilename
按下 OK 按鈕。
保存文件。
現在，MyBooks 應用程序已完成，圖 6 顯示的是該程序的屏幕截圖。
圖 6：已完成的 MyBooks 應用程序
測試應用程序
為了測試您的應用程序，您需要在運行配置中提供 XML 文件名作為參數：
在工具條上，選擇 Run 圖標旁的箭頭，並選擇 Run...
在 Run 窗口中，選擇 Java Application 作 為啟動程序。
按下 New，在窗口中會彈出一個新的運行配置框，Main 選項卡中，填入您的項目名 MyBooks 和應用程序名 ve.rad.MyBooksApp。
選擇 Arguments 選項卡，輸入 XML 文件名的全路徑，當應用程序啟動時，在 Arguments 選項卡中填寫的程序參數將被傳遞給 main(String[] args) 方法，這就是該應用程序獲得參數值的方法。
選擇 Run。
更改 XML 文件名。
按下 Save 按鈕。檢查表格的內容是否被保存到指定的文件和位置。
關閉 MyBooksApp。
C 部分： 使用 Eclipse 可視化編輯器綁定 MyBooks 用戶界面（可選）
本部分是可選擇，因為它描述的是使用 Eclipse 可視化編輯器（它沒有數據綁定工具）來綁定第一部分中創建的用戶界面，本部分的目的是與 Application Developer 提供的綁定工具進 行對比，從而凸顯使用數據綁定工具的優勢。
為了使用 Eclipse 可視化編輯器，我們需要以下組件（這些組件可以從 Eclipse 可視化編輯器項目中下載）:
Eclipse build eclipse-SDK 3.0.1
Visual Editor 1.0.2
EMF build 2.0.1
GEF build 3.0.1
創建表格模型
為了在運行時顯示表格，你必須為表格模型提供實際數據，然後將表格模型和 JTable bean 相關聯。表格模 型提供了多種可以被 JTable bean 調用的方法，利用這些方法，JTable bean 就能獲取一些信息，如表格的行數和列數，或者是用在特定表格單元的數據。您需要在表格模型類中實現這些方 法，這樣，JTable bean 就可以訪問模型中的數據，並在表格視圖中顯示出來。
下面，我們新建一個 JAVA 類，並命名為 ve.eclipse.MyBooksTableModel。用下面的代碼代替所生成的文件的內容：
package ve.eclipse;
import javax.swing.table.AbstractTableModel;
import ve.*;
public class MyBooksTableModel extends AbstractTableModel {
private MyBooksDataSource iBooksFactory;
private books iBooks;
public MyBooksTableModel() {
super();
}
public MyBooksTableModel(String xmlFile) {
super();
iBooksFactory = new MyBooksDataSource();
iBooksFactory.setPackageName("ve");
iBooksFactory.setEncoding("UTF8");
iBooksFactory.setEncodingTag("UTF-8");
iBooks = (books) iBooksFactory.loadDocument("books", xmlFile);
}
public String getXMLFile() {
return iBooksFactory.getXMLFilename();
}
public void setXMLFile(String filename) {
iBooksFactory.setXMLFilename(filename);
}
public void save(String fname) {
iBooksFactory.save(fname);
}
public int getColumnCount() {
return 3;
}
public int getRowCount() {
return iBooks.getbookCount();
}
public Object getValueAt(int rowIndex, int columnIndex) {
switch (columnIndex) {
case 0: return iBooks.getBook(rowIndex).getTitle();
case 1: return iBooks.getBook(rowIndex).getAuthor();
case 2: return iBooks.getBook(rowIndex).getCopyrightDate();
}
return null;
}
public String getColumnName(int arg0) {
switch (arg0) {
case 0: return "Title";
case 1: return "Author";
case 2: return "Copyright Date";
}
return "";
}
}
綁定表格 table
a.在可視化編輯器中打開 ve.eclipse.MyBooksApp.java。
b.從選項板中選擇 Choose Bean ，會彈出 Choose a Bean 對話框。
c.找到 ve.eclipse.MyBooksTableModel，並按下 OK 按鈕。
d.把非可視 bean 放到可視化編輯器中，注意不要和 JFrame 重疊，這一操作將生成 getMyBooksTableModel()。
e.修改 getMyBooksTableModel()，使其如下所示：
private MyBooksTableModel getMyBooksTableModel() {
if (myBooksTableModel == null) {
myBooksTableModel = new MyBooksTableModel(filename);
}
return myBooksTableModel;
}
f.在 Java Beans 視圖中，選擇 table。
g.修改 getJTable()，使其如下所示：
private JTable getJTable() {
if (jTable == null) {
jTable = new JTable();
jTable.setModel(getMyBooksTableModel());
}
return jTable;
}
綁定文本域
a.在 Java Beans 視圖中選擇 text field。
b.修改 getJTextField()，使其如下所示：
private JTextField getJTextField() {
if (jTextField == null) {
jTextField = new JTextField();
jTextField.setText(filename);
}
return jTextField;
}
綁定按鈕 button
a.右鍵單擊 SAVE 按鈕，並選擇 Events => actionPerformed.
b.修改 getJButton()，如下所示：
private JButton getJButton() {
if (jButton == null) {
jButton = new JButton();
jButton.setText("SAVE");
jButton.addActionListener(new java.awt.event.ActionListener() {
public void actionPerformed(java.awt.event.ActionEvent e) {
getMyBooksTableModel().save(getJTextField().getText());
}
});
}
return jButton;
}
c.保存文件。
5.測試應用程序
為了測試您的應用程序，您需要在運行配置中提供 XML 文件名作為參數：
a.在工具條上，選擇 Run 圖標旁的箭頭，然後選擇 Run...
b.在 Run 窗口中，選擇 Java Application 作為啟動程序。
c.按下 New 按鈕，在窗口中會彈出一個運行配置框，然後在 Main 選項卡中，填寫項目名 MyBooks，及應用程序名 ve.eclipse.MyBooksApp。
d.選擇 Arguments 選項卡，輸入 XML 文件名的全路徑，當應用程序啟動時，在 Arguments 選項卡中輸入的程序參數將被傳遞給 main(String[] args) 方法， 這就是該應用程序獲得參數值的方法。
e.選擇 Run。
f.更改 XML 文件名。
g.按下 Save 按鈕。檢查表格內容是否被保存到指定的文件和位置。
h.關閉 MyBooksApp。
這個練習 的可選部分也完成了。你會注意到，許多步驟都需要手工編寫代碼將數據綁定到用戶界面，尤其是表格模型。相比之下，Application Developer 的可視化編輯器提供了非常簡便的用戶界面 ，利用它，絕大部分代碼都可以自動生成。
結束語
Application Developer Visual Editor 為我們提供了很多易於使用的工具。利用它，只需對生成的代碼作小小的改動，即可綁定 Swing 可視化組件，如文本域、表格、按鈕。使用文檔模型可以自動設置文本域中的文本；且表格模型也是自動生成並被添加到表格組件中；操作被自動設置到按鈕中。相比之下，用 Eclipse 完成同樣的任務，則需要更多的手工處理。您必須創建自己的表格模型，並編寫相關原代碼，設置文本域中的文本，為按鈕添加操作監聽器，並在表格上設置表格模型。現在， Application Developer 的價值已經很清晰了；您可以馬上用它來簡化 J2EE 應用程序的開發。
