基于ＸＭＬ的界面感觀設(shè)計(jì)

[摘要] 一個(gè)應(yīng)用軟件良好的可用性取決于軟件的外觀和行為，即觀感。而用java的傳統(tǒng)方法去設(shè)計(jì)一個(gè)觀感不僅技術(shù)復(fù)雜，而且外觀不友好。利用XML語(yǔ)言，在java的synth類的基礎(chǔ)上去設(shè)計(jì)一個(gè)觀感，則不僅可以使任務(wù)大大簡(jiǎn)化，而且界面美觀。在jdk1.5以上的平臺(tái)上進(jìn)行測(cè)試，結(jié)果運(yùn)行良好。

[關(guān)鍵詞] XML 觀感 synth類

一、引言

一個(gè)應(yīng)用軟件的良好的可用性取決于軟件的外觀和行為，即觀感。一致的觀感不僅有助于用戶快速的和高效的掌握應(yīng)用軟件的使用，而且有助于用戶觸類旁通。

一個(gè)具有良好界面感觀設(shè)計(jì)的應(yīng)用軟件應(yīng)體現(xiàn)在以下幾個(gè)方面:

1.邏輯組織。軟件的感觀設(shè)計(jì)應(yīng)與用戶欲完成的任務(wù)在邏輯上一致。

2.可伸縮性。窗口應(yīng)是可伸縮的，以便用戶在窗口中能夠找到所需的內(nèi)容。

3.可預(yù)見(jiàn)性。使用戶依據(jù)經(jīng)驗(yàn)即可預(yù)見(jiàn)組件的功能。

4.響應(yīng)性。組件的響應(yīng)應(yīng)迅速快捷，在用戶的容忍范圍之內(nèi)。

若要達(dá)到上述目標(biāo)，在Java中，使用Swing UI進(jìn)行代碼編寫和文檔編制是十分困難的，常常是亂雜一氣，缺乏規(guī)劃。為了創(chuàng)建良好感觀，開(kāi)發(fā)人員需要繼承Metal感觀觀的39個(gè)類，或者繼承Basic感觀的60個(gè)類。本文在討論XML和Java技術(shù)的基礎(chǔ)上，提出了一種界面感觀方案設(shè)計(jì)，可使開(kāi)發(fā)人員的任務(wù)的復(fù)雜程度大大降低。

二、傳統(tǒng)的Java界面感觀設(shè)計(jì)

在Java中，Swing程序在缺省情況下使用Metal觀感，可以采用兩種方式來(lái)設(shè)計(jì)觀感。第一種方式是在Java安裝的子目錄jre/lib下有一個(gè)文件swing.properties。在這個(gè)文件中，將屬性swing.defaultlaf設(shè)置為所希望的觀感類名。例如，

Swing.defaultlaf=com.sun..java.swing.plaf.motif.MotifLookAndFeel

第二種方式需要調(diào)用靜態(tài)的UIManager.setLookAndFeel方法，并提供所想要的觀感類名，然后再調(diào)用靜態(tài)方法SwingUtilities.updateComponentTreeUI來(lái)刷新全部的組件集。這里需要向這個(gè)方法提供一個(gè)組件，并由此找到其他的所有組件。例如，

String plaf = \"com.sun.java.swing.plaf.motif.MotifLookAndFeel\";

try{

UIManager.setLookAndFeel(plaf);

SwingUtilities.updateComponentTreeUI(panel);

}catch(Exception e) { e.printStackTrace(); }

在Java中，默認(rèn)提供了Metal觀感、Motif觀感和Windows觀感三種。這三種形式風(fēng)格比較單一，缺乏個(gè)性化，設(shè)計(jì)不靈活。下面采取一種新的方法來(lái)設(shè)計(jì)界面感觀。

三、基于XML的界面感觀設(shè)計(jì)

1.XML基礎(chǔ)

在Java中，可以把對(duì)外觀的所有描述從代碼中分離出來(lái)，將其放入外部的XML文件和圖像文件中，讓開(kāi)發(fā)人員不必編寫任何代碼就可以創(chuàng)建新的外觀。從而減輕開(kāi)發(fā)人員的負(fù)擔(dān)，提高工作效率。

應(yīng)用XML文件創(chuàng)建感觀的步驟如下:

（1）應(yīng)用

(2)應(yīng)用標(biāo)簽將組件風(fēng)格與組件關(guān)聯(lián)。例如，

要注意的是： 標(biāo)簽中的 key 屬性映射到 javax.swing.plaf.synth.Region 類中的常量。

2.XML文件加載

在Java中，XML文件的加載需要使用synth引擎，即javax.swing.plaf.synth類。Synth 是一個(gè)白板外觀，是一塊完全空白的畫(huà)布，表現(xiàn)為一個(gè)完全空白的面板，只有在 XML 文件中定義了組件風(fēng)格時(shí)，它才會(huì)顯示組件。XML文件加載的方式如下，

（1）為感觀的定義提供基礎(chǔ)。

SynthLookAndFeel synth = new SynthLookAndFeel();

（2）加載XML文件。

synth.load(Demo.class.getResourceAsStream(\"demo.xml\")， Demo.class);

（3）應(yīng)用新的感觀。

UIManager.setLookAndFeel(synth);

3.XML文件舉例

(1)設(shè)置字體和顏色。①設(shè)置顏色。color標(biāo)簽本身需要value和type兩個(gè)屬性。

value可以是 java.awt.Color 包中的任何常量。可以采用字符串的形式表示，例如 RED、BLUE；也可以采用顏色的十六進(jìn)制表示，例如 #669966。

type描述文件設(shè)置哪個(gè)區(qū)域的顏色，其值有 BACKGROUND、FOREGROUND、TEXT_FOREGROUND、TEXT_BACKGROUND 和 FOCUS。

②設(shè)置字體。font 標(biāo)簽有兩個(gè)基本屬性和一個(gè)可選屬性。這三個(gè)屬性直接映射到 java.awt.Font 類中的三個(gè)參數(shù)，name，size和style。

Name是字體的名稱，其值是用戶計(jì)算機(jī)上所安裝的字體庫(kù)，例如，Verdana、Arial等。

size 是字體大小，以像素為單位。

Style它的值為 BOLD ，ITALIC和BOLD ITALIC。

(2)應(yīng)用圖像。可以使用圖像來(lái)創(chuàng)建諸如文本域、按鈕等控件的邊框。圖像被9個(gè)區(qū)，它們分別是頂部、右上、右部、右下、底部、左下、左部、左上和中間，如圖所示。

圖 圖像分區(qū)

在這些分區(qū)中，左部和右部可以上下拉伸，頂部和底部可以左右拉伸，其余部分固定不變。在XML文件中由imagePainter 標(biāo)簽來(lái)設(shè)定。它有以下幾個(gè)屬性。

path 屬性提供所使用的圖像的路徑。

sourceInsets 屬性按像素計(jì)算依次映射到頂部的高度、左部的寬度、底部的高度和右部的寬度。

method 屬性直接映射到 javax.swing.plaf.synth.SynthPainter 類中的一個(gè)函數(shù)。每個(gè)函數(shù)映射到一個(gè) Swing 組件中某個(gè)特定的繪畫(huà)任務(wù)。

paintCenter屬性允許保留或者舍棄圖像的中間區(qū)域。

(3)XML文件舉例。應(yīng)用以上信息來(lái)設(shè)計(jì)一個(gè)文本域（textfield）的感觀設(shè)計(jì)，代碼如下。

四、結(jié)束語(yǔ)

本文討論了在XML文件的基礎(chǔ)上，利用Java技術(shù)進(jìn)行界面感觀設(shè)計(jì)。應(yīng)用XML可以將界面感觀設(shè)計(jì)從編寫大量的Java代碼的工作中分離出來(lái)。從而，減輕技術(shù)開(kāi)發(fā)人員的負(fù)擔(dān)，提高工作效率。此外，使用這種方法可以使技術(shù)開(kāi)發(fā)人員不必具有較高的藝術(shù)才能和繪圖本領(lǐng)。

以上程序是在jdk5.0以上平臺(tái)測(cè)試完成的，并取得了較好的感觀效果。本文只對(duì)標(biāo)簽和文本域等組件進(jìn)行了設(shè)計(jì)，下一步研究的重點(diǎn)是對(duì)一些復(fù)雜的組件進(jìn)行設(shè)計(jì)。

參考文獻(xiàn)：

[1]Sun Microsystems，Java Look and Feel Design Guidelines: Advanced Topics[M].addison Wesley，2001

[2] Cay S. Horstman，Core Java 2 Volume I Fundamentals: 8th Edition[M]，2007，334～335

[3]Java documents， Modifying the Look and Feel[OL]. http://java.sun.com/docs/books/tutorial/uiswing/examples/lookandfeel/index.html

[4 ]Michael Abernethy， Advanced Synth[OL]. http://www.ibm.com/developerworks/java/library/j-synth/

[5] Java documents[OL]. http://java.sun.com/j2se/1.5.0/docs/api/javax/swing/plaf/synth/package-summary.html

[6] Scott Violet， The Synth Look and Feel[OL].http://www.javadesktop.org/articles/synth/index.html