【正文】 ............................................... 10 ５ . LnFListener ............................................................................................. 10 五 程序運行情況說明 .............................................................................................. 10 六 小結(jié) .......................................................................................................................11 致謝 .............................................................................................................................. 12 參考文獻 ...................................................................................................................... 12 附錄 .............................................................................................................................. 12 1 基于 Java 的圖形用戶界面設(shè)計 摘 要 本文討論了基于 Java 的圖形用戶界面設(shè)計。對圖形用戶界面、 Swing 作了簡單的介紹，給出了一個圖像瀏覽器用 Java 語言實現(xiàn)的詳細(xì)設(shè)計過程。運行和程序測試結(jié)果表明：這個瀏覽器運行良好，能打開 gif、 jpg、png 格式的文件，完成前一張、后一張、放大、縮小等常用操作。用戶界面是計算機的使用者－用戶與計算機系統(tǒng)交互的接口，用戶界面功能是否完善，使用是否方便，將直接影響到用戶對應(yīng)用軟件的使用。圖形用戶界面畫面生動、操作簡便，省去了字符界面用戶必須記憶各種命令的麻煩，深受廣大用戶的喜愛和歡迎，已經(jīng)成為目前幾乎所有應(yīng)用軟件的既成標(biāo)準(zhǔn)。 Java 語言中，為了方便圖形用戶界面的開發(fā)，設(shè)計了專門的 類庫來生成各種標(biāo)準(zhǔn)圖形界面元素和處理圖形界面的各種事件。 Swing是 Sun Microsystems 建立的下一代 GUI工具包，它包含比 AWT 更多的圖形組件。除了新的組件之外， Swing 還對 AWT 做出了三個主要改進 [2]，它們是輕型組件、可插拔的外觀風(fēng)格和采用MVC 模式，這使得 Swing 在 GUI 的設(shè) 計上表現(xiàn)更為靈活。 二 圖形用戶界面 圖形用戶界面（ＧＵＩ）已成為用戶界面的首選。那么，好的圖形用戶界面能帶來怎樣的好處呢？怎樣的界面才是出色的呢？下面，我們就來對這兩方面作一個簡單的介紹。也許一個軟件具有很強大的功能，但如果其界面不能使用戶與系統(tǒng)間有良好、通暢的溝通，那么那些強大的功能也很難較好地發(fā)揮它的效用。一個連貫的具有清晰的視覺表達效果的圖形界面 (GUI)，不僅能給用戶帶來正面的情緒反應(yīng)，甚至能在一定程度上幫助用戶去發(fā)現(xiàn)和理解軟件的功能，戲劇般地提高其可用性。最重要的是，好的圖形用戶界面是憑直覺去使用的，直覺對于有目的的用戶意味著容易理解。做到這點并不容易，這種界面用起來方便，設(shè)計起來卻很困難。 １．為用戶設(shè)計 設(shè)計者不是用戶，他需要設(shè)計出自己的界面來迎合用戶的期望和精神模式，所以弄清楚誰是自己的用戶是非常重要的。又如一個圖標(biāo)設(shè)計成何種形象，才會使用戶一看便知那是什么功能。如一般軟件中的剪切功能以“剪刀”形象標(biāo)明，“ ctrl+X”為快捷鍵，自己設(shè)計時就不要弄成“錘子”和“ Ctrl+T”。在界面的色彩、布局和圖標(biāo)的精致等方面要有所考究。 作為最一般的 規(guī)則，當(dāng)一個操作超過 7～ 10 秒的時候（時間的長短要根據(jù)用戶類型和應(yīng)用程序的特點來調(diào)整），大多數(shù)用戶希望看到一個帶有進度條的消息對話框。 尤其是在需要警告用戶一個嚴(yán)重問題產(chǎn)生的地方，聲音反饋是有用的。 ③ 提供鍵盤支持。加速鍵應(yīng)該易于使用并限制在一到兩個鍵（如 F3 或者 Ctrl+P）。不過， Swing 實際上不只這些，它允許使用 Java 語言進行企業(yè)級開發(fā)。那么，為了能較好地發(fā)揮 Swing的優(yōu)勢來為自己的 Java 應(yīng)用程序增色，首先就要對 Swing有一個總體的認(rèn)識。 這種特性叫做“可插拔外觀風(fēng)格”（ Pluggable LookandFeel，或簡稱 PLAF） 。此外， Swing允許用戶在運行時轉(zhuǎn)換外觀風(fēng)格，而不必關(guān)閉應(yīng)用程序。并且，用戶甚至可以為每一個 Swing組件建立自己的外觀風(fēng)格。在最完美的情況下，這意味著這些組件并不依賴本地對等組件來繪制自己。只有少數(shù)頂層容器不是輕型的（如 JFrame和 JWindow）。此外， Swing組件的設(shè)計支持對組件行為進行隨意修改。 ３．如何使 用 Swing 不是人人都為了同一個原因而使用 Swing。以下是一些可能的用途： ①在打算建立自己的企業(yè)級應(yīng)用程序時使用 Swing組件。在這時，使用 Swing組件類似于使用 AWT組件。如果擅長使用 AWT組件進行編程，只需要瀏覽對每個組件的粗略介紹，就可以開始使用了。 ②建立自定義 Swing組件――或者擴展已經(jīng)存在的組件。這時一定要了解Swing體系結(jié)構(gòu)、事件和較低級別的類。 ③為一個或者多個 Swing組件覆蓋或者建立一個新的外觀風(fēng)格。這是可以使用的３種 方法中最復(fù)雜的一種方法，它要求全面了解每個組件的設(shè)計、體系結(jié)構(gòu)基本原理和圖 4 形基本元素。 （二） Swing程序包和類 Swing 庫中的程序包很多，只在此大致介紹在后面的圖像瀏覽器的實現(xiàn)中用到的程序包。以下給出了這些程序包的簡短描述。 包含核心 Swing組件，其中包括絕大多數(shù)模型接口和支持類。邊框不是組件，它們是特殊的圖形元素， Swing將它們作為屬性對待，并將它們放置在組件周圍，用它們來代替鑲邊。 定義了幾個 Swing 組件 用來在類之間傳達異步信息的新的監(jiān)聽器和事件。 包含對 JFileChooser 組件的支持。其各種子程序包被用來在平臺到平臺基礎(chǔ)上為每個組件繪制單獨的外觀風(fēng)格。 定義了用于分層的樹形組件的模型和視圖，這種組件可以表現(xiàn)文件結(jié)構(gòu)，或者表現(xiàn)一個事物具有一系列屬性 。實質(zhì)上，MVC將 GUI組件拆分成三個元素。 １．模型 模型包括每個組件的狀態(tài)數(shù)據(jù)。例如，滾動條組件的模型可能包含有關(guān)可調(diào)整“滑尺 ”當(dāng)前位置、最大值、最小值和滑尺寬度（與值的范圍有關(guān)）的信息。不論組件在屏幕上是如何被描繪的，這些信息總是相同的，模型數(shù)據(jù)總是獨立于組件的可視表示?？梢詤⒁妰蓚€不同 GUI 平臺上的一個應(yīng)用程序窗口，這是顯示視圖如何不同的一個好例子。不過，標(biāo)題欄的左邊可能有一個關(guān)閉框（類似于 Mac OS平臺），或者可能在標(biāo)題欄的右邊有一個關(guān)閉框（與 Windows 平臺中的類 似）。事件的形式有很多種，例如，鼠標(biāo)單擊、獲得或者失去焦點、觸發(fā)特定菜單命令的鍵盤事件，甚至是重新繪制某一表示類 實線 表示繼承關(guān)系 表示抽象類 說明 ： 6 部分屏幕的指示。 圖２ 通過 MVC體系結(jié)構(gòu)進行通信 Swing通常使用一個叫做模型代理 (modeldelegate)的 MVC設(shè)計的簡化變體。模型負(fù)責(zé)維護有關(guān)組件狀態(tài)的信息。模型與 UI代理之間的通信是雙向的。 ②通過樹形結(jié)構(gòu)，查看圖像文件，并可選擇，打開。 ④對打開的所有圖像窗口，可同時全部關(guān)閉。 ⑥能進 行對圖像的放大縮小操作。 ⑧能選擇用戶界面的外觀。 ② 配置環(huán)境變量。在“用戶變量” “新建” ,變量名中輸入： include，變量值中輸入： d:\ \include。然后確定。 （二） 界面結(jié)構(gòu)設(shè)計 歡迎屏幕出現(xiàn)３秒后，顯示用戶界面，大致布局如下： 圖４ 界面結(jié)構(gòu)圖 １． 操作區(qū) 接收用戶的大部分操作命令。 ２． 樹形查看區(qū) 以樹的形式查看文件，有打開文件的操作。 ４． 圖像窗口 沒有任何操作，當(dāng)有打開圖像文件的命令時，在圖像瀏覽區(qū)新建一個圖像窗口，顯示圖像。自定義類 JSplashWindow，它作為標(biāo)準(zhǔn)組件 JWindow的子類。 主界面由主類 JImageViewer 實現(xiàn)，繼承 JFrame，實現(xiàn) ActionListener 接口，對界面中簡單的“退出”（退出程序）、“關(guān)于”命令作出響應(yīng)。其中有一菜單實現(xiàn)用戶界 ②樹形 查看區(qū) ③圖像瀏覽區(qū) ①操作區(qū) ④圖像窗口 8 面的外觀風(fēng)格的切換，只能有一種外觀風(fēng)格被選擇，因此使用 JRadioButtonMenuItem 和ButtonGroup。 在工具欄上，用戶能通過按鈕完成常用的操作。 主界面除操作區(qū)的以下部分，為了使界面更加靈活，使用了 JSplitPane，這樣樹形查看區(qū)就可以被收起，用戶就有更大的圖像瀏覽區(qū)。圖 像瀏覽 區(qū)使用JDesktopPane，在其實例的最底層加入了 JLabel的一個只帶圖標(biāo)的對象，作為圖像瀏覽區(qū)的背景。因為該窗口是用來打開圖像文件的，所以此自定義類中用到了 JScrollPane、 File、 Image。“關(guān) 于”對話 框的彈出 直接用()方法完成。它們分別是 : 主類 JImageViewer、JToolBarPanel、 JFancyButton、 JSplashWindow、 ExampleFileFilter、 TreeExplorer、JImageFrame、 ImageFilter 和 ExampleFileFilter。它們之間的關(guān)系如圖６所示： 圖６ 各模塊關(guān)系圖 說明 ：上圖中 A B 表示 類 A 使用類 B 其中主要模塊的功能及實現(xiàn)介紹如下（詳細(xì)代碼實現(xiàn)請見附錄）： １ . JImageViewer 建立用戶界面外觀， 使用監(jiān)聽器 LnFListener 響應(yīng)用戶對界面外觀的選擇，實現(xiàn)ActionListener 接口，對“退出”、“關(guān)于”操作作出響應(yīng)。 ２ . JImageFrame 顯示圖像，繼承 JInternalFrame，其結(jié)構(gòu)如下： 屬性： Image image。 //當(dāng)前圖像文件 JScrollPane jsp。 //只含圖標(biāo)，顯示圖片 方法： public void setImage(File f) //更新當(dāng)前圖片為圖片文件 f public File getImage() //得到當(dāng)前圖片，并返回 public void scaleImage(double p) //按照參數(shù) p的比例更改圖片大小 public void reLoad() //重新加載當(dāng)前圖片文件 ３ . TreeExplorer 一個瀏覽面板，以樹的形式瀏覽磁盤上的圖像文件，繼承 JScrollPane。包含了一個 File成員對象，所有操作都是圍繞著這個 File對象來進行的。 ② MyRenderer: 繼承 TreeCellRenderer （ 渲 染 器 接 口 ） 的