《圖形用戶界面設(shè)計(jì)》PPT課件

《《圖形用戶界面設(shè)計(jì)》PPT課件》由會(huì)員分享，可在線閱讀，更多相關(guān)《《圖形用戶界面設(shè)計(jì)》PPT課件（107頁(yè)珍藏版）》請(qǐng)?jiān)谘b配圖網(wǎng)上搜索。

1、圖形用戶界面設(shè)計(jì),Java的圖形用戶界面,2,主要內(nèi)容,Java的GUI簡(jiǎn)介 自定義圖形設(shè)計(jì) 圖形、文字、圖象 Java的標(biāo)準(zhǔn)組件 容器和組件 GUI的布局 事件處理,Java的圖形用戶界面,3,圖形用戶界面（GUI）,字符界面 用字符串、命令行的方式與用戶交互 圖形用戶界面:Graphics User Interface 用直觀的圖形來(lái)表示數(shù)據(jù) 用直觀、方便的GUI標(biāo)準(zhǔn)組件來(lái)接收命令 GUI組成成分的標(biāo)準(zhǔn)化 使用圖形的方式借助菜單、按鈕等標(biāo)準(zhǔn)界面元素和鼠 標(biāo)操作，來(lái)幫助用戶方便地向計(jì)算機(jī)系統(tǒng)發(fā)出命令， 啟動(dòng)操作，并將系統(tǒng)運(yùn)行的結(jié)果同樣以圖形的方式顯 示給用戶。,Java的圖形用戶界面,4,用

2、戶界面設(shè)計(jì)原則,控制權(quán)在用戶 界面與操作的風(fēng)格一致性 寬容（容錯(cuò)）性 簡(jiǎn)潔與美觀并重,Java的圖形用戶界面,5,圖形用戶界面簡(jiǎn)介,圖形用戶界面的構(gòu)成 容器：布局、安排 標(biāo)準(zhǔn)組件 用戶自定義成分 設(shè)計(jì) //must import to use GUI //must extends Frame in an application public class Empty extends Frame // 暫時(shí)采用1.0.2的事件處理方法，關(guān)閉窗口 public boolean handleEvent(Event evt) //根據(jù)Event類中參數(shù)evt

3、的id值來(lái)判斷發(fā)生事件的種類 if(evt.id= =Event.WINDOW_DESTROY) System.exit(0); // return的返回值表示將余下的事件處理交給handleEvent( )的父 // 類處理，從而保證對(duì)事件的正常處理 return super.handleEvent(evt); public static void main(String args) Frame f=new Empty(); f.setSize(300,200); f.setVisible(true); ,Java的圖形用戶界面,13,繪制用戶自定義

4、成分,用戶自定義成分屬于構(gòu)成GUI的非標(biāo)準(zhǔn)部分 無(wú)法響應(yīng)用戶事件 一般僅僅起背景裝飾、輸出效果突出的作用 Java中的用戶自定義成分 顯示文字 繪制圖形 顯示圖片,Java的圖形用戶界面,14,繪制用戶自定義成分,一般在容器中(窗口)或畫布上繪制。 利用Java.awt類庫(kù)中的類及其方法繪制用戶自定義的圖形界面成分。 Graphics類包含很多繪制圖形和文字的方法 。 首先要獲得Graphics類的實(shí)例，然后利用其方法繪制。 Graphics類的實(shí)例一般作為相關(guān)方法的參數(shù)傳遞進(jìn)來(lái)： paint(Graphics g) Java程序圖形界面的 坐標(biāo)設(shè)置,Java的圖形用戶界面,15,繪制圖形

5、及其相關(guān)方法,drawLine(x1,y1,x2,y2) //直線 drawRect(x,y,w,h) //矩形 drawOval(x,y,w,h) //圓或橢圓 fillOval(x,y,w,h) //實(shí)心圓或橢圓 drawPolygon(X坐標(biāo)數(shù)組，Y坐標(biāo)數(shù)組，頂點(diǎn)個(gè)數(shù)) //畫多邊形 drawArc (x,y,w,h,開始角度，弧度角度) setColor(Color c) //設(shè)置顏色 setFont(Font f) //設(shè)置字體 getColor() getFont(),Java的圖形用戶界面,16,繪制圖形及其相關(guān)方法,從(x1,y1)

6、到(x2,y2)畫直線 drawLine(x1,y1,x2,y2) 參數(shù)均為int 畫弧線drawArc(x,y,w,h,,) 參數(shù)均為int x,y為繪制弧形的左上角的坐標(biāo)； w,h為弧形的寬度和高度；為弧形的起始角，為弧形的弧度， 為正，表順時(shí)針?lè)较颍?為負(fù)，表逆時(shí)針?lè)较颉?以(x,y)為左上角、w為寬度、h為高度畫矩形 drawRect(x,y,w,h) 參數(shù)均為int fillRect(x,y,w,h)、clearRect(x,y,w,h),Java的圖形用戶界面,17,繪制圖形及其相關(guān)方法,畫圓或橢圓 drawOval(x,y,w,h) x,y為繪制圓或橢圓的左上角的坐標(biāo)，w,h確

7、定了 橢圓的寬度和高度 畫實(shí)心圓或橢圓 fillOval(x,y,w,h) 畫多邊形 drawPolygon(X坐標(biāo)數(shù)組，Y坐標(biāo)數(shù)組，頂點(diǎn)個(gè)數(shù)) P.185,Java的圖形用戶界面,18,繪制圖形及其相關(guān)方法,例子： sanmao.java,Java的圖形用戶界面,19,//畫頭部,橢圓方法drawOval g.setColor(Color.black); //setColor用來(lái)設(shè)置要使用的顏色 g.drawOval(40,40,120,150); ... //畫頭發(fā),直線方法drawLine,畫弧方法drawArc g.drawLine(100,10,100,60); g.dra

8、wArc(110,20,100,80,90,90); ... //畫嘴巴,填充畫弧方法fillArc g.fillArc(60,130,80,40,180,180); ... //畫耳朵,填充橢圓方法fillOval,復(fù)制圖形方法copyArea g.fillOval(25,92,15,30); g.copyArea(25,92,15,30,136,0); //拷貝某區(qū)域的圖形至另一區(qū)域 ... //畫身體,多邊形方法fillPolygon g.fillPolygon(polygon_x,polygon_y,polygon_pt_num);,Java的圖形用戶界面,20,顯示文字,字體顯示效果

9、類：Font 一個(gè)Font類的對(duì)象表示了一種字體顯示效果，包括字體類型、風(fēng)格和字號(hào)。 Font mf = new Font(String 字體，int 風(fēng)格，int 字號(hào)); 字體：TimesRoman, Courier, Arial等 風(fēng)格：三個(gè)常量 Font.PLAIN, Font.BOLD, Font.ITALIC 字號(hào)：字的大?。ò鯏?shù)） 設(shè)置當(dāng)前使用的字體：setFont(Font fn) 獲取當(dāng)前使用的字體：getFont() 例：UseFonts.java,Java的圖形用戶界面,21,String FontName = TimesRoman,Courier,Arial; in

10、t FontStyle = Font.PLAIN, Font. BOLD, Font.ITALIC; String StyleName = PLAIN, BOLD, ITALIC ; public void paint( Graphics g) for ( int i=0; i<3; i++) for ( int j=0; j<3; j++) //set a new font and draw a string with the new font g.setFont(new Font(FontNamei, FontStylej, 12)); g.drawString( ABEXYZ +

11、FontNamei + + StyleNamej, 10,20*(i*3+j+2)); //end of paint,Java的圖形用戶界面,22,paint()與update(),某組件的paint()和 update()為系統(tǒng)自動(dòng)調(diào)用的有關(guān)圖 形繪制的方法，不可人為編程調(diào)用；但可編程重新 定義其操作內(nèi)容 使用repaint()方法可以觸發(fā)update()方法,,Java的圖形用戶界面,23,顯示圖象,圖形與圖象，java支持gif和jpeg格式 保存二進(jìn)制圖象的java.awt.Image類 獲取Image對(duì)象的方法 getImage(圖象文件所在的URL) getImage(圖象

12、文件所在的URL,圖象文件名) Applet類以及java.awt.Toolkit中均有方法的定義 注意：在application中只能使用Toolkit，而在Applet中，兩者均可使用,Java的圖形用戶界面,24,顯示圖象,在applet小程序中，可使用Applet類的getImage方法獲得圖象。 Image ig = getImage() 而在application中就只能使用ToolKit類的getImage方法： Image ig = getToolkit().getImage(“文件名”); 然后用Graphics類的drawImage方法顯示Image對(duì)象。,Java的圖

13、形用戶界面,25,顯示圖象,顯示圖象的方法 drawImage(Image 對(duì)象, x, y,背景色, ImageObserver); java.awt.Graphics類中定義了此方法 第一個(gè)參數(shù)是保存圖像數(shù)據(jù)的Image對(duì)象。 第二、三個(gè)參數(shù)是圖像的左上角坐標(biāo)，它們決定了圖像在容器中的顯示位置。 ImageObserver為一個(gè)接口，java的組件類實(shí)現(xiàn)了此接口，此處可理解為觀察/顯示Image對(duì)象容器，編程時(shí)一般可使用this，用于提示圖象是否加載完成,Java的圖形用戶界面,26,顯示圖象,表示顏色的類Color 顯示的字符串或圖形的顏色可以用Color類的對(duì)象來(lái)控制，每個(gè)Colo

14、r 對(duì)象代表一種顏色，用戶可以直接使用Color類中定義好的顏色常量，也可以通過(guò)調(diào)配紅、綠、藍(lán)三色的比例創(chuàng)建自己的Color對(duì)象 Color(red,green,blue)來(lái)創(chuàng)建非缺省色 調(diào)用Graphics對(duì)象的setColor()方法可把當(dāng)前的缺省顏色改成新建的顏色 Color blueColor=new Color(0,0,255); g.setColor(blueColor); P.189,Java的圖形用戶界面,27,Color類,構(gòu)造方法1（設(shè)置顏色） Color c = new Color(intred, intgreen, intblue)

15、 范圍 ：0255 new Color(200,200,200) new Color(255,0,100) 構(gòu)造方法2 Color c = new Color(floatred, float green, float blue) 范圍 ：0.0 1.0 Color類定義了13種顏色常量值 Color.black, Color.blue, Color.gray, Color.red ... 對(duì)GUI的組件有四種與顏色相關(guān)的方法來(lái)設(shè)置和獲取其背景色和前景色: setBackground(Color c); getBackground(); setForeground(); getFo

16、reground();,Java的圖形用戶界面,28,例：DrawMyImage.java public class DrawMyImage extends Frame //獲得Toolkit實(shí)例的方法getDefaultToolkit() Toolkit toolkit=Toolkit.getDefaultToolkit(); Image myImage ; public DrawMyImage() //獲得Image對(duì)象, 圖象文件在當(dāng)前目錄下時(shí) myImage = toolkit.getImage(Invntory.gif); //在paint方法中繪制圖象 pub

17、lic void paint(Graphics g) g.drawImage(myImage, 0, 40, Color.orange, this ); .. ,Java的圖形用戶界面,29,GUI標(biāo)準(zhǔn)組件概述,構(gòu)建程序的圖形用戶界面的主要任務(wù)有兩個(gè) 創(chuàng)建各界面組件并排列成圖形用戶界面的外觀 定義這些組件對(duì)不同事件的影響從而完成圖形用戶界面功能 組成圖形用戶界面的成分有三類 用戶自定義類 容器: 是能夠容納并排列其他組件的對(duì)象 組件: 放置在容器中的對(duì)象 在Java中，容器和組件是由AWT包中的對(duì)象來(lái)代表， 這些對(duì)象間的層次關(guān)系如下圖：,Java的圖形用戶界面,30,AWT類層次關(guān)系圖,,

18、,,Java的圖形用戶界面,31,GUI標(biāo)準(zhǔn)組件概述,基本組件被安放在容器中的某位置，用來(lái)完成一種具體的與用戶交互的功能，使用基本組件一般包括如下的步驟 創(chuàng)建某種基本組件類的新對(duì)象，指定該對(duì)象的屬性 比如：外觀、大小等 將該組件對(duì)象加入到某個(gè)容器的合適位置 創(chuàng)建該組件對(duì)象的監(jiān)聽者，即實(shí)現(xiàn)以該組件為事件源的事件對(duì)應(yīng)的監(jiān)聽者接口，也可以使現(xiàn)有的類實(shí)現(xiàn)該接口成為監(jiān)聽者。將該組件對(duì)象注冊(cè)給此監(jiān)聽者，并在監(jiān)聽者內(nèi)部實(shí)現(xiàn)監(jiān)聽者接口中定義的方法，對(duì)該組件可能引發(fā)的事件加以處理，定義新加入組件對(duì)象的交互性界面功能。 比如：接收用戶輸入的文本、在屏幕顯示輸出等,Java的圖形用戶界面,32,GUI標(biāo)準(zhǔn)組件,

19、Component:所有組件和容器的抽象父類 顯示功能：paint(), update(), repaint() 顯示效果控制：字體、顏色、位置、尺寸 圖象處理：一般利用Canvas和Container來(lái)顯示圖像 事件處理機(jī)制（java 1.1）： addXXXListener( ) removeXXXListener( ),Java的圖形用戶界面,33,Component類,可顯示在屏幕上的圖形對(duì)象，可與用戶交互。 是所有組件和容器的抽象父類，其中定義了一些每個(gè) 容器和組件都可能用到的方法。 add(PopupMenupopup) 在組件上加入一彈出菜單 addFocusListener(

20、FocusListenerl)將發(fā)生在本組件上的事件注冊(cè)給監(jiān)聽者，以進(jìn)行事件處理。 setSize(intwidth, intheight) 設(shè)置組件尺寸 repaint(int x,int y,intwidth, intheight) 重畫組件 setFont(Fontf) 設(shè)置組件字體 setBackground(Colorc) 設(shè)置組件背景色 setVisible(boolean b) 設(shè)置組件是否可見,Java的圖形用戶界面,34,GUI標(biāo)準(zhǔn)組件,簡(jiǎn)單構(gòu)件：人機(jī)交互的基本工具(控制) Button,Checkbox, Label等 TextComponent(TextArea,Text

21、Field) Canvas 復(fù)雜構(gòu)件: Container(安放排列其他構(gòu)件的容器) Panel Window,Java的圖形用戶界面,35,Container（容器）,排列其中包容的構(gòu)件 定位布局策略 set/getLayout() 包容其他基本構(gòu)件 增加構(gòu)件: add( ) 刪除構(gòu)件: remove( ) 控制是否顯示容器及其中組件 setVisible(true/false),Java的圖形用戶界面,36,Container容器組件,Window 無(wú)邊框、菜單的空白窗口。不需要其他組件支撐， 獨(dú)立顯示。 Frame: 用于Application，含邊框、標(biāo)題和菜單的獨(dú)立窗口

22、Dialog: 依賴于 Frame的非獨(dú)立窗口。沒(méi)有菜單條，不能 改變大小。 Panel (面板)屬于無(wú)邊框容器。必須放在Window組件中(或Web瀏覽器窗口)才能顯示。它為一矩形區(qū)域，在其中可擺放其他組件，可以有自己的布局管理器。 無(wú)邊框容器包括Panel和Applet。其中Applet為Panel的子類 基本方法 add(Component comp) 將指定組件放到容器中 getComponent(int index) 獲取指定序號(hào)的組件 remove(Componentcomp) 刪除指定組件 setLayout(LayoutManagermgr) 設(shè)置容器布局,Java的圖

23、形用戶界面,37,容器的組件布局,布局管理器（layout manager) 用于控制組件在容器中的布局 負(fù)責(zé)確定組件在容器中的位置和大小。 調(diào)用容器的setLayout(布局管理器對(duì)象) 方法，為容器指定某種布局。 當(dāng)容器需要定位組件和確定組件大小時(shí)，就會(huì)給布局管理器對(duì)象發(fā)消息，讓它完成該項(xiàng)工作。 直接管理組件 調(diào)用容器的 setLayout(null) 方法，關(guān)閉布局管理器。 調(diào)用每一個(gè)組件的setLocation()方法決定組件位置。 調(diào)用每一個(gè)組件的setSize()方法決定其大小。,Java的圖形用戶界面,38,布局管理器種類,在Java的GUI界面設(shè)計(jì)中，布局控制是通過(guò)為容器設(shè)置布

24、 局編輯器來(lái)實(shí)現(xiàn)的。Java.awt包中共定義了五種布局編輯 類，每一個(gè)布局編輯類對(duì)應(yīng)一種布局策略： FlowLayout ：組件在一行中按加入的先后順序從左至右水平排列， 排滿后折行，每行中的組件都居中排列。 BorderLayout：把容器空間劃分為北、南、西、東、中五個(gè)區(qū)， 每加入一個(gè)組件都應(yīng)說(shuō)明把這個(gè)組件加在那個(gè)區(qū) 域中。 CardLayout：每一個(gè)組件作為一個(gè)卡片，容器僅顯示多個(gè)卡片中 的某一個(gè) GridLayout：以行和列的網(wǎng)格形式安排組件 GridBagLayout：更復(fù)雜、功能更強(qiáng)的網(wǎng)格布局,Java的圖形用戶

25、界面,39,確定容器布局,缺省的布局管理器 Window、Frame、Dialog BorderLayout: 缺省的窗口容器的管理器 Panel、Applet FlowLayout: 缺省的Panel布局管理器 選擇布局管理器的方法 建立布局管理器類的對(duì)象 利用容器的 setLayout 為容器指定布局(即指定一個(gè)布局管理器的對(duì)象),Java的圖形用戶界面,40,確定容器布局,改變?nèi)笔〔季止芾砥鞯姆椒ǎ?例：BorderLayout B=new BorderLayout(); C1.setLayout(B); or C1.setLayout(new BorderLayout());

26、 例: 將myFrame布局設(shè)定為FlowLayout類型 myFrame.setLayout(new FlowLayout());,Java的圖形用戶界面,41,Frame,Frame(String title) 構(gòu)造一個(gè)新的不可見的frame 隱含的布局管理器是：BorderLayout setLayout() 設(shè)置新的布局管理器。 add(Componentcomp) 在容器上增加一個(gè)組件（在容器為不可見的狀態(tài)時(shí)加）。 void setSize(intwidth, intheight) 設(shè)置組件大小 setVisible(true) 設(shè)置組件可見,Java的圖形用戶界面,42,

27、Frame Panel,Frame fm1 = new Frame(Hello); fm1.setSize(400,350); fm1.setBackground(Color.gray); fm1.setLayout(null); Panel pn1 = new Panel(); pn1.setSize(100,100); pn1.setBackground(Color.red); pn1.setLocation(0,50); fm1.add(pn1); fm1.setVisible(true);,,Java的圖形用戶界面,43,FlowLayout布局管理器,構(gòu)造方法： FlowLayo

28、ut() ; FlowLayout(int align, int hgap, int vgap)； align ：對(duì)齊方式：LEFT CENTER RIGHT hgap ：組件水平間距 （象素） vgap ：組件垂直間距 無(wú)參數(shù)的構(gòu)造方法創(chuàng)建的FlowLayout對(duì)象，其對(duì)齊方式為CENTER居中方式，組件間的橫縱間距都為5個(gè)像素。,Java的圖形用戶界面,44,FlowLayout布局管理器,Frame f = new Frame(FlowLayout); f.setSize(400,300); //不起作用 f.setBackground(Color.gray); f.setL

29、ayout(new FlowLayout(FlowLayout.LEFT,10,20)); b1 = new Button(button1); b2 = new Button(button2); b3 = new Button(button3); f.add(b1); f.add(b2); f.add(b3); f.setVisible(true); f.pack(); //詢問(wèn)布局管理器窗體大小,,Java的圖形用戶界面,45,BorderLayout布局管理器,setLayout(new BorderLayout() ) add(b1,BorderLayout.NORTH

30、); 當(dāng)容器大小改變，組件相對(duì)位置不會(huì)改變。,Java的圖形用戶界面,46,BorderLayout布局管理器,f = new Frame(BorderLayout); f.setSize(200,200); b1 = new Button(button1); b5 = new Button(button5); f.add(b1,BorderLayout.NORTH); f.add(b2,BorderLayout.SOUTH); f.add(b3,BorderLayout.WEST); f.add(b4,BorderLayout.EAST); f.add(b5,BorderLayout.C

31、ENTER); f.setVisible(true);,Java的圖形用戶界面,47,Border-Panel,class MyFrame extends Frame MyFrame() Button b1 = new Button( 1 ); Button b2 = new Button( 2 ); Button b3 = new Button( 3 ); Button b4 = new Button( 4 ); Panel p = new Panel(); p.add(b1); p.add(b2); add(p,BorderLayout.NORTH); a

32、dd(b3,BorderLayout.WEST); add(b4,BorderLayout.CENTER); pack(); setVisible(true); ,Java的圖形用戶界面,48,GridLayout布局管理器,創(chuàng)建GridLayout對(duì)象作為布局編輯器，指定劃分網(wǎng)格的 行數(shù)和列數(shù)(網(wǎng)格大小一樣）。 setLayout(new GridLayout(行數(shù), 列數(shù))); setLayout(new GridLayout(行數(shù), 列數(shù),行間隔,列間隔)); 調(diào)用容器的方法add()將組件加入容器，組件填入容器 的順序?qū)凑盏谝恍械谝粋€(gè)、第一行第二個(gè)、 每個(gè)網(wǎng)格中都必須填

33、入組件，如果希望某個(gè)網(wǎng)格為空白，可以為它加入一個(gè)空的標(biāo)簽： add (new Label());,Java的圖形用戶界面,49,GridLayout布局管理器,f = new Frame(GridLayout); f.setLayout(new GridLayout(2,3)); f.setSize(200,100); f.setBackground(Color.gray); b1 = new Button(1); b6 = new Button(6); f.add(b1); f.setVisible(true);,Java的圖形用戶界面,50,布局例,Frame fm

34、 = new Frame() fm.setLayout(new FlowLayout()); tf = new TextField(22); fm.add(tf); Panel p1 = new Panel(); p1.setLayout(new GridLayout(4,3)); p1.add(); Panel p2 = new Panel(); p2.setLayout(new GridLayout(4,3)); p2.add(); fm. add(p1); fm. add(p2);,Java的圖形用戶界面,51,GridBagLayout布局管理器,每個(gè)GridBagLayout

35、對(duì)象維護(hù)一個(gè)動(dòng)態(tài)矩形網(wǎng)格， 每個(gè)組件可占據(jù)一個(gè)或多個(gè)單元作為它的顯示區(qū)域。 每一個(gè)組件都與一個(gè)GridBagConstraints類的實(shí)例相連，以指定在顯示區(qū)域中如何擺放,并可確定大小。 步驟： setLayout(new GridBagLayout()); GridBagConstraints gbc = new GridBagConstraints(); gbc.gridx = 0; (屬性賦值) add(button1 , gbc ),Java的圖形用戶界面,52,GridBagLayout布局管理器,設(shè)置GridBagConstraints類實(shí)例屬性值： gridx gridy 組件顯

36、示區(qū)域的左上角單元格坐標(biāo) gridwidth gridheight 指定顯示區(qū)域行、列單元數(shù) RELATIVE 緊挨著前一個(gè)組件擺放 fill 當(dāng)顯示區(qū)域大于組件時(shí)如何擴(kuò)充組件： HORIZONTAL 水平充滿 VERTICAL 垂直充滿 BOTH 全部填充 NONE 不調(diào)整（隱含） ipadx ipady 指定組件間最小間隔 anchor 當(dāng)顯示區(qū)域大于組件時(shí)如何擺放組件(對(duì)齊方式) CENTER（隱含）, NORTH, EAST, SOUTH, WEST, SOUTHEAST, NORTHEAST, SOUTHWEST, NORTHWEST.,Java的圖形用戶界面,53,CardLayo

37、ut布局管理器,使用CardLayout的容器表面可以容納多個(gè)組件，將每 一個(gè)組件視為一張卡片，同一時(shí)刻只能顯示一個(gè)組件。 setLayout(new CardLayout()) CardLayout方法（按序指定組件） first(Containerparent) 顯示第一個(gè)版面的內(nèi)容 last(Containerparent) 顯示最后一個(gè)版面的內(nèi)容 previous(Containerparent) 顯示前一個(gè)版面的內(nèi)容 next(Containerparent) 顯示下一個(gè)版面的內(nèi)容 CardLayout方法(按名顯示組件） addLayoutComponent(Stringname

38、, Componentc) show(Containerparent, Stringname),Java的圖形用戶界面,54,利用AWT創(chuàng)建自己的GUI,GUI外觀設(shè)計(jì) 設(shè)計(jì)標(biāo)準(zhǔn)構(gòu)件層次關(guān)系：構(gòu)件層次結(jié)構(gòu)關(guān)系樹 設(shè)置容器布局策略：setLayout() 生成標(biāo)準(zhǔn)構(gòu)件 向容器中添加組成構(gòu)件：add()方法 構(gòu)件事件處理 例：AWTComponent.java,Java的圖形用戶界面,55,public class AWTComponent extends Frame ... ... ... public AWTComponent() setSize(450,300); //設(shè)置Frame大小

39、 setLayout(new FlowLayout()); //設(shè)置布局 ... ... ... //創(chuàng)建組件 Group1 = new CheckboxGroup(); //創(chuàng)建單選按鈕組 radioButton1 = new Checkbox(male, Group1, false); add(radioButton1); //把組件加入容器 radioButton2 = new Checkbox(female, Group1, false); add(radioButton2); ... ... ... setVisible(true); //顯示容器及組件 ... ... ... ,

40、還缺什么嗎？,Java的圖形用戶界面,56,Java1.0.2的事件處理,使用單一的java.awt.Event類來(lái)接受所有類型的事件； 使用action(), handleEvent( )以及其他的一些事件處理方法（如鼠標(biāo)事件、鍵盤事件、焦點(diǎn)事件）來(lái)進(jìn)行相應(yīng)事件的事件處理。 缺點(diǎn)：造成長(zhǎng)if分支語(yǔ)句組，不利于面向?qū)ο蟮木幊?Java的圖形用戶界面,57,Java1.1 對(duì)事件處理的改進(jìn),引入java.awt.event包 更加面向?qū)ο?，易于理?定義了事件的“發(fā)生者”和“監(jiān)聽者”對(duì)象 按鈕事件、文本事件、選擇事件、調(diào)整事件、 鼠標(biāo)事件、鍵盤事件等 事件以類層次來(lái)表達(dá)，取代了1.0.2中的

41、單一的 類，并可以自定義事件類型,Java的圖形用戶界面,58,事件及處理機(jī)制,用戶操作GUI組件時(shí)會(huì)引發(fā)各種事件。 事件 ：描述“發(fā)生了什么事情”的對(duì)象。 系統(tǒng)根據(jù)用戶的操作構(gòu)造出相應(yīng)事件類的對(duì)象。 事件源：事件的產(chǎn)生地。 事件處理程序：是一個(gè)方法，它接收一個(gè)事件對(duì)象、 分析它、并完成對(duì)該事件的處理。 每個(gè)事件有一個(gè)相應(yīng)的監(jiān)聽者接口，它規(guī)定了能夠接收（并處理）該類事件的方法的規(guī)范。 監(jiān)聽者：實(shí)現(xiàn)了監(jiān)聽者接口的類，它包含有事件處理 程序。 編程人員要為事件源指定監(jiān)聽者對(duì)象（即指定處理某種事件的事件處理程序）。,Java的圖形用戶界面,59,事件處理機(jī)制,組件

42、（事件發(fā)生者）觸發(fā)一個(gè)相應(yīng)類型的事 件 此事件由相應(yīng)類型的Listener（事件監(jiān)聽者） 接收并處理,,Java的圖形用戶界面,60,事件及處理機(jī)制,調(diào)用按扭的 addActionListener ( ) 方法，為該按扭指定監(jiān)聽者。,Java的圖形用戶界面,61,幾個(gè)有用的概念,事件 在java.awt.event包中定義了若干類型 的事件類 監(jiān)聽者接口 特定類型的Listener接口，用于 監(jiān)聽特定類型的事件 監(jiān)聽者類 是實(shí)現(xiàn)了某種監(jiān)聽者接口的類，由編程者定義 事件監(jiān)聽者 是某個(gè)監(jiān)聽者類的對(duì)象，由編 程者使用new創(chuàng)建,Java的圖形用戶界面,62,實(shí)現(xiàn)步驟,根據(jù)需要定義

43、相應(yīng)類型的監(jiān)聽者類，在類的 定義中完成事件的處理（建議使用inner class 定義）； 創(chuàng)建事件監(jiān)聽者對(duì)象； 為將會(huì)觸發(fā)事件的組件C注冊(cè)相應(yīng)的事件監(jiān)聽 者對(duì)象（使用C的addXXXListener()方法）。 例：ButtonAct.java,Java的圖形用戶界面,63,public class ButtonAct extends Frame ... ... ... public ButtonAct() ... ... ... //為b1注冊(cè)事件監(jiān)聽者B1 b1.addActionListener(new B1()); add(b1); ... ... ... //利用inne

44、r class結(jié)構(gòu)定義監(jiān)聽者類 class B1 implements ActionListener //利用actionPerformed方法進(jìn)行事件處理 public void actionPerformed(ActionEvent e) who.setText(Button 1); ... ... ... ///:,Java的圖形用戶界面,64,事件與監(jiān)聽者類型,XXXListener接口與XXXEvent XXX為特定類型 常用類型： Action, Focus, Key, Window, MouseEvent vs. Mouse/MouseMotionList

45、ener 注冊(cè)與取消：組件包含的新方法 addXXXListener()與removeXXXListener() 參考：eventtables.html,Java的圖形用戶界面,65,監(jiān)聽者接口中有什么？,每種Listener接口均定義了一套abstract方法， 編程者必須在監(jiān)聽者類中實(shí)現(xiàn)這些方法來(lái)做事 件處理； 例： ActionListener: actionPerformed() WindowListener:windowOpened/Closing/Closed/Activated/ Deactivated/Iconified/Deiconified(),Java的圖形用戶界面

46、,66,使用Listener Adapter,由于接口中的方法為abstract方法，所以在監(jiān)聽者類中要實(shí)現(xiàn)所有的方法，較為煩瑣。 為了簡(jiǎn)化編程，引入了Adapter。具有兩個(gè)以上方法的監(jiān)聽者接口均對(duì)應(yīng)一個(gè)XXXAdapter類，提供了接口中每個(gè)方法的缺省實(shí)現(xiàn)。,Java的圖形用戶界面,67,使用Listener Adapter（續(xù)）,例： class MyWindowListener extends WindowAdapter public void windowClosing(WindowEvent e) System.exit(0); 參考：Listener.html 例：Doub

47、leClick.java（相應(yīng)鼠標(biāo)事件）,Java的圖形用戶界面,68,public class DoubleClick extends Frame Vector m_vLocs; //保存鼠標(biāo)單擊過(guò)的各點(diǎn), 用以繪制各點(diǎn)連線 Point m_CursorLoc; //跟蹤當(dāng)前鼠標(biāo)位置, 用以繪制十字光標(biāo) public DoubleClick() m_vLocs = new Vector(); m_CursorLoc = new Point(100,100); setSize(400, 400); //為Frame注冊(cè)3個(gè)事件監(jiān)聽者 addMouseListener(new click(

48、)); addMouseMotionListener(new move()); addWindowListener(new wd()); public void paint(Graphics g) //繪制十字光標(biāo), 連接各點(diǎn) ,Java的圖形用戶界面,69,class click extends MouseAdapter //鼠標(biāo)事件監(jiān)聽者類 public void mouseClicked(MouseEvent e) //響應(yīng)點(diǎn)擊 if(e.getClickCount()1) //雙擊時(shí)清除向量中各點(diǎn) m_vLocs.removeAllElements(); else //單擊時(shí)在

49、向量中增加一點(diǎn) m_vLocs.addElement(e.getPoint()); repaint(); //重新繪制一次 class move extends MouseMotionAdapter//鼠標(biāo)移動(dòng)監(jiān)聽者類 public void mouseMoved(MouseEvent e) //響應(yīng)移動(dòng) m_CursorLoc = new Point(e.getX(),e.getY()); repaint(); //重新繪制一次 ,Java的圖形用戶界面,70,事件類,ActionEvent類：屬于動(dòng)作事件，包括：點(diǎn)擊按鈕；雙擊一個(gè)列表中的選項(xiàng);選擇菜單項(xiàng)；在文本框中

50、按回車。最典型的例子是：鼠標(biāo)點(diǎn)擊按鈕所產(chǎn)生的事件，經(jīng)ActionListener接口觸發(fā)一連串動(dòng)作，再由actionPerformed()方法完成這些動(dòng)作。 e.getSource() 返回事件發(fā)生的對(duì)象(名) e.getActionCommand() 返回按扭名(動(dòng)作事 件的命令字符串)。 ActionListener 接口 public void actionPerformed(ActionEvent e),Java的圖形用戶界面,71,圖形用戶界面例,import java.awt.*; import java.awt.event.*; public class a

51、 public static void main(String args) MyFrame form1 = new MyFrame(); class MyFrame extends Frame MyFrame() super(窗口標(biāo)題); setSize(200,100); setFont(new Font(TimesRoman,Font.BOLD,20));,Java的圖形用戶界面,72,圖形用戶界面例,setLayout(new FlowLayout()); Button b = new Button(close); add(b); b.addActionListen

52、er(new Bprocess()); setVisible(true); class Bprocess implements ActionListener public void actionPerformed(ActionEvent e) System.exit(0); ,Java的圖形用戶界面,73,監(jiān)聽者類,某個(gè)類可以兼職也可以專職做這件事（實(shí)現(xiàn)監(jiān)聽者接口）。 一個(gè)類若實(shí)現(xiàn)一個(gè)接口，必須實(shí)現(xiàn)接口的全部方法。 例如：ActionListener接口只有一個(gè)方法： void actionPerformed(ActionEvent e) 實(shí)現(xiàn)接口的類可以是： 一般

53、類 內(nèi)部類 匿名類,Java的圖形用戶界面,74,事件處理有關(guān)問(wèn)題,有哪些事件類 (java.awt.event) ？ 每個(gè)事件類的監(jiān)聽者接口？ 每個(gè)監(jiān)聽者接口規(guī)定的方法？ 多方法的監(jiān)聽者接口的適配器（實(shí)現(xiàn)接口的抽象類）是什么？ 組件的事件委托（注冊(cè)）方法？,Java的圖形用戶界面,75,窗口事件,關(guān)閉窗口框時(shí)引發(fā) WindowEvent事件 委托 addWindowListener(new Wclose()); 定義監(jiān)聽者類 class Wclose implements WindowListener public void windowClosing(WindowEvent e)

54、System.exit(0); WindowListener類有7 個(gè)方法，必須都實(shí)現(xiàn) WindowAdapter 接收窗口事件的抽象適配器類，用空內(nèi)容實(shí)現(xiàn)了WindowListener接口的所有方法 class Wclose extends WindowAdapter ,Java的圖形用戶界面,76,ActionEvent動(dòng)作事件,引發(fā)原因： 單擊按扭，雙擊列表框中選項(xiàng)，選擇菜單項(xiàng)，文本框中的回車 事件監(jiān)聽接口：ActionListener 接口方法： actionPerformed(ActionEvent e) 組件注冊(cè)該事件方法： addActionListener(監(jiān)聽者）,Jav

55、a的圖形用戶界面,77,TextEvent文本事件,引發(fā)原因： 文本框或文本區(qū)域內(nèi)容改變 事件監(jiān)聽接口：TextListener 接口方法： textValueChanged(TextEvente) 組件注冊(cè)該事件方法： addTextListener(監(jiān)聽者）,Java的圖形用戶界面,78,ItemEvent選擇事件,引發(fā)原因： 改變列表框中的選中項(xiàng) 改變復(fù)選框選中狀態(tài) 改變下拉選單的選中項(xiàng) 事件監(jiān)聽接口：ItemListener 接口方法： itemStateChanged(ItemEvente) 組件注冊(cè)該事件方法： addItemListener(監(jiān)聽者）,Java的圖形用戶界面,79

56、,AdjustmentEvent調(diào)整事件,引發(fā)原因： 操作滾動(dòng)條改變滑塊位置 事件監(jiān)聽接口：AdjustmentListener 接口方法： adjustmentValueChanged(AdjustmentEvente) 組件注冊(cè)該事件方法： addAdjustmentListener(監(jiān)聽者）,Java的圖形用戶界面,80,KeyEvent事件,引發(fā)原因： 敲完鍵（KEY-TYPED) 按下鍵 (KEY-PRESSED) 釋放鍵 (KEY-RELEASE) 事件監(jiān)聽接口：KeyListener 接口方法： keyPressed(KeyEvente) 鍵已被按下時(shí)調(diào)用 keyRelea

57、sed(KeyEvente) 鍵已被釋放時(shí)調(diào)用 keyTyped(KeyEvente) 鍵已被敲完時(shí)調(diào)用 KeyEvent方法：char ch = e.getKeyChar(); 事件監(jiān)聽適配器（抽象類）KeyAdapter 組件注冊(cè)該事件方法： addKeyListener(監(jiān)聽者）,Java的圖形用戶界面,81,MouseEvent事件,引發(fā)原因: (鼠標(biāo)作用在一個(gè)組件上) 鼠標(biāo)事件: 鼠標(biāo)鍵按下，鼠標(biāo)鍵抬起，單擊鼠標(biāo) ， 鼠標(biāo)光標(biāo)進(jìn)入一個(gè)組件，鼠標(biāo)光標(biāo)離開一個(gè)組件。 鼠標(biāo)移動(dòng)事件: 鼠標(biāo)移動(dòng)，鼠標(biāo)拖動(dòng) 鼠標(biāo)事件監(jiān)聽接口1: MouseListener 接受鼠標(biāo)事件

58、該接口方法: mouseClicked(MouseEvente) mouseEntered(MouseEvente) 鼠標(biāo)光標(biāo)進(jìn)入一個(gè)組件 mouseExited(MouseEvente) 鼠標(biāo)光標(biāo)離開一個(gè)組件,Java的圖形用戶界面,82,MouseEvent事件（續(xù)）,鼠標(biāo)事件監(jiān)聽適配器（抽象類）MouseAdapter 鼠標(biāo)事件監(jiān)聽接口2: MouseMotionListener 接受鼠標(biāo)移動(dòng)事件 該接口方法： mouseMoved(MouseEvente) 鼠標(biāo)光標(biāo)在組件上移動(dòng) mouseDragged(MouseEvente) 用鼠標(biāo)拖動(dòng)一個(gè)組件 鼠標(biāo)移動(dòng)事件監(jiān)聽適配器 Mous

59、eMotionAdapter 組件注冊(cè)鼠標(biāo)事件方法: addMouseListener(監(jiān)聽者） 組件注冊(cè)鼠標(biāo)移動(dòng)事件方法: addMouseMotionListener(監(jiān)聽者）,Java的圖形用戶界面,83,MouseEvent事件（續(xù)）,MouseEvent方法 e.getClickCount() =1 單擊 =2 雙擊 Point e.getPoint() 取鼠標(biāo)光標(biāo)位置 int e.getX() int e.getY() 取鼠標(biāo)光標(biāo)位置 e.getModifiers() = e.BUTTON1_MASK 鼠標(biāo)左鍵 = e.BUTTON3_M

60、ASK 鼠標(biāo)右鍵,Java的圖形用戶界面,84,WindowEvent事件,引發(fā)原因： 有關(guān)窗口操作引發(fā)的事件 事件監(jiān)聽接口WindowListener 接口方法 windowActivated(WindowEvente) 激活窗口 windowClosed(WindowEvente) 調(diào)用dispose方法關(guān)閉窗口后 windowClosing(WindowEvente) 窗口正在被關(guān)閉(試圖利用窗口關(guān)閉按鈕關(guān)閉窗口) windowDeactivated(WindowEvente) 本窗口成為非活動(dòng)窗口,Java的圖形用戶界面,85,WindowEvent事件(續(xù)）,windowDe

61、iconified(WindowEvente) 窗口從最小化恢復(fù)為普通窗口 windowIconified(WindowEvente) 窗口變?yōu)樽钚』瘓D標(biāo) windowOpened(WindowEvente) 窗口被打開成為可見時(shí) 接口適配器 WindowAdapter 注冊(cè)事件方法 addWindowListener,Java的圖形用戶界面,86,FocusEvent事件,引發(fā)原因： 組件獲得焦點(diǎn) 組件失去焦點(diǎn) 事件監(jiān)聽接口 FocusListener 接口方法： focusGained(FocusEvent e) 組件獲得焦點(diǎn)時(shí)調(diào)用 focusLost(FocusEvente)

62、組件失去焦點(diǎn)時(shí)調(diào)用 接口適配器：FocusAdapter 組件注冊(cè)該事件方法：addFocusListener,Java的圖形用戶界面,87,TextEvent事件,引發(fā)原因： 當(dāng)組件（如文本框）文本改變時(shí)引發(fā) 事件監(jiān)聽接口：TextListener 接口方法： textValueChanged(TextEvente) 組件注冊(cè)該事件方法： addTextListener,Java的圖形用戶界面,88,ComponentEvent 事件,引發(fā)原因： 當(dāng)組件移動(dòng)、改變大小、改變可見性時(shí)引發(fā) 事件監(jiān)聽接口：ComponentListener 接口方法： componentHidden(Compon

63、entEvent e) 組件隱藏 componentMoved(ComponentEvente) 組件移動(dòng) componentResized(ComponentEvente) 組件改變大小 componentShown(ComponentEvente) 組件變?yōu)榭梢?接口適配器 ComponentAdapter 組件注冊(cè)該事件方法： addComponentListener,Java的圖形用戶界面,89,ContainerEvent 事件,引發(fā)原因： 當(dāng)容器內(nèi)增加或移走組件時(shí)引發(fā) 事件監(jiān)聽接口：ContainerListener 接口方法 componentAdded(ContainerEve

64、nte) 容器內(nèi)加入組件 componentRemoved(ContainerEvente) 從容器中移走 組件 接口適配器 ContainerAdapter 容器注冊(cè)該事件方法： addContainerListener,Java的圖形用戶界面,90,GUI標(biāo)準(zhǔn)組件,Label(標(biāo)簽) 構(gòu)造方法 Label myl = new Label(“標(biāo)簽內(nèi)容”); Label a = new Label(“information”); Label a = new Label(“information”, Label.CENTER); 方法 a.setText

65、(“新內(nèi)容”); 設(shè)置標(biāo)簽內(nèi)容 String a.getText() 讀取標(biāo)簽內(nèi)容 Button(按鈕) Button myB1 = new Button(); Button myB2 = new Button(“Cancel”);,Java的圖形用戶界面,91,GUI標(biāo)準(zhǔn)組件,Checkbox(檢測(cè)盒) 創(chuàng)建時(shí)指定檢測(cè)盒的標(biāo)簽 Checkbox cb1 = new Checkbox (); Checkbox cb2 = new Checkbox (“registered”); Checkbox cb3 = new Checkbox (“registered”, true);

66、Checkbox cb4 = new Checkbox (“registered”, true, group); 獲取和設(shè)置檢測(cè)盒的狀態(tài) cb.setState(true); boolean b=cb.getState();,,Java的圖形用戶界面,92,Checkbox組件,構(gòu)造方法 Checkbox(Stringlabel) Checkbox(Stringlabel, booleanstate) Checkbox(Stringlabel, booleanstate, CheckboxGroupgroup ) 方法： boolean getState() setState(booleanstate),Java的圖形用戶界面,93,GUI標(biāo)準(zhǔn)組件,CheckboxGroup(單選按鈕組) 單選按鈕組是一組Checkbox的集合，是將一組 Checkbox 按扭組成單選按扭組件 首先創(chuàng)建CheckboxGroup,再加入單個(gè)按鈕 方法： Checkbox getSelectedCheckbox() 取得目前選取的復(fù)選框?qū)ο?setSelectedCheckbox(Che