第5圖形用戶界面設計課件

1、第5章 圖形用戶界面設計教學目標：通過本章的學習，掌握常用容器組件的用法、容器組件的布局方式、組成界面的可視組件的功能與用法；掌握事件處理機制，能進行菜單設計，最終達到開發(fā)出智能化的圖形界面應用程序的目的。 案例 學生信息注冊界面設計解析多數學校的學生檔案信息都由計算機進行管理，在編寫的檔案管理應用程序中，有檔案信息錄入模塊，該模塊的功能是在圖形化的界面下，用戶把信息輸入到計算機中。錄入界面的大致樣式及組件名稱如圖 設計上述程序界面并實現相應的功能，程序框架如下：public class InputData implements ActionListenerFrame f;/聲明框架對象Lab

2、el l1,l2,l3,l4;/聲明標簽對象TextField t;/聲明文本行對象Checkbox r1,r2;/聲明單選按鈕對象CheckboxGroup g;/聲明組對象Checkbox c1,c2,c3;Choice ch;/聲明選擇框對象Button b;/聲明按鈕對象TextArea ta;/聲明文本區(qū)對象Panel p1,p2,p3,p4,p5;/聲明面板對象int i=0;public InputData( )對象實例化；ch.add(濟南); /添加選擇項p1=new Panel( ); p1.setLayout(new FlowLayout(FlowLayout.LEFT)

3、;/設定面板布局樣式p1.add(l1); /在面板中加入組件f.setLayout(new GridLayout(2,1); /設定框架布局樣式f.addWindowListener(new WindowAdapter( ) /注冊事件監(jiān)聽器，匿名類實現接口public void windowClosing(WindowEvent e)System.exit(0););f.setVisible(true);public void actionPerformed(ActionEvent e) /事件處理接口實現 /把輸入內容顯示到文本區(qū)中；public static void main(Str

4、ing args )new InputData( );在上面的案例框架中，應用到了如下知識點。(1) 組成界面的各種組件。(2) 界面的布局樣式。(3) 事件處理機制。下面將詳細介紹相關的知識。 5.1 框架與面板 5.1.1 認識Component類 部分類的繼承關系如圖 Component類是其他組件類的父類，在此介紹該類的一些方法，這些方法可直接繼承到子類中使用。(1)setFont(Font f)：設置組件的字體。(2)setForeground(Color r)：設置組件的前景色。(3)setLocation(int x,int y)：設置組件的顯示位置。(4)setSize(int

5、 width, int height)：調整組件的大小，使其寬度為 width，高度為 height。(5)setVisible(boolean b)：根據參數 b 的值顯示或隱藏此組件。(6)getForeground( )：獲得組件的前景色。(7)getFont( )：獲得組件的字體。(8)getBackground( )：獲得組件的背景色。(9)getHeight( )：返回組件的當前高度。(10)invalidate( )：使此組件無效。(11)getBounds( )：以Rectangle 對象的形式獲得組件的邊界。5.1.2 框架框架類Frame是一種帶標題條并且可以改變大小的窗口

6、，該類為容器類。 Frame類的構造方法及實例方法 :類別方 法 定 義功 能構造方法public Frame( )創(chuàng)建一個不帶標題信息的框架public Frame(String title)創(chuàng)建一個標題信息是title的框架實例方法public void add(Component comp)在框架中添加組件comppublic void setLayout(LayoutManager mgr)設置布局方式public void setTitle(String title)設置框架的標題public String getTitle(String title)獲取框架的標題5.1.3 面板面

7、板類Panel也是容器類。但與Frame類的區(qū)別是，面板是一種沒有標題條的容器，在應用時只能把該類實例化的對象通過Container類的add方法加載到Window對象中。該類的構造方法如下。(1)public Panel( )：創(chuàng)建一個面板對象。(2)public Panel(LayoutManager mgr)：創(chuàng)建一個面板對象且約定了添加到該面板中組件的布局樣式。 5.2 布局管理器5.2.1 邊界布局該布局將容器組件劃分成了5個區(qū)域：南(South)、北(North)、東(East)、西(West)、中(Center)。邊界布局類邊界布局類為BorderLayout，該類的構造方法如下

8、。(1)public BorderLayout( )：創(chuàng)建一個邊界布局管理類對象。(2)public BorderLayout(int hgap, int vgap)：創(chuàng)建一個邊界布局管理類對象。其中，hgap和vgap指定組件的水平和垂直間距，單位是像素，默認值為0。 若向容器中加入組件，可以通過以下兩種形式實現。(1)add(String s, Component comp)：其中s代表位置，位置用字符串“South”、“North”、“East”、“West”、“Center”表示。(2)add(Component comp, int x)：其中x是代表位置的常量值，分別是BorderL

9、ayout.SOUTH、BorderLayout.NORTH、BorderLayout.EAST、BorderLayout.WEST、BorderLayout.CENTER。說明：(1) 在邊界布局中，若向框架加入組件，如果不指定位置，則默認把組件加到了“中”的區(qū)域。(2) 若某個位置未被使用，則該位置將被其他組件占用。 5.2.2 流布局該布局按從左至右、從上至下的方式將組件加入到容器中。流布局類流布局類為FlowLayout，該類的構造方法如下。(1)public FlowLayout( )：創(chuàng)建一個流布局類對象。(2)public FlowLayout(int align)：創(chuàng)建一個流布

10、局類對象，其中align表示對齊方式，其值有3個，為FlowLayout .LEFT、FlowLayout .RIGHT、FlowLayout .CENTER，默認為FlowLayout .CENTER。(3)public FlowLayout(int align, int hgap, int vgap)：其中align表示對齊方式；hgap和vgap指定組件的水平和垂直間距，單位是像素，默認值為5。 5.2.3 網格布局該布局將容器劃分成規(guī)則的行列網格樣式，組件逐行加入到網格中，每個組件大小一致。但當容器中放置的組件數超過網格數時，則自動增加網格列數，行數不變。1網格布局類網格布局類為Gri

11、dLayout，該類的構造方法如下。(1)public GridLayout(int rows, int cols)：rows表示網格行數，cols表示網格列數。(2)public GridLayout(int rows, int cols, int hgap, int vgap)：rows表示網格行數，cols表示網格列數；hgap和vgap指定組件的水平和垂直間距，單位是像素。 5.2.4 卡片布局使用該布局樣式布局容器中的組件時，組件就會像卡片一樣排放在容器中，只有最上面的卡片可見。 類別方 法 定 義功 能構造方法public CardLayout( )創(chuàng)建一個卡片對象實例方法publ

12、ic void add(String name, Component c)添加組件c，并指定組件的名稱為namepublic void first(Container parent)顯示第一張卡片public void last(Container parent)顯示最后一張卡片public void next(Container parent)顯示下一張卡片public void previous(Container parent)顯示前一張卡片public void show(Container parent, String name)顯示指定名稱的卡片5.3 按鈕、標簽、文本行、文本區(qū)

13、5.3.1 按鈕(Button)圖形用戶界面中，按鈕常用于接收用戶的單擊事件。1. 構造方法(1)public Button( )：通過該構造方法創(chuàng)建按鈕時，按鈕上沒有說明信息。(2)public Button(String s)：通過該構造方法創(chuàng)建按鈕時，按鈕上的說明信息為s。2. 常用方法(1)public void setLabel(String s)：通過該方法，把按鈕上的說明信息設為s。(2)public String getLabel( )：通過該方法，獲取按鈕上的說明信息。5.3.2 標簽(Label)標簽的功能是顯示靜態(tài)文本，不能動態(tài)地編輯文本，作為提示信息通常由標簽實現。1構

14、造方法(1)public Label( )：通過該構造方法創(chuàng)建標簽時，標簽沒有提示信息。(2)public Label(String s)：通過該構造方法創(chuàng)建標簽時，標簽上顯示的提示信息為s。(3)public Label(String s, int align)：通過該構造方法創(chuàng)建標簽時，標簽上的提示信息為s，并設定了標簽文本的對齊方式，分別為Label.LEFT(左對齊)、Label.RIGHT(右對齊)、Label.CENTER(居中對齊)，默認對齊方式為居中對齊。2常用方法(1)public void setText(String s)：通過該方法，把標簽上的提示信息設為s。(2)pu

15、blic String getLabel( )：通過該方法，獲取標簽上的提示信息。 5.3.3 文本行(TextField)文本行用來輸入單行文本。 類別方 法 定 義功 能構造方法public TextField( )創(chuàng)建一個內容為空的文本行public TextField(String s)創(chuàng)建一個內容為s的文本行public TextField(int x)創(chuàng)建一個能顯示x個字符的文本行public TextField(String s, int x)創(chuàng)建一個內容為s的文本行，且文本行長度為x實例方法public void setText(String s)設置文本行中的內容為spubl

16、ic String getText( )獲取文本行中的內容public void setEchoChar(char c)設置文本行的回顯字符。常用于口令輸入public void setEditable(boolean b)設置文本的可編輯性。當參數值為false時，只能顯示，不能修改5.3.4 文本區(qū)(TextArea)文本區(qū)可以輸入多行文本，且文本區(qū)帶有滾動條。 類別方 法 定 義功 能構造方法public TextArea( )創(chuàng)建一個內容為空的文本區(qū)對象public TextArea(String s)創(chuàng)建一個內容為s的文本區(qū)對象public TextArea(int x,int y)

17、創(chuàng)建一個內容為空且行數為x、列數為y的文本區(qū)對象public TextArea(String s, int x, int y)創(chuàng)建一個內容為s且行數為x、列數為y的文本區(qū)對象public TextArea(String s, int x, int y, int scollbar)創(chuàng)建一個內容為s、行數為x、列數為y、滾動條樣式為指定樣式的文本區(qū)對象。scollbar取值為：TextArea.SCOLLBARS_BOTH, TextArea.SCOLLBARS_VERTICAL_ONLY, TextArea.SCOLLBARS_HORIZONTAL_ONLY, TextArea.SCOLLBAR

18、S_NONE實例方法public void append(String s)在文本區(qū)尾部追加文本內容s實例方法public void insert(String s, int position)在文本區(qū)位置position處插入文本spublic void setText(String s)設置文本區(qū)中的內容為文本spublic String getText( )獲取文本區(qū)的內容public String getSelectedText( )獲取文本區(qū)中選中的內容public void replaceRange(String s, int start, int end)把文本區(qū)中從start位

19、置開始至end位置之間的文本用s替換public void setCaretPosition(int position)設置文本區(qū)中光標的位置public int getCaretPosition( )獲得文本區(qū)中光標的位置public void setSelectionStart(int position)設置要選中文本的起始位置public void setSelectionEnd(int position設置要選中文本的終止位置public int getSelectionStart( )獲取選中文本的起始位置public int getSelectionEnd( )獲取選中文本的終止位

20、置public void selectAll( )選中文本區(qū)的全部文本5.4 事件處理機制 5.4.1 Java事件處理概述引入事件處理機制后的編程基本方法如下。(1) 在java.awt中，組件實現事件處理必須使用java.awt.event包，所以在程序開始處應加入import java.awt.event.*語句。(2) 用如下語句設置事件監(jiān)聽者：事件源.addXxxListener(事件監(jiān)聽者)。(3) 事件監(jiān)聽者所對應的類實現事件所對應的接口XxxListener，并重寫接口中的全部方法。這樣就能處理圖形用戶界面中的對應事件。要刪除事件監(jiān)聽者，可以使用語句：事件源.removeXxx

21、Litener( )。5.4.2 Java常用事件事件類/接口名稱接口方法與說明ActionEvent 動作事件類ActionListener接口actionPerformed(ActionEvent e)單擊按鈕、選擇菜單項或在文本行中按回車鍵時ComponentEvent 調整事件類ComponentListener接口componentMoved(ComponentEvent e)組件移動時componentHidden(ComponentEvent e)組件隱藏時componentResized(ComponentEvent e)組件縮放時componentShown(Componen

22、tEvent e)組件顯示時FocusEvent 焦點事件類FocusListener接口focusGained(FocusEvent e)組件獲得焦點時focusLost(FocusEvent e)組件失去焦點時ItemEvent 選擇事件類ItemListener接口itemStateChanged(ItemEvent e)選擇復選框、單選按鈕、單擊列表框、選中帶復選框菜單時WindowEvent 窗口事件類WindowListener接口windowOpened(WindowEvent e)窗口打開后windowClosed(WindowEvent e)窗口關閉后windowClosin

23、g(WindowEvent e)窗口關閉時windowActivated(WindowEvent e)窗口激活時windowDeactivated(WindowEvent e)窗口失去焦點時windowIconified(WindowEvent e)窗口最小化時windowDeiconified(WindowEvent e)最小化窗口還原時AdjustmentEvent 調整事件類AdjustmentListener接口adjustmentValueChanged(AdjustmentEvent e)改變滾動條滑塊位置5.4.3 事件適配器Java為那些聲明了多個方法的Listener接口提供

24、了一個對應的適配器(Adapter)類，在該類中實現了對應接口的所有方法，只是方法體為空。 接 口 名 稱適配器名稱接 口 名 稱適配器名稱ComponentListener MouseListenerComponentAdapterMouseAdapterFocusListener MouseMotionListenerFocusAdapterMouseMotionAdapterItemListener WindowListenerItemAdapterWindowAdapterKeyListener KeyAdapter 5.5 其他常用組件5.5.1 選擇框(Checkbox)選擇框分為

25、復選框與單選按鈕兩種，在一組復選框中可選多項，但在一組單選按鈕中只允許選一項。它們對應的類同為Checkbox。 類別方 法 定 義功 能構造方法public Checkbox( )創(chuàng)建沒有名稱且沒有選中的復選框public Checkbox(String s)創(chuàng)建一個名稱是s的沒有選中的復選框，名稱出現在復選框右側public Checkbox(String s, boolean b)創(chuàng)建一個名稱是s的復選框，名稱出現在復選框右側，選中狀態(tài)由參數b設定；若b取值為true，則復選框為選中狀態(tài)，若b取值為false，則復選框為未選中狀態(tài)public Checkbox(String s, boo

26、lean b , CheckboxGroup g)g是CheckboxGroup類的對象，相當于一個邏輯分組。當用Checkbox類創(chuàng)建對象，且對象屬于一個邏輯分組時，創(chuàng)建的對象為單選按鈕實例方法public boolean getState( )獲取選擇框的選中狀態(tài)public void setState(boolean b)設置選擇框的選中狀態(tài)public String getLabel( )獲取選擇框顯示在右側的名稱public void setLabel(String s)設置選擇框的顯示在右側的名稱5.5.2 選項框(Choice)這是用戶十分熟悉的一個組件，用戶可以在下拉列表中看到

27、第一個選項，在選項右側有一個下拉箭頭，當用戶單擊下拉箭頭時，則選項列表打開，用戶可選擇其中的選項。 類 別方 法 定 義功 能構造方法public Choice( )該方法創(chuàng)建一個選項框實例方法public void add(String name)將name項加入到選項框中public String getItem(int index)獲取位置索引編號為index的選項名稱public int getItemCount( )獲取選項框中選項的數目類 別方 法 定 義功 能實例方法public int getSelectedIndex( )獲取選項框中選中項的位置索引編號public Stri

28、ng getSelectedItem( )獲取選項框中選中項的名稱public void insert(String item, int index)將選擇項插入到指定位置索引編號處。item代表要插入的項，index代表插入的位置索引編號public void remove(int position)從選項框中移除指定位置的一個項。position表示位置號public void remove(String item)移除選項框中第一個出現的 itempublic void removeAll( )從選項框中移除所有的項public void select(int pos)將位置索引編號為p

29、os的選項設定為選中的項public void select(String str)將此選項框中名稱等于指定字符串str的項設為選中項。當選項框中有多個選項名稱相同時，僅把索引編號最小的選項設為選中狀態(tài)5.5.3 列表框(List)列表框與選項框均是從提供的選項中選取選項，但顯示形式不同，初始時選項框只顯示一項選項，但列表框初始時可顯示多個選項。當列表框不足以顯示出所有列表項時，自動在右側添加滾動條。選項框只允許用戶選取一個選項，但列表框可供用戶選多項。在此把列表框與選項框中一些不同的方法列出 .類 別方 法 定 義功 能構造方法public List( )創(chuàng)建一個有默認可見行的列表框publ

30、ic List(int n)創(chuàng)建一個能顯示n行選項的列表框public List(int n, boolean b)創(chuàng)建一個能顯示n行選項，且設定了是否允許多選的列表框；當參數b值為true時，該列表框允許用戶多項選擇。當參數b值為false時，該列表框不允許用戶多項選擇實例方法public String getSelectedItems( )獲取列表框中選中的多項名稱。返回值是字符串數組public int getSelectedIndexes( )獲取選項框中選中的多項位置索引編號。返回值是整型數組5.6 菜 單 設 計 菜單系統(tǒng)由菜單條、菜單、菜單項組成。要創(chuàng)建一個菜單系統(tǒng)，首先要有一個

31、框架，在框架上添加菜單條，然后在菜單條中添加若干個菜單，每個菜單再添加若干菜單項。1菜單條(MenuBar)菜單條是一個放置菜單的容器。(1) 構造方法如下所示。public MenuBar( )：創(chuàng)建一個菜單條。(2) 常用方法如下所示。public Menu add(Menu m)：將菜單加入到菜單條中。在設計菜單時，通過使用Frame類的setMenuBar( )方法將菜單條加入到框架中標題條的下方。 2菜單(Menu)菜單是一個放置菜單項或下一級菜單的容器。菜單對象放在菜單條對象里 .類 別方 法 定 義功 能構造方法public Menu(String s)創(chuàng)建一個標題信息為s的菜單實例方法public void add(MenuItem it)向菜單中加入菜單項public void add(MenuItem it, MenuShortCut ms)向菜單中加入菜單項it。菜單項帶有快捷鍵public void addSeperator( )向菜單中加入分隔線public void insert(MenuItem it, int n)向菜單的指定位置加入菜單項public void insert(String s, int