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

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

1、1 Java語言程序設(shè)計(jì)劉玉江 2 1.概述2.事件處理3.基本控制組件4.布局設(shè)計(jì)5.常用容器組件第五章 圖形用戶界面設(shè)計(jì) 3 概述n圖形用戶界面(Graphics User Interface)圖形用戶界面：由菜單、按鈕等圖形界面組件構(gòu)成，用戶通過鍵盤和鼠標(biāo)與程序進(jìn)行交互。GUI組件：是圖形用戶界面的基本元素，可實(shí)現(xiàn)用戶與程序交互。容器：組件放置的地方，我們可以在容器中放入一些GUI組件，如按鈕、菜單等，從而組成一個(gè)人機(jī)界面非常友好的程序。(包括：Applet、Panel、Frame等） 4容器（container） 圖形用戶界面（GUI）文本框標(biāo)簽按鈕GUI組件 5 圖形用戶界面的構(gòu)成n

2、什么是組件?n構(gòu)成圖形用戶界面的元素，拿來即用n用圖形表示(能在屏幕上顯示，能和用戶進(jìn)行交互)n Button、Checkbox、Scrollbar、Choice、Frame 6 圖形用戶界面的構(gòu)成n一些特定的Java類n java.awt包n javax.swing包n容器組件(Container): 可包含其他組件n頂層容器: Applet, Dialog, Frame, Windown一般用途容器: Panel, ScrollPanen特定用途容器: InternalFramen非容器組件: 必須要包含在容器中n Button, Checkbox, Scrollbar, Choice,

3、Canvas 7 圖形用戶界面的實(shí)現(xiàn)(P192)1.選取組件2.設(shè)計(jì)布局3.響應(yīng)事件n應(yīng)用原則n Swing比AWT提供更全面、更豐富的圖形界面設(shè)計(jì)功能n Java 2平臺(tái)支持AWT組件，但鼓勵(lì)用Swing組件n主要講述AWT和Swing的圖形界面設(shè)計(jì) 8 圖形用戶界面的實(shí)現(xiàn)n簡單實(shí)例import javax.swing.*; import java.awt.event.*; public class HelloWorldSwing public static void main(String args) JFrame f = new JFrame(“Swing1); JLabel label

4、 = new JLabel(Hello!); f.getContentPane().add(label); f.addWindowListener(new WindowAdapter() public void windowClosing(WindowEvent e) System.exit(0); ); f.setSize(200, 200); f.setVisible(true); import java.awt.*; import java.awt.event.*; public class HelloWorldAWT public static void main(String arg

5、s) Frame f = new Frame(AWT1); Label label = new Label(Hello!); f.add(label); f.addWindowListener(new WindowAdapter() public void windowClosing(WindowEvent e) System.exit(0); ); f.setSize(200, 200); f.setVisible(true); 9 1.概述2.事件處理3.基本控制組件4.布局設(shè)計(jì)5.常用容器組件第五章 圖形用戶界面設(shè)計(jì) 10 事件處理n界面設(shè)計(jì) (靜態(tài))n界面動(dòng)起來 !n通過事件觸發(fā)對象的

6、響應(yīng)機(jī)制n事件? 鼠標(biāo)移動(dòng)、鼠標(biāo)點(diǎn)擊、鍵盤鍵入等n事件處理機(jī)制n事件源n事件對象n事件監(jiān)聽者n如何實(shí)現(xiàn)1.實(shí)現(xiàn)(implements)事件監(jiān)聽接口(interface)產(chǎn)生一個(gè)監(jiān)聽器對象(Listener)2.監(jiān)聽誰? 將該監(jiān)聽器對象注冊到組件對象中 3.編寫事件響應(yīng)方法 11 3.實(shí)現(xiàn)事件處理的步驟 1)定義類實(shí)現(xiàn)事件監(jiān)聽器接口 2)將產(chǎn)生事件的組件注冊為事件監(jiān)聽器 3) 實(shí)現(xiàn)處理事件接口的抽象方法 12 要建立處理事件的類，需要說明類實(shí)現(xiàn)事件監(jiān)聽器接口，說明格式如下： public class 類名 implements 監(jiān)聽器接口名列表例如，ActionListener是動(dòng)作事件監(jiān)聽器接

7、口，定義如下： interface ActionListener public abstract void actionPerformed(ActionEvent e)； 如果名為Myclass的類要處理動(dòng)作事件，就要定義Myclass類實(shí)現(xiàn)ActionListener接口。1)定義類實(shí)現(xiàn)事件監(jiān)聽器接口 13 如果希望組件產(chǎn)生事件時(shí)能夠得到響應(yīng)，應(yīng)將產(chǎn)生事件的組件注冊為事件監(jiān)聽器，注冊的語句如下： 組件名addXXXListener(實(shí)現(xiàn)事件監(jiān)聽器接口的類對象)； XXX代表事件類型。例如，假設(shè)Myclass是實(shí)現(xiàn)ActionListener接口的類。將Myclass類對象注冊為事件監(jiān)聽器，對

8、應(yīng)語句如下： 組件名addActionListener(new Myclass()；也可以使用關(guān)鍵字this。例如，組件名addActionListener(this)。2)將產(chǎn)生事件的組件注冊為事件監(jiān)聽器 14 在實(shí)現(xiàn)事件監(jiān)聽器接口的類中為抽象方法編寫代碼。例如，在Myclass類中為ActionListener接口的actionPerformed()方法編寫語句。 public void actionPerformed(ActionEvent e) 填寫處理動(dòng)作事件的語句3)實(shí)現(xiàn)處理事件接口的抽象方法 15 以按鈕類為例說明相應(yīng)的事件處理過程(P197)Button button1 = n

9、ew Button(”提交”);button1.addActionListener(this); /在init()中實(shí)現(xiàn)監(jiān)聽器對象this必須實(shí)現(xiàn)相應(yīng)的接口，來響應(yīng)事件：public class C1 implements ActionListener.public void init() . button1.addActionListener(this);public void actionPerformed(ActionEvent event) 相應(yīng)的響應(yīng)操作 16 第五章 圖形用戶界面設(shè)計(jì)1.概述2.事件處理3.基本控制組件4.布局設(shè)計(jì)5.常用容器組件 17 例：import java.

10、applet.Applet; import java.awt.*;import java.awt.event.*;public class Mouse1 extends Applet implements MouseListenerint x,y;TextField t1=new TextField(12);public void init() add(t1); addMouseListener(this);public void mousePressed(MouseEvent e)x=e.getX();y=e.getY();t1.setText(坐標(biāo)值：+Integer.toString(x

11、)+,+Integer.toString(y);public void mouseClicked(MouseEvent e)public void mouseEntered(MouseEvent e) public void mouseReleased(MouseEvent e)public void mouseExited(MouseEvent e) 18 AWT組件 (java.awt.*)Component Button Canvas ChoiceCheckBoxLabelList TextComponentScrollbar TextFieldTextArea Container Sc

12、rollPane FrameFileDialogPanelWindow DialogApplet 19 基本控制組件n使用步驟:n創(chuàng)建基本控制組件類的對象，指定對象屬性；n將組件對象加入到制定容器的適當(dāng)位置(布局設(shè)計(jì))；n創(chuàng)建事件對象的監(jiān)聽者。n Swing組件(javax.swing.*) 20 按鈕和標(biāo)簽n按鈕(Button)n創(chuàng)建按鈕n public Button()n public Button(String label)n常用方法 n public String getLabel()n public void setLabel(String label)n public void s

13、etActionCommand(String s)n public String getActionCommand(String s)n事件響應(yīng)n java.awt.event.ActionListener(接口)n void actionPerformed(ActionEvent e) 21 按鈕和標(biāo)簽n標(biāo)簽(Label)n創(chuàng)建標(biāo)簽n public Label()n public Label(String s)n public Label(String s, int alignment)n常用方法 n public String getText()n public void setText(

14、String s)n public void setAlignment(int alignment)n事件響應(yīng)n不引發(fā)事件 22 使用標(biāo)簽的例子import java.awt.*;import java.applet.*;public class Exam5_3 extends Applet Label lab1, lab2;TextField text1, text2;public void init() lab1 = new Label(“輸入姓名”);lab2 = new Label(“輸入年齡”);lab1.setBackground(Color.red);lab2.setBackgr

15、ound(Color.green);text1 = new TextField(10);text2 = new TextField(10); add(lab1); add(text1);add(lab2);add(text2); 23 使用標(biāo)簽的例子 24 文本框和文本區(qū)n文本框(TextField)n TextComponent類的子類n創(chuàng)建文本框n public TextField()n public TextField(int size) n public TextField(String s)n public TextField(String s, int size)n常用方法n pu

16、blic void setText(String s)n public String getText()n public void setEchochar(char c)n public void setEditable(boolean b)n事件響應(yīng) n java.awt.event.TextListener(接口)n java.awt.event.ActionListener(接口) 25 文本框和文本區(qū)n文本區(qū)(TextArea)n TextComponent類的子類n創(chuàng)建文本區(qū)n public TextArea()n public TextArea(String s) n public

17、 TextArea(int rows, int columns)n public TextArea(String s, int rows, int columns)n public TextArea(String s, int rows, int columns, int scrollbars)n SCROLLBARS_BOTH, SCROLLBARS_NONEn SCROLLBARS_VERTICAL_ONLYn SCROLLBARS_HORIZONTAL_ONLYn常用方法n public void append(String s) n public void insert(String

18、s, int index)n pubilc void replaceRange(String s, int start, int end)n事件響應(yīng)n java.awt.event.TextListener(接口)n void textValueChanged(TextEvent e) 26 使用文本框的例子import java.awt.*;import java.awt.event.*;import java.applet.*;public class Exam5_4 extends Applet implements ActionListenerLabel lab1, lab2, lab

19、3;TextField text1, text2, text3;String str; int i; float f;public void init() lab1 = new Label(“輸入整形數(shù): ”); add(lab1);text1 = new TextField(“0”, 30);text1.addActionListener(this); add(text1);lab2 = new Label(“輸入浮點(diǎn)數(shù): ”); add(lab2);text2 = new TextField(“0.0”, 30); text2.addActionListener(this); add(te

20、xt2);lab3 = new Label(“輸入字符串: ”); add(lab3);text3 = new TextField(“0.0”, 30);text3.addActionListener(this); add(text3); 27 使用文本框的例子public void actionPerformed(ActionEvent e) i = Integer.parseInt(text1.getText();f = (Float.valueOf(text2.getText().floatValue();str = text3.getText();repaint();public vo

21、id paint(Graphics g) g.drawString(“整形數(shù)=” + i, 20, 120);g.drawString(“浮點(diǎn)數(shù)=” + f, 20, 150);g.drawString(“字符串=” + str, 20, 180); 28 單復(fù)選框和列表n復(fù)選框(Checkbox)n創(chuàng)建復(fù)選框n public Checkbox()n public Checkbox(String s) n public TextField(String s, boolean state)n常用方法n public boolean getState()n public void setState

22、(boolean b)n public void setLabel(String s)n public String getLabel()n事件響應(yīng) n java.awt.event.ItemListener(接口)n void itemStateChanged(ItemEvent e) 29 單復(fù)選框和列表n單選按鈕組(CheckboxGroup)n創(chuàng)建單選按鈕組n public Checkbox(String label, boolean state, CheckboxGroup group)n public Checkbox(String label, CheckboxGroup gro

23、up, boolean state)n常用方法 n與復(fù)選框相同n事件響應(yīng)n與復(fù)選框相同 30 單復(fù)選框和列表n列表(List)n創(chuàng)建列表n public List()n public List(int n)n public List(int n, boolean b)n常用方法 n public void add(String s)n public void add(String s, int n)n public void remove(int n)n public void removeAll()n public int getSelectedIndex()n public String

24、getSelectedItem()n事件響應(yīng) n java.awt.event.ItemListener(接口)n java.awt.event.ActionListener(接口) 31 下拉列表和滾動(dòng)條n下拉列表(Choice)n創(chuàng)建下拉列表n public Choice()n常用方法n public int getSelectedIndex() n public String getSelectedItem()n public void select(int index)n public void select(String item)n public void add(String s

25、)n public void add(String s, int index)n public void remove(int index)n public void remove(String item) n public void removeAll()n事件響應(yīng)n java.awt.event.ItemListener(接口) 32 下拉列表和滾動(dòng)條n滾動(dòng)條(Scrollbar)n創(chuàng)建滾動(dòng)條n public Scrollbar(int orientation, int value, int visible, int minimum, int maximum)n常用方法 n public

26、void setUnitIncrement(int n)n public void setBlockIncrement(int n)n public int getUnitIncrement()n public int getBlockIncrement()n public int getValue()n事件響應(yīng)n java.awt.event.AdjustmentListener(接口) n void adjustmentValueChanged(AdjustmentEvent e) 33 使用下拉列表的例子import java.awt.*;import java.awt.event.*;

27、import java.applet.*;public class Exam5_8 extends Applet implements ItemListener Choice cho; TextField text;public void init() text = new TextField(10);cho = new Choice();cho.add(“red”);cho.add(“yellow”);cho.add(“green”);cho.add(“blue”);add(cho); add(text);cho.addItemListener(this);public void itemS

28、tateChanged(ItemEvent e) if(e.getItemSelectable() = cho) String s = cho.getSelectedItem(); text.setText(s); 34 使用下列列表例子 35 畫布n畫布(Canvas)n創(chuàng)建畫布n public Canvas()n常用方法 n public void setSize()n public void paint(Graphics g)n事件響應(yīng)n java.awt.event.MouseMotionListener(接口)n java.awt.event.MouseListener(接口)n j

29、ava.awt.event.KeyListener(接口) 36 1.概述2.事件處理3.基本控制組件4.布局設(shè)計(jì)5.常用容器組件第五章 圖形用戶界面設(shè)計(jì) 37 布局管理n決定組件在界面中所處的位置和大小 目的：在含有組件比較多的容器中，將各組件 擺放整齊。分類： 1、順序布局（FlowLayout） 2、邊界布局（BorderLayout） 3、卡片布局（CardLayout） 4、網(wǎng)格布局（GridLayout） 38 第五章 圖形用戶界面設(shè)計(jì)1.概述2.事件處理3.基本控制組件4.布局設(shè)計(jì)5.常用容器組件 39 概述n容器n可包含其他組件和容器n Container類的子類n無邊框容器:

30、 Panel, Appletn有邊框容器: Window, Frame, Dialog, FieldDialogn可自動(dòng)處理滾動(dòng)操作的容器: Scrollpane ContainerScrollPane Frame FileDialogPanel Window DialogApplet 40 容器n常用方法n添加組件: add()n獲取制定的組件n getComponent(int x, int y) n getComponent(int index)n從容器中移出組件n remove(Component c)n remove(int index)n removeAll()n設(shè)置容器布局: setLayout() 41 容器n面板(Panel)n無邊框容器n順序布局(FlowLayout)n Applet子類 42 窗口和菜單n java.awt.Window: 最頂層容器n Window(Frame f)n show()n BorderLayout布局n java.awt.Frame: 有邊框容器n BorderLayout布局注意：Window只能依附Frame存在。 43 作業(yè)：1.Java布局方法包括幾種？2.P261 54