最新图形用户界面设计PPT课件.ppt

《最新图形用户界面设计PPT课件.ppt》由会员分享，可在线阅读，更多相关《最新图形用户界面设计PPT课件.ppt（108页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、4 4Java的图形用户界面2主要内容4 Java的GUI简介4 自定义图形设计 图形、文字、图象4 Java的标准组件 容器和组件 GUI的布局4 事件处理4 44 44 44 44 44 44 4Java的图形用户界面9图形用户界面（GUI）4Java的图形用户界面编程： 为方便图形用户界面的开发，设计了专门的类库 来生成各种标准图形界面元素和处理图形界面的 各种事件，这个用来生成图形界面的类库就是java.awt包。AWT是abstract window toolkit抽象窗 口工具集的缩写。 AWT类库中的各种操作被定义在一个窗口中进行，开发人员用AWT开发出的图形用户界面可以适用于所

2、有的平台系统。4 4Java的图形用户界面10AWT包4Abstract Window Toolkit(抽象窗口工具集) 提供各种构成GUI的标准构件。 AWT类库中的各种操作被定义在一个窗口中进行的。 抽取不同软硬件平台中所实现的窗口的公共特性。 依赖于具体平台系统实现：显示效果可能不同。4提供与机器无关的基本GUI标准组件 选择类组件：单选按钮、复选框、下拉选单、 列表框 文字处理类组件：标签、文本框、编辑框。 命令类组件：按钮、工具栏、菜单等。4 4Java的图形用户界面11从一个简单窗口开始4创建GUI应用程序 Frame必不可少 它是带标题的顶层窗口,是构建应用程序图形界面的基础,它

3、为应用程序实现人机交互提供了对话窗口4先来建一个空的窗口应用: Empty.java 注意：一定要处理关闭窗口的事件4 4Java的图形用户界面12import java.awt.*; /must import to use GUI /must extends Frame in an applicationpublic class Empty extends Frame / 暂时采用1.0.2的事件处理方法，关闭窗口 public boolean handleEvent(Event evt) /根据Event类中参数evt的id值来判断发生事件的种类 if(evt.id= =Event.WIN

4、DOW_DESTROY) System.exit(0); / return的返回值表示将余下的事件处理交给handleEvent( )的父 / 类处理，从而保证对事件的正常处理 return super.handleEvent(evt); public static void main(String args)Frame f=new Empty();f.setSize(300,200);f.setVisible(true); 4 4Java的图形用户界面13绘制用户自定义成分4用户自定义成分属于构成GUI的非标准部分 无法响应用户事件 一般仅仅起背景装饰、输出效果突出的作用4Java中的用户自

5、定义成分 显示文字 绘制图形 显示图片4 4Java的图形用户界面14绘制用户自定义成分4一般在容器中(窗口)或画布上绘制。4利用Java.awt类库中的类及其方法绘制用户自定义的图形界面成分。 4Graphics类包含很多绘制图形和文字的方法 。4首先要获得Graphics类的实例，然后利用其方法绘制。4Graphics类的实例一般作为相关方法的参数传递进来： paint(Graphics g)4Java程序图形界面的 坐标设置原点(0,0)X轴Y轴4 4Java的图形用户界面15绘制图形及其相关方法4drawLine(x1,y1,x2,y2) /直线4drawRect(x,y,w,h) /

6、矩形4drawOval(x,y,w,h) /圆或椭圆4fillOval(x,y,w,h) /实心圆或椭圆4drawPolygon(X坐标数组，Y坐标数组，顶点个数) /画多边形4drawArc (x,y,w,h,开始角度，弧度角度) 4setColor(Color c) /设置颜色4setFont(Font f) /设置字体4getColor()4getFont()4 4Java的图形用户界面16绘制图形及其相关方法4从(x1,y1)到(x2,y2)画直线 drawLine(x1,y1,x2,y2) 参数均为int4画弧线drawArc(x,y,w,h,) 参数均为int x,y为绘制弧形的左

7、上角的坐标； w,h为弧形的宽度和高度；为弧形的起始角，为弧形的弧度， 为正，表顺时针方向； 为负，表逆时针方向。4以(x,y)为左上角、w为宽度、h为高度画矩形 drawRect(x,y,w,h) 参数均为int4fillRect(x,y,w,h)、clearRect(x,y,w,h)4 4Java的图形用户界面17绘制图形及其相关方法4画圆或椭圆 drawOval(x,y,w,h) x,y为绘制圆或椭圆的左上角的坐标，w,h确定了 椭圆的宽度和高度4画实心圆或椭圆 fillOval(x,y,w,h)4画多边形 drawPolygon(X坐标数组，Y坐标数组，顶点个数) P.1854 4Ja

8、va的图形用户界面18绘制图形及其相关方法例子： sanmao.java4 4Java的图形用户界面19 /画头部,椭圆方法drawOvalg.setColor(Color.black); /setColor用来设置要使用的颜色 g.drawOval(40,40,120,150);./画头发,直线方法drawLine,画弧方法drawArcg.drawLine(100,10,100,60);g.drawArc(110,20,100,80,90,90);./画嘴巴,填充画弧方法fillArcg.fillArc(60,130,80,40,180,180);./画耳朵,填充椭圆方法fillOval,

9、复制图形方法copyAreag.fillOval(25,92,15,30);g.copyArea(25,92,15,30,136,0); /拷贝某区域的图形至另一区域./画身体,多边形方法fillPolygong.fillPolygon(polygon_x,polygon_y,polygon_pt_num);4 4Java的图形用户界面20显示文字4字体显示效果类：Font 一个Font类的对象表示了一种字体显示效果，包括字体类型、风格和字号。 Font mf = new Font(String 字体，int 风格，int 字号); 字体：TimesRoman, Courier, Arial等

10、 风格：三个常量 Font.PLAIN, Font.BOLD, Font.ITALIC 字号：字的大小（磅数） 设置当前使用的字体：setFont(Font fn) 获取当前使用的字体：getFont()4例：UseFonts.java4 4Java的图形用户界面21String FontName = TimesRoman,Courier,Arial;int FontStyle = Font.PLAIN, Font. BOLD, Font.ITALIC;String StyleName = PLAIN, BOLD, ITALIC ;public void paint( Graphics g)

11、for ( int i=0; i3; i+) for ( int j=0; j1) /双击时清除向量中各点m_vLocs.removeAllElements(); else /单击时在向量中增加一点m_vLocs.addElement(e.getPoint(); repaint(); /重新绘制一次 class move extends MouseMotionAdapter/鼠标移动监听者类public void mouseMoved(MouseEvent e) /响应移动 m_CursorLoc = new Point(e.getX(),e.getY(); repaint(); /重新绘制一

12、次 4 4Java的图形用户界面70事件类4ActionEvent类：属于动作事件，包括：点击按钮；双击一个列表中的选项;选择菜单项；在文本框中按回车。最典型的例子是：鼠标点击按钮所产生的事件，经ActionListener接口触发一连串动作，再由actionPerformed()方法完成这些动作。 e.getSource() 返回事件发生的对象(名) e.getActionCommand() 返回按扭名(动作事 件的命令字符串)。4ActionListener 接口 public void actionPerformed(ActionEvent e)4 4Java的图形用户界面71图形用户界

13、面例import java.awt.*;import java.awt.event.*;public class a public static void main(String args) MyFrame form1 = new MyFrame(); class MyFrame extends Frame MyFrame() super(窗口标题); setSize(200,100); setFont(new Font(TimesRoman,Font.BOLD,20);4 4Java的图形用户界面72图形用户界面例 setLayout(new FlowLayout(); Button b =

14、 new Button(close); add(b); b.addActionListener(new Bprocess(); setVisible(true); class Bprocess implements ActionListener public void actionPerformed(ActionEvent e) System.exit(0); 4 4Java的图形用户界面73监听者类4某个类可以兼职也可以专职做这件事（实现监听者接口）。4一个类若实现一个接口，必须实现接口的全部方法。 例如：ActionListener接口只有一个方法： void actionPerforme

15、d(ActionEvent e) 4实现接口的类可以是： 一般类 内部类 匿名类4 4Java的图形用户界面74事件处理有关问题4有哪些事件类 (java.awt.event) ？ 4每个事件类的监听者接口？4每个监听者接口规定的方法？4多方法的监听者接口的适配器（实现接口的抽象类）是什么？4组件的事件委托（注册）方法？4 4Java的图形用户界面75窗口事件4关闭窗口框时引发 WindowEvent事件4委托 addWindowListener(new Wclose();4定义监听者类 class Wclose implements WindowListener public void wi

16、ndowClosing(WindowEvent e) System.exit(0); 4WindowListener类有7 个方法，必须都实现4WindowAdapter 接收窗口事件的抽象适配器类，用空内容实现了WindowListener接口的所有方法4class Wclose extends WindowAdapter 4 4Java的图形用户界面76ActionEvent动作事件4引发原因： 单击按扭，双击列表框中选项，选择菜单项，文本框中的回车4事件监听接口：ActionListener4接口方法： actionPerformed(ActionEvent e)4组件注册该事件方法：

17、addActionListener(监听者） 4 4Java的图形用户界面77TextEvent文本事件4引发原因： 文本框或文本区域内容改变4事件监听接口：TextListener4接口方法： textValueChanged(TextEvent e)4组件注册该事件方法： addTextListener(监听者） 4 4Java的图形用户界面78ItemEvent选择事件4引发原因： 改变列表框中的选中项 改变复选框选中状态 改变下拉选单的选中项4事件监听接口：ItemListener4接口方法： itemStateChanged(ItemEvent e)4组件注册该事件方法： addIt

18、emListener(监听者） 4 4Java的图形用户界面79AdjustmentEvent调整事件4引发原因： 操作滚动条改变滑块位置4事件监听接口：AdjustmentListener4接口方法： adjustmentValueChanged(AdjustmentEvent e)4组件注册该事件方法： addAdjustmentListener(监听者） 4 4Java的图形用户界面80KeyEvent事件4引发原因： 敲完键（KEY-TYPED) 按下键 (KEY-PRESSED) 释放键 (KEY-RELEASE)4事件监听接口：KeyListener4接口方法： keyPresse

19、d(KeyEvent e) 键已被按下时调用 keyReleased(KeyEvent e) 键已被释放时调用 keyTyped(KeyEvent e) 键已被敲完时调用4KeyEvent方法：char ch = e.getKeyChar(); 4事件监听适配器（抽象类）KeyAdapter4组件注册该事件方法： addKeyListener(监听者） 4 4Java的图形用户界面81MouseEvent事件4引发原因: (鼠标作用在一个组件上) 鼠标事件: 鼠标键按下，鼠标键抬起，单击鼠标 ， 鼠标光标进入一个组件，鼠标光标离开一个组件。 鼠标移动事件: 鼠标移动，鼠标拖动 4鼠标事件监听接

20、口1: MouseListener 接受鼠标事件4该接口方法: mouseClicked(MouseEvent e) mouseEntered(MouseEvent e) 鼠标光标进入一个组件 mouseExited(MouseEvent e) 鼠标光标离开一个组件4 4Java的图形用户界面82MouseEvent事件（续）4鼠标事件监听适配器（抽象类）MouseAdapter4鼠标事件监听接口2: MouseMotionListener 接受鼠标移动事件4该接口方法： mouseMoved(MouseEvent e) 鼠标光标在组件上移动 mouseDragged(MouseEvent e

21、) 用鼠标拖动一个组件4鼠标移动事件监听适配器 MouseMotionAdapter4组件注册鼠标事件方法: addMouseListener(监听者） 4组件注册鼠标移动事件方法: addMouseMotionListener(监听者） 4 4Java的图形用户界面83MouseEvent事件（续）4MouseEvent方法 e.getClickCount() =1 单击 =2 双击 Point e.getPoint() 取鼠标光标位置 int e.getX() int e.getY() 取鼠标光标位置 e.getModifiers() = e.BUTTON1_MASK 鼠标左键 = e.B

22、UTTON3_MASK 鼠标右键4 4Java的图形用户界面84WindowEvent事件4引发原因： 有关窗口操作引发的事件4事件监听接口WindowListener4接口方法 windowActivated(WindowEvent e) 激活窗口 windowClosed(WindowEvent e) 调用dispose方法关闭窗口后 windowClosing(WindowEvent e) 窗口正在被关闭(试图利用窗口关闭按钮关闭窗口) windowDeactivated(WindowEvent e) 本窗口成为非活动窗口4 4Java的图形用户界面85WindowEvent事件(续）

23、windowDeiconified(WindowEvent e) 窗口从最小化恢复为普通窗口 windowIconified(WindowEvent e) 窗口变为最小化图标 windowOpened(WindowEvent e) 窗口被打开成为可见时4接口适配器 WindowAdapter4注册事件方法 addWindowListener4 4Java的图形用户界面86FocusEvent事件4引发原因： 组件获得焦点 组件失去焦点4事件监听接口 FocusListener4接口方法： focusGained(FocusEvent e) 组件获得焦点时调用 focusLost(FocusEv

24、ent e) 组件失去焦点时调用4接口适配器：FocusAdapter4组件注册该事件方法：addFocusListener4 4Java的图形用户界面87TextEvent事件4引发原因： 当组件（如文本框）文本改变时引发4事件监听接口：TextListener4接口方法： textValueChanged(TextEvent e)4组件注册该事件方法： addTextListener4 4Java的图形用户界面88ComponentEvent 事件4引发原因： 当组件移动、改变大小、改变可见性时引发4事件监听接口：ComponentListener4接口方法： componentHidde

25、n(ComponentEvent e) 组件隐藏 componentMoved(ComponentEvent e) 组件移动 componentResized(ComponentEvent e) 组件改变大小 componentShown(ComponentEvent e) 组件变为可见4接口适配器 ComponentAdapter4组件注册该事件方法： addComponentListener4 4Java的图形用户界面89ContainerEvent 事件4引发原因： 当容器内增加或移走组件时引发4事件监听接口：ContainerListener4接口方法 componentAdded(C

26、ontainerEvent e) 容器内加入组件 componentRemoved(ContainerEvent e) 从容器中移走 组件4接口适配器 ContainerAdapter4容器注册该事件方法： addContainerListener4 4Java的图形用户界面90GUI标准组件4Label(标签) 构造方法 Label myl = new Label(“标签内容”); Label a = new Label(“information”); Label a = new Label(“information”, Label.CENTER); 方法 a.setText(“新内容”);

27、 设置标签内容 String a.getText() 读取标签内容4Button(按钮) Button myB1 = new Button(); Button myB2 = new Button(“Cancel”);4 4Java的图形用户界面91GUI标准组件4Checkbox(检测盒) 创建时指定检测盒的标签Checkbox cb1 = new Checkbox ();Checkbox cb2 = new Checkbox (“registered”);Checkbox cb3 = new Checkbox (“registered”, true);Checkbox cb4 = new C

28、heckbox (“registered”, true, group); 获取和设置检测盒的状态cb.setState(true);boolean b=cb.getState();4 4Java的图形用户界面92Checkbox组件4构造方法 Checkbox(String label) Checkbox(String label, boolean state) Checkbox(String label, boolean state, CheckboxGroup group ) 4方法： boolean getState() setState(boolean state)4 4Java的图形

29、用户界面93GUI标准组件4CheckboxGroup(单选按钮组) 单选按钮组是一组Checkbox的集合，是将一组 Checkbox 按扭组成单选按扭组件 首先创建CheckboxGroup,再加入单个按钮4方法： Checkbox getSelectedCheckbox() 取得目前选取的复选框对象 setSelectedCheckbox(Checkbox box) 设定目前选取的复选框对象4 4Java的图形用户界面94CheckboxGroup组件4例: setLayout(new GridLayout(3, 1); CheckboxGroup cbg = new CheckboxG

30、roup(); Checkbox ck1 = new Checkbox(“one”, true, cbg ); Checkbox ck2 = new Checkbox(“two”, false, cbg ); Checkbox ck3 = new Checkbox(“three”, false, cbg ); add(ck1); add(ck2); add(ck3); 把CheckboxGroup加入容器时需要把其中的每个复选按钮逐个加入到容器中，而不能使用CheckboxGroup对象一次性地加入。4 4Java的图形用户界面95TextField行编辑框组件4构造方法(String, in

31、t) TextField f1 = new TextField(30); TextField f1 = new TextField(“abc”,30); 建30个字符宽的行编辑框4方法： String getText() 读文本框内容 setText(“abc”) 设置编辑框内容 setEchoChar(char c) 设置回显字符4TextComponent 方法： setEditable(false); selectAll() 4 4Java的图形用户界面96TextArea组件4构造方法(String, int , int) TextArea t1 = new TestArea(10,4

32、5); 建10行、45列的文本区域 TextArea t1 = new TestArea(“abc”,10,45); TextArea t1 = new TestArea(“abc”,10,45，滚动条);4滚动条指定 SCROLLBARS_BOTH SCROLLBARS_HORIZONTAL_ONLY SCROLLBARS_VERTICAL_ONLY SCROLLBARS_NONE4方法 append(String str) 追加文本4 4Java的图形用户界面97List 列表框4首先创建List对象，再调用add ()方法加入List列表的各选项。列表可以实现多选多4构造方法 List(

33、int rows, boolean multipleMode) rows 显示行数 ； multipleMode 是否允许多选4方法： list1.add (“class A”); list1.add (“class B”); list1.add (“class C” , 0); 指定加入选项位置4 4Java的图形用户界面98List 列表框4方法 int getSelectedIndex() 取被选项索引 int getSelectedIndexes() 取被选项索引（多选） String getSelectedItem() 取被选项 String getSelectedItems() 取

34、被选项（多选） void select(int index) 选中指定的项 String getItem(int index) 按索引号取出该项 int getItemCount() 取出项数 String getItems( ) 取出所有的项 P.2114 4Java的图形用户界面99Choice下拉选单4下拉选单提供了多选一机制，创建下拉选单包括创建下拉选单对象和添加选项两个步骤 例： Choice ColorChooser = new Choice(); ColorChooser.add(Green); ColorChooser.add(Red); ColorChooser.add(Bl

35、ue); String getSelectedItem() Green4 4Java的图形用户界面100Scrollbar 滚动条4构造方法 mySlider = new Scrollbar(Scrollbar.HORIZONTAL , 0 , 1 , 0 , Integer.MAX_VALUE); 滚动条方向 滑块初始位置 滑块尺寸 滚动槽最小值 滚动槽最大值4方法 int getValue() 返回滑块当前位置 setUnitIncrement(1); 设置单位增量（点按两端箭头） setBlockIncrement(50); 设置块增量（点按滚动槽）4 4Java的图形用户界面101菜单

36、4菜单须依附于一个实现了MenuContainer接口 的对象：Frame 构建菜单结构：创建菜单的步骤 创建菜单条（MenuBar） 创建菜单（Menu），加入相应菜单条 创建菜单项（MenuItem），加入相应菜单 使菜单条依附于拥有它的对象:setMenuBar()4编写响应菜单操作的代码(ActionEvent)4 4Java的图形用户界面102菜单4创建菜单条（MenuBar) MenuBar m_MenuBar = new MenuBar(); 4创建菜单（Menu），加入菜单条 Menu menuFile = new Menu(“File”); /创建菜单 m_MenuBar.a

37、dd(menuFile); /将菜单加入菜单条4创建菜单项（MenuItem) , 并加入相应菜单 MenuItem f1= new MenuItem(“Open”), /创建各菜单项 MenuItem f2 = new MenuItem(Close), menuFile.add(f1); /加入菜单 menuFile.add(f2);4将菜单条放入frame: myFrame.setMenuBar(m_MenuBar); 4编写响应菜单操作的代码(ActionEvent)4 4Java的图形用户界面103例：MenuFrame.javaclass MenuFrame extends Fram

38、e Label lb=new Label(“here comes command”);/模拟菜单命令 MenuBar m_MenuBar=new MenuBar(); /创建菜单条 Menu menuFile = new Menu(“File”); /创建菜单 MenuItem file=new MenuItem(“Open”), /创建各菜单项new MenuItem(Close),new MenuItem(Exit) ; MenuFrame() m_MenuBar.add(menuFile); /把菜单加入菜单条menuFile.add(file0); /把各菜单项加入菜单menuFile

39、.add(file1);menuFile.add(file2);setMenuBar(m_MenuBar); /把菜单条加入Frame4 4Java的图形用户界面104setLayout(new FlowLayout();add(lb); /加入Label, 用于输出菜单项命令ActionListener ml=new ML();for(int i=0;i3;i+) /为每个菜单项注册监听者 filei.addActionListener(ml); /此例多个菜单项 /对应一个监听者, 但实际编程时建议使用一对一结构addWindowListener(new WL(); class ML im

40、plements ActionListener /Action事件监听者类public void actionPerformed(ActionEvent e) lb.setText(e.getActionCommand(); /输出菜单命令 4 4Java的图形用户界面105文件对话框FileDialog(Frame parent, String title, int mode)4 parent 对话框所属窗体4 title 对话框标题4 mode 对话框模式 FileDialog.LOAD 打开文件 FileDialog.SAVE 保存文件4 4Java的图形用户界面106文件对话框 class MyFrame extends Frame MyFrame getMyFrameIns() return this; 子类方法代码片段： FileDialog f = new FileDialog( getMyFrameIns(),open,FileDialog.SAVE); f.setVisible(true); String fname = f.getDirectory() + f.getFile() ; ig = getToolkit().getImage(fname);4 4Java的图形用户界面107课后作业4 P276. 第10、11、12、13、14题108 结束语结束语