面向?qū)ο蟪绦蛟O(shè)計(jì)第15講 圖形用戶(hù)界面㈠

第15講圖形用戶(hù)界面㈠/教學(xué)目標(biāo)了解GUI掌握AWT窗口對(duì)象類(lèi)掌握AWT窗口對(duì)象組件GUI設(shè)計(jì)概述圖形用戶(hù)界面（GUI,GraphicsUserInterface）是軟件產(chǎn)品與用戶(hù)交互的界面接口，是軟件產(chǎn)品中用戶(hù)可以看到并直接操作的部分。美觀大方、簡(jiǎn)單易用的友好操作界面是軟件產(chǎn)品成功的重要因素。在Java中，AWT（AbstractWindowingTookit）是用來(lái)處理圖形最基本的方式，它可以用來(lái)創(chuàng)建Java的applet及窗口程序。AWT是Java早期的技術(shù)，提供的組件有限，無(wú)法滿(mǎn)足應(yīng)用程序多樣化組件的要求。為了彌補(bǔ)這個(gè)不足，Sun公司開(kāi)發(fā)出Swing包，它有別于AWT，不依賴(lài)于特定的系統(tǒng)平臺(tái)，對(duì)外提供多樣化的組件及外觀，并且保持外觀風(fēng)格的一致。

GUI組成元素分類(lèi)容器容器是用來(lái)組織或容納其它界面成份和元素的組件。

Java提供了相應(yīng)的容器類(lèi)，例如，框架(J)Frame、面板(J)Panel及滾動(dòng)面板(J)ScrollPanel等類(lèi)?？刂平M件控制組件是圖形用戶(hù)界面的基本單位，里面不再包含其它的成份。用戶(hù)通過(guò)控制組件與程序進(jìn)行交互。用戶(hù)自定義成份除了上述的標(biāo)準(zhǔn)圖形界面元素外，編程人員還可以根據(jù)用戶(hù)的需要，使用各種字型字體和顏色設(shè)計(jì)一些幾何圖形、標(biāo)志圖案等，它們被稱(chēng)作用戶(hù)自定義成份。用戶(hù)自定義成份通常只起到顯示結(jié)果、裝飾美化的作用，不能響應(yīng)用戶(hù)的動(dòng)作，不具有交互功能。GUI的設(shè)計(jì)原則圖形用戶(hù)界面最重要的設(shè)計(jì)原則就是充分為用戶(hù)考慮。應(yīng)該為用戶(hù)提供一個(gè)可用、功能性好、安全高效的界面。怎樣創(chuàng)建一個(gè)以用戶(hù)為中心的界面呢？首先，收集軟件用戶(hù)盡可能多的信息。用戶(hù)屬于哪個(gè)群體？用戶(hù)對(duì)計(jì)算機(jī)操作的熟悉程度？用戶(hù)年齡多大？教育程度如何？其次，需要設(shè)計(jì)用戶(hù)和計(jì)算機(jī)之間交換信息的形式。用戶(hù)如何向程序輸入信息：用鼠標(biāo)從菜單選取，用鼠標(biāo)點(diǎn)擊圖標(biāo)，用快捷鍵，用鍵盤(pán)輸入還是語(yǔ)音命令；系統(tǒng)應(yīng)該提供何種反饋：如當(dāng)鼠標(biāo)停留在對(duì)象上的時(shí)候，為了顯示它是可選的，對(duì)象要高亮度顯示，或至少要改變一個(gè)選項(xiàng)的顏色以表示它被選中了；用戶(hù)的選項(xiàng)，程序的反饋以及程序的輸出如何安排在屏幕上；如何創(chuàng)建想要的空間布局，如何使用Java內(nèi)建功能來(lái)布置圖形組件。GUI的設(shè)計(jì)步驟概要當(dāng)設(shè)計(jì)好一個(gè)GUI的草案，如何判斷它是否是一個(gè)良好的以用戶(hù)為中心的設(shè)計(jì)呢？一般來(lái)說(shuō)，好的界面應(yīng)該讓用戶(hù)能夠控制，界面應(yīng)該具有物理舒適感、易于學(xué)習(xí)、易于記憶，同時(shí)操作不易出錯(cuò)。要定義一個(gè)GUI，一般需要以下三個(gè)步驟。1．創(chuàng)建這個(gè)GUI的組件，如按鈕，標(biāo)簽，菜單等2．在窗口中排列這些組件。3．讓這些組件響應(yīng)用戶(hù)輸入——事件處理。AWT窗口對(duì)象類(lèi)簡(jiǎn)介抽象窗口工具包（AWT，AbstractWindowingToolkit）為開(kāi)發(fā)者提供建立圖形用戶(hù)界面的工具集。對(duì)Java運(yùn)行的每一個(gè)平臺(tái)，AWT的組件通過(guò)它們各自的代理映射成平臺(tái)特定的組件。AWT適用于簡(jiǎn)單的GUI程序。java.lang.Objectjava.awt.Componentjava.awt.Buttonjava.awt.Canvasjava.awt.Checkboxjava.awt.Choicejava.awt.Containerjava.awt.Labeljava.awt.Listjava.awt.Scrollbarjava.awt.TextComponentjava.awt.Windowjava.awt.Paneljava.awt.Dialogjava.awt.Framejava.awt.TextAreajava.awt.TextFieldAWT組件抽象超類(lèi)標(biāo)簽按鈕空白矩形區(qū)域復(fù)選框彈出式選擇菜單容器對(duì)象頂層窗口對(duì)話(huà)框帶有標(biāo)題和邊界的頂層窗口面板標(biāo)簽文本項(xiàng)列表滾動(dòng)條文本多行區(qū)域文本單行區(qū)域文本AWT基本組件—FrameFrame類(lèi)繼承Container類(lèi)，是一個(gè)容器，用來(lái)容納按鈕、文本框等其他窗口組件，也可以容納其他容器對(duì)象。AWT在實(shí)際的運(yùn)行過(guò)程中是調(diào)用所在平臺(tái)的圖形系統(tǒng)，因此外觀依賴(lài)于所使用的操作系統(tǒng)Frame的外觀就像我們平常在windows系統(tǒng)下見(jiàn)到的窗口，有標(biāo)題、邊框、菜單、大小等等。每個(gè)Frame的對(duì)象實(shí)例化以后，都是沒(méi)有大小和不可見(jiàn)的，因此必須調(diào)用setSize()來(lái)設(shè)置大小，調(diào)用setVisible(true)來(lái)設(shè)置該窗口為可見(jiàn)的。如果不再需要一個(gè)Frame時(shí)，應(yīng)調(diào)用dispose方法撤消它Frame類(lèi)大致框架publicclassFrameextendsWindowimplements

MenuContainer{

publicFrame()

public

Frame(Stringtitle)//重載的構(gòu)造方法

publicStringgetTitle()

public

void

setTitle(Stringtitle)

public

MenuBar

getMenuBar()

public

voidsetMenuBar(MenuBar

mb)

public

voiddispose() }//Ex9_1.javaimportjava.awt.*;publicclassEx9_1{

staticFramefrm=newFrame("第一個(gè)窗口程序！");//創(chuàng)建一個(gè)窗口

staticLabellab=newLabel("藍(lán)色的窗口");//創(chuàng)建一個(gè)標(biāo)簽

publicstaticvoidmain(Stringargs[]){ frm.setSize(200,150);//設(shè)置窗口的高為200像素，寬為150像素

frm.setBackground(Color.BLUE);//設(shè)置窗口的背景為藍(lán)色

frm.setLocation(250,250);//設(shè)置窗口的位置

lab.setForeground(Color.yellow);//設(shè)置標(biāo)簽的前景色

frm.add(lab);//將標(biāo)簽對(duì)象加入窗口中

frm.setVisible(true);//顯示窗口

}}Frame示例程序分析這個(gè)例子中，在類(lèi)Ex9_1里面定義了兩個(gè)靜態(tài) 的對(duì)象。一個(gè)是Frame窗口對(duì)象，在Java里面稱(chēng)為一個(gè)容器，另外一個(gè)是Label標(biāo)簽對(duì)象，它是一個(gè)AWT基本組件。通過(guò)setSize()、setBackground()、setLocation()等方法來(lái)改變窗口對(duì)象的狀態(tài)。怎樣才能使frm窗口中顯示lab對(duì)象呢？通常使用add()方法將一些基本組件加入到容器里面。對(duì)于這個(gè)窗口，可以使用最大化按鈕、最小化按鈕、拖拽邊框來(lái)改變窗口的大小，但是卻不能用點(diǎn)擊關(guān)閉按鈕的辦法來(lái)關(guān)閉窗口，即使使用ALT+F4也不行。怎樣才能實(shí)現(xiàn)窗口的關(guān)閉呢？Java將利用窗口關(guān)閉事件來(lái)進(jìn)行處理，將在本章第5節(jié)介紹。AWT基本組件—Button按鈕是交互式界面常用的組件，用戶(hù)可以通過(guò)點(diǎn)擊按鈕控制程序的運(yùn)行。單擊按鈕將產(chǎn)生ActionEvent事件

publicclassButtonextendsComponent{

publicButton()

public

Button(Stringlabel)

publicStringgetLabel()

publicvoid

setLabel(Stringlabel)

publicvoid

addActionListener(ActionListenerl)

publicvoid

removeActionListener(ActionListenerl)

}importjava.awt.*;publicclassEx9_3{

publicstaticvoidmain(Stringargs[]){ Framefrm=newFrame("按鈕對(duì)象的創(chuàng)建"); Buttonbtn1=newButton("按鈕一");//創(chuàng)建一個(gè)按鈕

Buttonbtn2=newButton();//創(chuàng)建一個(gè)按鈕

btn2.setLabel("按鈕二");//設(shè)置按鈕標(biāo)題

frm.setTitle("窗口對(duì)象的創(chuàng)建"); frm.setLayout(null);//取消默認(rèn)的布局

frm.setSize(200,150); frm.setLocation(250,250); frm.add(btn1); frm.add(btn2); btn1.setBounds(40,40,80,30);//設(shè)置按鈕的位置和大小

btn2.setBounds(40,80,80,30); frm.setVisible(true);//顯示窗口

}}程序分析：這個(gè)例子中，在類(lèi)Ex9_3程序中創(chuàng)建了2個(gè)按鈕對(duì)象，通過(guò)Frame類(lèi)對(duì)象frm的add()方法加入到窗口中。程序中出現(xiàn)的setLayout()方法是用來(lái)設(shè)置窗口內(nèi)組件的布局方式的。按鈕對(duì)象的setBounnds()方法是在Component類(lèi)中定義的，作用是設(shè)置組件的位置和大小。Button示例AWT基本組件—Label標(biāo)簽（label）是用來(lái)在窗口中顯示文字的文本框，也是在屏幕上顯示圖像或文本的一種最簡(jiǎn)單和快捷的方式。單行非編輯文本組件，用于在一個(gè)版面中提供簡(jiǎn)單的信息描述，靜態(tài)文字，無(wú)事件。publicclassLabelextendsComponet{ publicstaticfinalintLEFT,CENTER,RIGHT publicLabel() publicLabel(Stringtext) publicLabel(String

text,intalignment) publicStringgetText() publicvoidsetText(Stringtext)}importjava.awt.*;publicclassEx9_4{

publicstaticvoidmain(Stringargs[]){ Framefrm=newFrame("標(biāo)簽對(duì)象的創(chuàng)建"); Labellab=newLabel(); frm.setLayout(null); frm.setSize(200,150); frm.setLocation(250,250); frm.setBackground(Color.YELLOW); lab.setText("黑體斜體字"); lab.setBackground(Color.PINK); lab.setForeground(Color.BLUE); lab.setFont(newFont("黑體",Font.ITALIC,20)); lab.setLocation(20,60); lab.setSize(120,30); frm.add(lab); frm.setVisible(true);

}}程序分析：這個(gè)例子中，在類(lèi)Ex9_4程序中創(chuàng)建了2個(gè)標(biāo)簽對(duì)象，分別使用setBackground()方法和setForeground()方法設(shè)置標(biāo)簽的背景和前景顏色。

Label示例Color類(lèi)用于封裝默認(rèn)sRGB顏色空間的顏色Font用來(lái)規(guī)范組件所用的字體、大小和樣式等AWT基本組件—

TextField與TextAreaAWT中主要用來(lái)處理文字輸入組件的類(lèi)。TextField用來(lái)處理單行文字，而TextArea可以做多行文字處理。這兩個(gè)類(lèi)都繼承自TextComponent

類(lèi)。TextComponent類(lèi)：允許創(chuàng)建、檢索和修改文本的類(lèi)。public

class

TextComponent

extendsComponent{ publicvoid

setText(Stringt) publicboolean

isEditable() publicvoid

setEditable(booleanb) publicStringgetSelectedText()

publicvoid

select(int

selectionStart,int

selectionEnd)

publicvoid

setCaretPosition(intposition)

publicint

getCaretPosition()

publicvoid

addTextListener(TextListenerl)

publicvoid

removeTextListener(TextListenerl) }importjava.awt.*;publicclassEx9_5{

publicstaticvoidmain(Stringargs[]){

Framefrm=newFrame("更改昵稱(chēng)和密碼"); Labellab1=newLabel("用戶(hù)名"); Labellab2=newLabel("昵稱(chēng)"); Labellab3=newLabel("密碼"); TextFieldtxf1=newTextField("student001"); TextFieldtxf2=newTextField("學(xué)生"); TextFieldtxf3=newTextField("123456"); frm.setSize(240,120); frm.setLayout(null); frm.setBackground(Color.yellow); lab1.setBounds(20,40,40,20); lab2.setBounds(20,60,40,20); lab3.setBounds(20,80,40,20); txf1.setBounds(80,40,120,20); txf2.setBounds(80,60,120,20); txf3.setBounds(80,80,120,20); txf1.setEditable(false); //設(shè)置不可編輯

txf3.setEchoChar('*'); //設(shè)置字符顯示為“*”

frm.add(lab1);frm.add(txf1);frm.add(lab2);frm.add(txf2);frm.add(lab3); frm.add(txf3); frm.setVisible(true);}}程序分析：這個(gè)例子中，在類(lèi)Ex9_5程序中使用了3個(gè)文本框。其中第一個(gè)文本框使用setEditable()方法設(shè)置成不可編輯，第二個(gè)文本框默認(rèn)，第三個(gè)文本框里面的輸入字符顯示成“*”。TextField示例importjava.awt.*;publicclassEx9_6{

publicstaticvoidmain(Stringargs[]) { Framefrm=newFrame("文本域"); TextAreatxa; txa=newTextArea("",8,14,TextArea.SCROLLBARS_BOTH); frm.setLayout(null); txa.setBounds(30,45,180,100); frm.setSize(240,180); frm.add(txa); frm.setVisible(true);

}}程序分析：這個(gè)例子中，在類(lèi)Ex9_6程序中程序中，產(chǎn)生一個(gè)8行14列的文本框，這個(gè)文本框帶有垂直和水平滾動(dòng)條。TextArea示例AWT基本組件—Checkbox、CheckboxGroup復(fù)選框可以讓用戶(hù)選取項(xiàng)目。通常分為復(fù)選和單選兩種。復(fù)選表示多個(gè)選項(xiàng)可以同時(shí)選擇，而單選擇表示一組選項(xiàng)中只能選擇一項(xiàng)。AWT中提供了Checkbox類(lèi)來(lái)實(shí)現(xiàn)復(fù)選功能。而實(shí)現(xiàn)單選，則必須將多個(gè)復(fù)選對(duì)象利用CheckboxGroup類(lèi)對(duì)象組成一組。請(qǐng)參考API文檔熟悉Checkbox,CheckboxGroup類(lèi)的構(gòu)造方法和常用方法。importjava.awt.*;publicclassEx9_7{

publicstaticvoidmain(Stringargs[]){ Framefrm=newFrame("復(fù)選框"); Labellab=newLabel("您喜歡的水果?"); Checkboxckb1=newCheckbox("蘋(píng)果",true); Checkboxckb2=newCheckbox("梨子",true); Checkboxckb3=newCheckbox("桔子"); frm.setSize(200,150); frm.setLayout(null); frm.setBackground(Color.yellow); lab.setBounds(20,30,140,20); ckb1.setBounds(20,50,140,20); ckb2.setBounds(20,70,140,20); ckb3.set