《图形用户界面设计研究报告》由会员分享，可在线阅读，更多相关《图形用户界面设计研究报告（107页珍藏版）》请在金锄头文库上搜索。
1、图形用户界面设计,Java的图形用户界面,2,主要内容,Java的GUI简介 自定义图形设计 图形、文字、图象 Java的标准组件 容器和组件 GUI的布局 事件处理,Java的图形用户界面,3,图形用户界面（GUI）,字符界面 用字符串、命令行的方式与用户交互 图形用户界面:Graphics User Interface 用直观的图形来表示数据 用直观、方便的GUI标准组件来接收命令 GUI组成成分的标准化 使用图形的方式借助菜单、按钮等标准界面元素和鼠 标操作，来帮助用户方便地向计算机系统发出命令， 启动操作，并将系统运行的结果同样以图形的方式显 示给用户。,Java的图形用户界面,4,用
2、户界面设计原则,控制权在用户 界面与操作的风格一致性 宽容（容错）性 简洁与美观并重,Java的图形用户界面,6,界面构成,容器,用户自定义成分,容器是用来组织其他界面成分和元素的单元。一般一个图形用户界面对应一个复杂容器。如一窗口 标准组件是图形用户界面的最小单位,它里面不再包含其他的成分。如单选按钮,文本框,菜单 用户自定义成分是指编程人员根据用户需要设计一些用户自定义的图形界面成分。如绘制几何图形,标准 组件,Java的图形用户界面,7,界面元素,容器是用来组织其他界面成分和元素的单元。 可以形成容器的层次，构筑复杂结构 Window（Frame、Applet、Dialog ） 组件是图
3、形用户界面的基本单位，它里面不再包含其他的成分。 GUI组件是图形用户界面标准化的结果。常用的组件有: 选择类的: 单选按钮、复选按钮、下拉列表； 文字处理类的: 文本框、文本区域 命令类的: 按钮、菜单等 GUI组件的作用是完成与用户的交互。包括接收用户的命令、文本或选择输入，向用户显示一段文本或一个图形等。,Java的图形用户界面,8,界面元素,使用组件通常需要如下的步骤 创建某组件类的对象，指定其大小等属性。 使用某种布局策略，将该组件对象加入到某个容器中的某指定位置处。 将该组件对象注册给它所能产生的事件对应的事件监听者，重载事件的处理方法，实现利用该组件对象与用户交互的功能。 用户自
4、定义成分 显示文字、绘制图形、显示图象 不能像标准组件一样被系统识别和承认，只起装饰作用。 不能响应用户的动作，不具有交互功能。,Java的图形用户界面,9,图形用户界面（GUI）,Java的图形用户界面编程： 为方便图形用户界面的开发，设计了专门的类库 来生成各种标准图形界面元素和处理图形界面的 各种事件，这个用来生成图形界面的类库就是java.awt包。AWT是abstract window toolkit抽象窗 口工具集的缩写。 AWT类库中的各种操作被定义在一个窗口中进行，开发人员用AWT开发出的图形用户界面可以适用于所有的平台系统。,Java的图形用户界面,10,AWT包,Abstr
5、act Window Toolkit(抽象窗口工具集) 提供各种构成GUI的标准构件。 AWT类库中的各种操作被定义在一个窗口中进行的。 抽取不同软硬件平台中所实现的窗口的公共特性。 依赖于具体平台系统实现：显示效果可能不同。 提供与机器无关的基本GUI标准组件 选择类组件：单选按钮、复选框、下拉选单、 列表框 文字处理类组件：标签、文本框、编辑框。 命令类组件：按钮、工具栏、菜单等。,Java的图形用户界面,11,从一个简单窗口开始,创建GUI应用程序 Frame必不可少 它是带标题的顶层窗口,是构建应用程序图形界面的基础,它为应用程序实现人机交互提供了对话窗口 先来建一个空的窗口应用: E
6、mpty.java 注意：一定要处理关闭窗口的事件,Java的图形用户界面,12,import java.awt.*; /must import to use GUI /must extends Frame in an application public class Empty extends Frame / 暂时采用1.0.2的事件处理方法，关闭窗口 public boolean handleEvent(Event evt) /根据Event类中参数evt的id值来判断发生事件的种类 if(evt.id= =Event.WINDOW_DESTROY) System.exit(0); / r
7、eturn的返回值表示将余下的事件处理交给handleEvent( )的父 / 类处理，从而保证对事件的正常处理 return super.handleEvent(evt); public static void main(String args) Frame f=new Empty(); f.setSize(300,200); f.setVisible(true); ,Java的图形用户界面,13,绘制用户自定义成分,用户自定义成分属于构成GUI的非标准部分 无法响应用户事件 一般仅仅起背景装饰、输出效果突出的作用 Java中的用户自定义成分 显示文字 绘制图形 显示图片,Java的图形用户
8、界面,14,绘制用户自定义成分,一般在容器中(窗口)或画布上绘制。 利用Java.awt类库中的类及其方法绘制用户自定义的图形界面成分。 Graphics类包含很多绘制图形和文字的方法 。 首先要获得Graphics类的实例，然后利用其方法绘制。 Graphics类的实例一般作为相关方法的参数传递进来： paint(Graphics g) Java程序图形界面的 坐标设置,Java的图形用户界面,15,绘制图形及其相关方法,drawLine(x1,y1,x2,y2) /直线 drawRect(x,y,w,h) /矩形 drawOval(x,y,w,h) /圆或椭圆 fillOval(x,y,w
9、,h) /实心圆或椭圆 drawPolygon(X坐标数组，Y坐标数组，顶点个数) /画多边形 drawArc (x,y,w,h,开始角度，弧度角度) setColor(Color c) /设置颜色 setFont(Font f) /设置字体 getColor() getFont(),Java的图形用户界面,16,绘制图形及其相关方法,从(x1,y1)到(x2,y2)画直线 drawLine(x1,y1,x2,y2) 参数均为int 画弧线drawArc(x,y,w,h,) 参数均为int x,y为绘制弧形的左上角的坐标； w,h为弧形的宽度和高度；为弧形的起始角，为弧形的弧度， 为正，表顺时
10、针方向； 为负，表逆时针方向。 以(x,y)为左上角、w为宽度、h为高度画矩形 drawRect(x,y,w,h) 参数均为int fillRect(x,y,w,h)、clearRect(x,y,w,h),Java的图形用户界面,17,绘制图形及其相关方法,画圆或椭圆 drawOval(x,y,w,h) x,y为绘制圆或椭圆的左上角的坐标，w,h确定了 椭圆的宽度和高度 画实心圆或椭圆 fillOval(x,y,w,h) 画多边形 drawPolygon(X坐标数组，Y坐标数组，顶点个数) P.185,Java的图形用户界面,18,绘制图形及其相关方法,例子： sanmao.java,Java
11、的图形用户界面,19,/画头部,椭圆方法drawOval g.setColor(Color.black); /setColor用来设置要使用的颜色 g.drawOval(40,40,120,150); . /画头发,直线方法drawLine,画弧方法drawArc g.drawLine(100,10,100,60); g.drawArc(110,20,100,80,90,90); . /画嘴巴,填充画弧方法fillArc g.fillArc(60,130,80,40,180,180); . /画耳朵,填充椭圆方法fillOval,复制图形方法copyArea g.fillOval(25,92,
12、15,30); g.copyArea(25,92,15,30,136,0); /拷贝某区域的图形至另一区域 . /画身体,多边形方法fillPolygon g.fillPolygon(polygon_x,polygon_y,polygon_pt_num);,Java的图形用户界面,20,显示文字,字体显示效果类：Font 一个Font类的对象表示了一种字体显示效果，包括字体类型、风格和字号。 Font mf = new Font(String 字体，int 风格，int 字号); 字体：TimesRoman, Courier, Arial等 风格：三个常量 Font.PLAIN, Font.B
13、OLD, Font.ITALIC 字号：字的大小（磅数） 设置当前使用的字体：setFont(Font fn) 获取当前使用的字体：getFont() 例：UseFonts.java,Java的图形用户界面,21,String FontName = TimesRoman,Courier,Arial; int FontStyle = Font.PLAIN, Font. BOLD, Font.ITALIC; String StyleName = PLAIN, BOLD, ITALIC ; public void paint( Graphics g) for ( int i=0; i3; i+) f
14、or ( int j=0; j3; j+) /set a new font and draw a string with the new font g.setFont(new Font(FontNamei, FontStylej, 12); g.drawString( ABEXYZ + FontNamei + + StyleNamej, 10,20*(i*3+j+2); /end of paint,Java的图形用户界面,22,paint()与update(),某组件的paint()和 update()为系统自动调用的有关图 形绘制的方法，不可人为编程调用；但可编程重新 定义其操作内容 使用r
15、epaint()方法可以触发update()方法,Java的图形用户界面,23,显示图象,图形与图象，java支持gif和jpeg格式 保存二进制图象的java.awt.Image类 获取Image对象的方法 getImage(图象文件所在的URL) getImage(图象文件所在的URL,图象文件名) Applet类以及java.awt.Toolkit中均有方法的定义 注意：在application中只能使用Toolkit，而在Applet中，两者均可使用,Java的图形用户界面,24,显示图象,在applet小程序中，可使用Applet类的getImage方法获得图象。 Image ig
16、= getImage() 而在application中就只能使用ToolKit类的getImage方法： Image ig = getToolkit().getImage(“文件名”); 然后用Graphics类的drawImage方法显示Image对象。,Java的图形用户界面,25,显示图象,显示图象的方法 drawImage(Image 对象, x, y,背景色, ImageObserver); java.awt.Graphics类中定义了此方法 第一个参数是保存图像数据的Image对象。 第二、三个参数是图像的左上角坐标，它们决定了图像在容器中的显示位置。 ImageObserver为一个接口，java的组件类实现了此接口，此处可理解为观察/显示Image对象容器，编程时一般可使用this，用于提示图象是
