第 13 章 圖形介面AWT

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

2. 目錄 • 13-1AWT的簡介 • 13-2AWT的視窗元件 • 13-3AWT的事件處理 • 13-4AWT的繪圖 • 溫故知新 • 自我突破習題

3. 13-1　AWT的簡介 • 13-1.1 AWT的架構 • 13-1.2 Component與Container類別的函式

4. 前言： • Java提供了許多圖形使用者介面（Graphical User Interface，簡稱GUI）的元件，可以設計讓使用者與應用程式互動的介面，虛擬視窗工具（Abstract Window Toolkit，簡稱AWT）就是Java最早用來處理視窗程式的類別。

5. 3-1.1AWT的架構 • AWT套件是處理視窗程式最基本的工具，雖然它提供了視窗、按鈕與其他元件，但是具有下列幾項缺點： • 當視窗中的元件比較多，或程式比較複雜時，就會出現執行速度慢與耗費較多記憶體的情況。 • AWT不支援跨平台，造成視窗程式在其他作業系統可能無法執行。 • AWT套件中的許多類別不是利用Java語言撰寫的，存在一些問題。 • 因此，Java後來以AWT為基礎，另外發展出Swing套件，關於Swing套件將在下一節介紹。

6. AWT套件的相關元件皆定義在java.awt類別庫中，下面為視窗應用類別的繼承圖：AWT套件的相關元件皆定義在java.awt類別庫中，下面為視窗應用類別的繼承圖： • 從上圖可以發現AWT套件的類別都是繼承自Object類別，而java.awt類別庫中的類別也具有繼承關係，每個子類別皆可以使用父類別中的資源，並且發現Swing套件的類別都是繼承自AWT套件的類別。

7. 13-1.2Component與Container類別的函式 • 因為AWT套件的元件幾乎是繼承自Component與Container類別，所以可以使用這兩個類別的成員函式。

8. 下面是Component類別常見的函式-1：

9. 下面是Component類別常見的函式-2：

10. 下面是Component類別常見的函式-3： • 上面函式中出現的Color與Font是java.awt類別庫的常用類別，關於這兩個類別的用法說明如下。

11. Color類別： • 建立Color物件的語法有下面兩種： • Color 物件名稱=new Color(數值R, 數值G, 數值B); • 語法中的數值範圍皆介於0~255之間，數值R表示紅色，數值G表示綠色，數值B表示藍色，例如：Color c=new Color(220,0,150)。而利用Color類別的getRed、getGreen與getBlue函式可以傳回Color物件的數值R、數值G與數值B。

12. 語法中的參數是Color類別中內建的常數值，共有下列幾種顏色：語法中的參數是Color類別中內建的常數值，共有下列幾種顏色： • Color 物件名稱=Color.常數; • 例如：Color c=Color.pink;。

13. Font類別： • 建立Font物件的語法為Font 物件名稱=new Font(String name, int style, int size);。 • name：字體名稱，必須是Java提供的字型。 • style：字型樣式（粗體、斜體或標準），利用Font常數來設定，有下列幾種樣式： • 如果要同時設定兩種樣式，可以將Font常數相加，例如：Font f=new Font("Arial", Font.BOLD +Font.ITALIC, 20);，表示粗斜體。 • size：字體大小。

14. Container類別的函式： • Container是指可以存放其他元件的容器，例如：將視窗看成一個容器，而視窗中可以存放許多像按鈕、標籤與文字方塊等元件。

15. 下面是Container類別常見的函式：

16. 13-2AWT的視窗元件 • 13-2.1　視窗元件Frame • 13-2.2　按鈕元件Button • 13-2.3　標籤元件Label • 13-2.4　文字元件TextField與TextArea • 13-2.5　版面配置元件 • 13-2.6　其他元件

17. 前言： • AWT套件所提供的視窗元件可以建立一般常見的應用程式視窗，利用這些元件的成員函式可以設計想要的視窗與樣式。

18. 13-2.1　視窗元件Frame • 利用Frame類別可以建立一個包含標題列與邊框的容器，也就是“視窗”，在視窗中可以加入按鈕與標籤等元件，除了繼承父類別的函式以外，Frame類別還有下面幾個常見的函式。

19. 下面是Frame類別常見的函式：

20. 例如下面的程式碼：

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

24. 13-2.2　按鈕元件Button • 利用Button類別可以建立按鈕元件，除了繼承父類別的函式以外，Button類別還有下面幾個常見的函式：

25. 例如建立一個按鈕元件，其程式碼如下：

26. 上述建立一個按鈕元件的程式碼說明如下： • 上述程式碼第7行利用setLayout函式將原本AWT預設的版面設定成null，取消該版面配置，如果不撰寫此行，則預設的版面配置會將最晚加入視窗的元件放到跟視窗一樣大，這樣就會蓋住原本視窗的設定。 • 第13行必須利用add函式將按鈕元件加入到視窗中，才會在視窗看見新建立的按鈕。

27. 完成後，畫面顯示如下： • 完成後執行程式，會發現在第12行設定的按鈕位置，表示按鈕左上角的座標會在距離視窗左上角(50,50)的位置，必須將視窗標題列的高度計算進去，畫面顯示如下：

28. 13-2.3　標籤元件Label • 利用Label類別可以建立標籤元件，除了繼承父類別的函式以外，Label類別還有下面幾個常見的函式：

29. 例如建立一個標籤元件，其程式碼如下：

30. 完成後，畫面顯示如下： • 完成後執行程式，會發現標籤的背景顏色與文字顏色分別為第9與11行設定的顏色，而且標籤中的文字會靠右對齊，畫面顯示如下：

31. 13-2.4　文字元件TextField與TextArea • 利用TextComponent類別衍生的TextField類別可以建立單行的文字方塊，而TextArea類別可以建立多行的文字方塊。 • 文字元件與Label元件不同之處在於，Label元件僅能以唯讀方式顯示文字，但是文字元件可以由使用者改變內容，其繼承圖如下所示：

32. TextComponent類別有下面幾個常見的函式：

33. TextField文字方塊： • TextField類別除了繼承父類別的函式以外，還有下面幾個常見的函式。

34. TextField類別有下面幾個常見的函式-1：

35. TextField類別有下面幾個常見的函式-2：

36. 上述TextField類別函式的說明如下： • 利用TextField類別的setColumns函式設定欄位寬度，必須配合AWT套件的FlowLayout版面配置（請見13-2.5），才可以設定成功。 • 利用setEchoChar函式設定回應字元後，執行程式，會將文字方塊中的文字以回應字元顯示，但利用getText函式傳回的仍然是輸入的文字。

37. TextArea文字區域： • TextArea類別建立的多行文字區域，可以配合上下與左右捲軸觀看文字區域的內容，它除了繼承父類別的函式以外，還有下面幾個常見的函式。

38. TextArea類別有下面幾個常見的函式-1：

39. TextArea類別有下面幾個常見的函式-2：

40. 下面為TextArea類別常見的幾個函式-3： • 若要利用上述函式設定文字區域的欄位寬度與高度，必須配合AWT套件的FlowLayout版面配置（請見13-2.5），才可以設定成功。

41. 例如建立一個文字區域，其程式碼如下：

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

45. 13-2.5　版面配置元件 • 利用“版面配置”元件可以管理視窗中各種物件的位置，將物件放置在想要呈現的地方。

46. Java的AWT套件提供了下面幾種版面配置類別： • 將視窗套用版面配置後，視窗中的物件會依照該版面配置的方式顯示位置與大小，所以在這裡利用函式設定物件的位置與大小是無效的。

47. FlowLayout版面配置： • FlowLayout是最簡單的版面配置方式，它會依序將物件由左至右，由上至下加入到視窗中，就好像在文件中逐行輸入資料一樣。

48. FlowLayout類別有下面幾個常見的函式-1：

49. FlowLayout類別有下面幾個常見的函式-2：

50. 例如建立一個流動式版面配置，其程式碼如下：例如建立一個流動式版面配置，其程式碼如下： • 上述程式碼第9~11行利用for迴圈在視窗加入5個按鈕。