第 14 章 圖形介面 Swing

1. 第14章　圖形介面Swing Java 2 程式設計入門與應用

2. 目錄 • 14-1Swing的簡介 • 14-2Swing的視窗元件 • 14-3Swing的繪圖與選擇視窗 • 溫故知新 • 自我突破習題

3. 14-1　Swing的簡介 • 14-1.1 Swing的架構 • 14-1.2 JComponent類別的函式

4. 前言： • 由於AWT在不同平台下執行有問題，而且缺乏一些基礎的元件來設計較複雜的圖形使用者介面，因此衍生出Java 基礎類別（Java Foundation Classes，簡稱JFC）取代並包含AWT，主要的部分稱為「Swing」。

5. 14-1.1Swing的架構 • 因為Swing是繼承自AWT，所以其元件仍然保有原本AWT元件的功能，為了區分Swing元件與AWT元件的名稱，在每一種Swing元件的前面都加上一個大寫字母“J”，例如：JFrame、JButton、JLabel、JList、JCheckbox、JMenuBar等元件。

6. Swing的繼承圖： • Swing套件的相關元件皆定義在javax.swing類別庫中，其中大部分的元件都是JComponent的子類別，下面為Swing的繼承圖：

7. 下面為Swing繼承圖的說明： • 從上面的繼承圖可以得知，Swing的元件都是繼承自AWT的Container類別，所以仍然可使用AWT元件的成員、版面配置、傾聽者類別、轉接器類別與事件函式。 • 在本章只介紹Swing元件新增的功能，繼承自AWT的函式請參考第13章。

8. Swing視窗元件常見的事件處理類別整理如下：

9. 下表兩種事件是Swing類別所新增的： • 上面的事件處理類別幾乎都是第13章介紹過的，所以用法相同，只有下面兩種事件是Swing類別所新增的，這兩種事件類別都只有傾聽者，沒有轉接器可以使用： • 在程式中處理上面兩種事件時，必須要載入javax.swing.event，才可以執行程式。

10. 14-1.2JComponent類別的函式 • 利用JComponent類別的函式可以設定子物件的許多屬性，例如：背景顏色、邊框樣式、字型與提示文字等。

11. 下面是JComponent類別常見的函式：

12. 下面是Swing套件的BorderFactory類別中建立Border物件的函式：下面是Swing套件的BorderFactory類別中建立Border物件的函式： • 上面函式中出現的Border物件，可以利用Swing套件的BorderFactory類別來建立，下面是該類別中建立Border物件的函式：

13. 例如下面的程式碼，建立一個邊框樣式為凸起的按鈕：例如下面的程式碼，建立一個邊框樣式為凸起的按鈕：

14. 14-2Swing的視窗元件 • 14-2.1　視窗元件JFrame • 14-2.2　基本元件與文字元件 • 14-2.3　選擇元件 • 14-2.4　捲軸元件與滑動軸元件 • 14-2.5　對話方塊元件 • 14-2.6　功能表選單與工具列元件

15. 前言： • Swing元件的用法與AWT大同小異，差別在於利用Swing撰寫的視窗程式外觀與AWT的不同，除了視窗預設背景顏色為淺灰色，視窗中的元件外觀也會顯得較柔和化。

16. 14-2.1　視窗元件JFrame • 下面是JFrame類別常見的函式：

17. 例如下面的程式碼：

19. 上述程式碼分析如下： • 第8行建立圖片物件img，然後在第9行設定視窗標題的圖示為img，則執行程式後，視窗左上角的圖示會從預設的 變成 。 • 在AWT中必須處理WindowEvent事件函式，才可以點選視窗右上角的 關閉鈕關閉視窗。而Swing只要利用setDefaultCloseOperation函式就可以將視窗關閉，並釋放視窗的記憶體空間（第10行）。

20. 完成後，執行程式的畫面顯示如下：

21. 14-2.2　基本元件與文字元件 • 在視窗程式中常用的基本元件，不外乎就是按鈕元件JButton與標籤元件JLabel，以及JTextField、JPasswordField與JTextArea等文字元件。

22. 下面是基本類別常見的函式-1：

23. 下面是基本類別常見的函式-2：

24. 下面是基本類別常見的函式-3：

25. 下面是基本類別常見的函式-4：

26. 下面是基本類別常見的函式-5：

27. 下面是基本類別常見的函式-6： • 上述函式中，若要設定文字區域元件JTextArea顯示捲軸，必須建立一個捲軸元件JScrollPane，然後設定捲軸內容為JTextArea元件，其語法如下：

29. 將元件加入Swing視窗的步驟： • AWT可以直接在Frame視窗中加入元件，但Swing必須先利用JFrame類別的getContentPane函式建立一個Container容器，然後將元件加入Container容器中。

30. 將元件加入Swing視窗的步驟可以分為下面四個部分：將元件加入Swing視窗的步驟可以分為下面四個部分： • 載入AWT與Swing類別庫：因為Container類別定義在AWT套件中，所以撰寫程式碼時必須同時載入java.awt類別庫與javax.swing類別庫，才能夠執行成功。 • 建立JFrame視窗物件。 • 取得視窗的ContentPane物件：取得JFrame視窗物件的ContentPane物件，建立一個Container容器。 • 利用add函式將元件加入Container容器中：利用add函式依序將元件加入3.建立的Container容器中。

31. 例如下面的程式碼：

34. 上述程式碼分析如下： • 第7行利用getContentPane函式取得視窗f的ContentPane物件，Swing視窗的元件必須要加入這個容器中才可以顯示出來。 • 第9行建立JButton物件b1，並在參數中傳遞一個ImageIcon物件，表示按鈕上顯示圖片ch14_02_02.gif。 • 第17行建立JScrollPane物件，並同時指定捲軸物件的內容是文字區域t3。因為捲軸物件已經包含文字區域，所以直接設定捲軸物件的位置與大小，然後將捲軸物件加入ContentPane物件就可以了，文字區域的大小會隨著捲軸物件而自動調整。 • 第22、24與33行分別設定按鈕b1、b2與文字區域t3的邊框樣式。 • 第34行利用setLineWrap函式設定輸入文字區域的資料會自動換行，則輸入資料時，只會顯示垂直捲軸，而不會顯示水平捲軸。 • 第46~51行做事件處理，當點選 鈕後，會在文字區域t3顯示文字。

35. 完成後，畫面顯示如下： • 完成後執行程式，發現在JFrame中，元件的座標位置也是從視窗的左上角開始計算，但是沒有包含視窗標題列的高度與邊框的寬度，畫面顯示如下：

36. 14-2.3　選擇元件 • JCheckBox與JRadioButton元件是在設計視窗程式時，最常用於選擇題的選項設計，以供使用者選擇；JList是可以從清單中選擇一個或多個資料的元件，而JComboBox則是只能選擇一種資料的下拉式選單。

37. 下面是選擇類別常見的函式-1：

38. 下面是選擇類別常見的函式-2：

39. 下面是選擇類別常見的函式-3：

40. 下面是選擇類別常見的函式-4：

41. 下面是選擇類別常見的函式-5：

42. 下面是選擇類別常見的函式-6：

43. 下面是選擇類別常見的函式-7：

44. 例如下面的程式碼：

47. 上述程式碼分析如下： • 第17行宣告字串陣列s中有4筆資料，然後在第19行建立清單方塊時，設定清單方塊的選項為字串陣列s的元素。 • 第23~26行新增4個項目到下拉式選單combo中。 • 第29與30行建立一個按鈕群組group，然後將單選的選項按鈕r1與r2加入該按鈕群組，這樣這兩個選項按鈕一次只能選取一個。 • 第32行設定清單方塊為單選模式，第33與34行設定當選取清單方塊的選項時，選項的背景顏色為粉紅色，字體顏色為藍色。 • 第36行設定清單方塊的寬度固定為100。 • 第48~53行做事件處理，當清單方塊上的選擇選項改變時，就會在標籤上顯示文字，因為ListSelectionEvent屬於Swing類別的事件處理，所以必須在第3行載入javax.swing.event。

48. 完成後，執行程式的畫面顯示如下：