图形用户界面设计

文字处理类的: 文本框、文本区域
命令类的: 按钮、菜单等
– GUI组件的作用是完成与用户的交互。包括接收
用户的命令、文本或选择输入，向用户显示一段
文本或一个图形等Jav。a的图形用户界面
7
界面元素
4
使用组件通常需要如下的步骤
– 创建某组件类的对象，指定其大小等属性。
– 使用某种布局策略，将该组件对象加入到某个容 器中的某指定位置处。
Java的图形用户界面
24
显示图象
4
显示图象的方法
drawImage(Image 对象, x, y,背景色, ImageObserver); – java.awt.Graphics类中定义了此方法
– 第一个参数是保存图像数据的Image对象。
– 第二、三个参数是图像的左上角坐标，它们决定了 图像在容器中的显示位置。
return super.handleEvent(evt);
}
public static void main(String[] args){
Frame f=new Empty();
f.setSize(300,200);
f.setVisible(true);}来自Java的图形用户界面
12
}
绘制用户自定义成分
Java的图形用户界面
16
绘制图形及其相关方法 4
画圆或椭圆
– drawOval(x,y,w,h) – x,y为绘制圆或椭圆的左上角的坐标，w,h确定了
椭圆的宽度和高度
画实心圆或椭圆
– fillOval(x,y,w,h)
画多边形
– drawPolygon(X坐标数组，Y坐标数组，顶点个数) P.185
4
用户自定义成分属于构成GUI的非标准部分
– 无法响应用户事件 – 一般仅仅起背景装饰、输出效果突出的作用
Java中的用户自定义成分
– 显示文字 – 绘制图形 – 显示图片
Java的图形用户界面
13
绘制用户自定义成分
4
一般在容器中(窗口)或画布上绘制。
利用Java.awt类库中的类及其方法绘制用户自定义的图 形界面成分。
setColor(Color c) //设置颜色
setFont(Font f) //设置字体
getColor()
getFont()
Java的图形用户界面
15
绘制图形及其相关方法 4
从(x1,y1)到(x2,y2)画直线
– drawLine(x1,y1,x2,y2) 参数均为int
画弧线drawArc(x,y,w,h,,) 参数均为int
使用repaint()方法可以触发update()方法
编程
调用
控制 repaint()
update()
第一次绘制
paint( )
1. 擦除并填充成背景色 2. 调用paint()
当某些操作破坏了显示，需重新绘制时
Java的图形用户界面
22
显示图象
4
图形与图象，java支持gif和jpeg格式 保存二进制图象的java.awt.Image类 获取Image对象的方法
4
4
4
4
界面构成
4
容器
标准 组件
用户自 定义成
分
❖容器是用来组织其他界面成分和元素的单元。一 般一个图形用户界面对应一个复杂容器。如一窗口 ❖标准组件是图形用户界面的最小单位,它里面不 再包含其他的成分。如单选按钮,文本框,菜单
❖用户自定义成分是指编程人员根据用户需要设计 一些用户J自ava定的图义形的用户图界形面 界面成分。如绘制几何图形6
4
Java的图形用户界面编程：
– 为方便图形用户界面的开发，设计了专门的类库 来生成各种标准图形界面元素和处理图形界面的 各种事件，这个用来生成图形界面的类库就是 java.awt包。AWT是abstract window toolkit抽象窗 口工具集的缩写。
– AWT类库中的各种操作被定义在一个窗口中进行， 开发人员用AWT开发出的图形用户界面可以适用 于所有的平台系统。
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(FontName[i], FontStyle[j], 12));
g.drawString( "ABEXYZ " + FontName[i] + " " +
StyleName[j], 10,20*(i*3+j+2));
}
}
}//end of paint
Java的图形用户界面
21
paint()与update()
4
某组件的paint()和 update()为系统自动调用的有关图 形绘制的方法，不可人为编程调用；但可编程重新 定义其操作内容
Graphics类包含很多绘制图形和文字的方法 。
首先要获得Graphics类的实例，然后利用其方法绘制。
Graphics类的实例一般作为相关方法的参数传递进来：
paint(Graphics g)
原点(0,0)
X轴
Java程序图形界面的
坐标设置
Y轴
Java的图形用户界面
14
绘制图形及其相关方法 4
– 将该组件对象注册给它所能产生的事件对应的事 件监听者，重载事件的处理方法，实现利用该组 件对象与用户交互的功能。
用户自定义成分
– 显示文字、绘制图形、显示图象…
– 不能像标准组件一样被系统识别和承认，只起装 饰作用。
– 不能响应用户的动Jav作a的，图形不用户具界面有交互功能。
8
图形用户界面（GUI）
public boolean handleEvent(Event evt){ //根据Event类中参数evt的id值来判断发生事件的种
类
if(evt.id= =Event.WINDOW_DESTROY)
System.exit(0); // return的返回值表示将余下的事件处理交给handleEvent( )的父 // 类处理，从而保证对事件的正常处理
– ImageObserver为一个接口，java的组件类实现了此 接口，此处可理解为观察/显示Image对象容器，编 程时一般可使用this，用于提示图象是否加载完成
Java的图形用户界面
25
显示图象
4
表示颜色的类Color
显示的字符串或图形的颜色可以用Color类的对象来控
制，每个Color 对象代表一种颜色，用户可以直接使用 Color类中定义好的颜色常量，也可以通过调配红、绿、 蓝三色的比例创建自己的Color对象
……... //画身体,多边形方法fillPolygon g.fillPolygon(polygon_x,polygon_y,polygon_pt_num);
Java的图形用户界面
19
显示文字
4
字体显示效果类：Font
一个Font类的对象表示了一种字体显示效果，包括字体 类型、风格和字号。
Font mf = new Font(String 字体，int 风格，int 字号);
Java的图形用户界面
17
绘制图形及其相关方法 4
例子： sanmao.java
Java的图形用户界面
18
4 //画头部,椭圆方法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,15,30); g.copyArea(25,92,15,30,136,0); //拷贝某区域的图形至另一区域
drawLine(x1,y1,x2,y2) //直线
drawRect(x,y,w,h)
//矩形
drawOval(x,y,w,h)
//圆或椭圆
fillOval(x,y,w,h)
//实心圆或椭圆
drawPolygon(X坐标数组，Y坐标数组，顶点个数)
//画多边形
drawArc (x,y,w,h,开始角度，弧度角度)
Java的图形用户界面
20
4
String FontName[] = {"TimesRoman","Courier","Arial"}; int FontStyle[] = {Font.PLAIN, Font. BOLD, Font.ITALIC}; String StyleName[] = { "PLAIN", "BOLD", "ITALIC" };
– 字体：TimesRoman, Courier, Arial等
– 风格：三个常量
• Font.PLAIN, Font.BOLD, Font.ITALIC
– 字号：字的大小（磅数）
– 设置当前使用的字体：setFont(Font fn)
– 获取当前使用的字体：getFont()
例：UseFonts.java
界面元素
4
容器是用来组织其他界面成分和元素的单元。
– 可以形成容器的层次，构筑复杂结构
– Window（Frame、Applet、Dialog ）
组件是图形用户界面的基本单位，它里面不再包
含其他的成分。
– GUI组件是图形用户界面标准化的结果。常用的 组件有:
选择类的: 单选按钮、复选按钮、下拉列表；
– 选择类组件：单选按钮、复选框、下拉选单、 列表框
– 文字处理类组件：标签、文本框、编辑框。 – 命令类组件：按钮、工具栏、菜单等。
Java的图形用户界面
10
从一个简单窗口开始
创建GUI应用程序
– Frame必不可少 它是带标题的顶层窗口, 是构建应用程序图形界 面的基础,它为应用程 序实现人机交互提供了 对话窗口
Color类
4
构造方法1（设置颜色）
Color c = new Color(int red, int green, int blue) 范围 ：0~255
在applet小程序中，可使用Applet类的getImage 方法获得图象。
Image ig = getImage(…)
而在application中就只能使用ToolKit类的 getImage方法： Image ig = getToolkit().getImage(“文件名”); 然后用Graphics类的drawImage方法显示Image 对象。
先来建一个空的窗口应 用: Empty.java
– 注意：一定要处理关闭 窗口的事件
Java的图形用户界面
4
11
4
import java.awt.*; //must import to use GUI
//must extends Frame in an application
public class Empty extends Frame{ // 暂时采用1.0.2的事件处理方法，关闭窗口
– Color(red,green,blue)来创建非缺省色 – 调用Graphics对象的setColor()方法可把当前的缺省
颜色改成新建的颜色
Color blueColor=new Color(0,0,255);
g.setColor(blueColor);
Java的图形用户界面
P.189 26
getImage(图象文件所在的URL) getImage(图象文件所在的URL,图象文件名) – Applet类以及java.awt.Toolkit中均有方法的定义 – 注意：在application中只能使用Toolkit，而在Applet 中，两者均可使用
Java的图形用户界面
23
显示图象
4
Java的图形用户界面
9
AWT包
4
Abstract Window Toolkit(抽象窗口工具集)
– 提供各种构成GUI的标准构件。 – AWT类库中的各种操作被定义在一个窗口中进行
的。
– 抽取不同软硬件平台中所实现的窗口的公共特性。 – 依赖于具体平台系统实现：显示效果可能不同。
提供与机器无关的基本GUI标准组件
– x,y为绘制弧形的左上角的坐标； w,h为弧形的宽度 和高度；为弧形的起始角，为弧形的弧度， 为 正，表顺时针方向； 为负，表逆时针方向。
以(x,y)为左上角、w为宽度、h为高度画矩形
– drawRect(x,y,w,h) 参数均为int
fillRect(x,y,w,h)、clearRect(x,y,w,h)