1/

第 15 讲 图形用户界面㈠

教学目标

• 了解 GUI

• 掌握 AWT 窗口对象类

• 掌握 AWT 窗口对象组件

GUI 设计概述 • 图形用户界面（ GUI,Graphics User Interface ）是软件

产品与用户交互的界面接口，是软件产品中用户可以看到并直接操作的部分。美观大方、简单易用的友好操作界面是软件产品成功的重要因素。

• 在 Java 中， AWT （ Abstract Windowing Tookit ）是用来处理图形最基本的方式，它可以用来创建 Java 的 applet 及窗口程序。 AWT 是 Java 早期的技术，提供的组件有限，无法满足应用程序多样化组件的要求。为了弥补这个不足， Sun 公司开发出 Swing 包，它有别于 AWT ，不依赖于特定的系统平台，对外提供多样化的组件及外观，并且保持外观风格的一致。

GUI 组成元素分类 •容器

容器是用来组织或容纳其它界面成份和元素的组件。 Java提供了相应的容器类，例如，框架 (J)Frame 、面板 (J)Panel及滚动面板 (J)ScrollPanel 等类。•控制组件

控制组件是图形用户界面的基本单位，里面不再包含其它的成份。用户通过控制组件与程序进行交互。•用户自定义成份

除了上述的标准图形界面元素外，编程人员还可以根据用户的需要，使用各种字型字体和颜色设计一些几何图形、标志图案等，它们被称作用户自定义成份。用户自定义成份通常只起到显示结果、装饰美化的作用，不能响应用户的动作，不具有交互功能。

GUI 的设计原则 • 图形用户界面最重要的设计原则就是充分为用户考虑。应该

为用户提供一个可用、功能性好、安全高效的界面。• 怎样创建一个以用户为中心的界面呢？

首先，收集软件用户尽可能多的信息。用户属于哪个群体？用户对计算机操作的熟悉程度？用户年龄多大？教育程度如何？

其次，需要设计用户和计算机之间交换信息的形式。用户如何向程序输入信息：用鼠标从菜单选取，用鼠标点击图标，用快捷键，用键盘输入还是语音命令；系统应该提供何种反馈：如当鼠标停留在对象上的时候，为了显示它是可选的，对象要高亮度显示，或至少要改变一个选项的颜色以表示它被选中了；用户的选项，程序的反馈以及程序的输出如何安排在屏幕上；如何创建想要的空间布局，如何使用 Java内建功能来布置图形组件。

GUI 的设计步骤概要 •当设计好一个 GUI 的草案，如何判断它是否是一个良

好的以用户为中心的设计呢？一般来说，好的界面应该让用户能够控制，界面应该具有物理舒适感、易于学习、易于记忆，同时操作不易出错。

• 要定义一个 GUI ，一般需要以下三个步骤。1 ．创建这个 GUI 的组件，如按钮，标签，菜单等2 ．在窗口中排列这些组件。3 ．让这些组件响应用户输入——事件处理。

AWT 窗口对象类简介 •抽象窗口工具包（ AWT ， Abstract Windowing Too

lkit ）为开发者提供建立图形用户界面的工具集。对Java运行的每一个平台， AWT 的组件通过它们各自的代理映射成平台特定的组件。 AWT适用于简单的GUI 程序。

java.lang.Object

java.awt.Component

java.awt.Buttonjava.awt.Canvas

java.awt.Checkbox

java.awt.Choice

java.awt.Container

java.awt.Label

java.awt.List

java.awt.Scrollbar

java.awt.TextComponent

java.awt.Window

java.awt.Panel

java.awt.Dialog

java.awt.Frame

java.awt.TextArea

java.awt.TextField

AWT组件抽象超类

标签按钮

空白矩形区域

复选框

弹出式选择菜单

容器对象

顶层窗口

对话框

带有标题和边界的顶层窗口

面板标签

文本项列表滚动条

文本

多行区域文本

单行区域文本

AWT 基本组件 — Frame

• Frame 类继承Container 类，是一个容器，用来容纳按钮、文本框等其他窗口组件，也可以容纳其他容器对象。

AWT 在实际的运行过程中是调用所在平台的图形系统，因此外观依赖于所使用的操作系统

Frame 的外观就像我们平常在 windows 系统下见到的窗口，有标题、边框、菜单、大小等等。

每个 Frame 的对象实例化以后，都是没有大小和不可见的，因此必须调用 setSize( ) 来设置大小，调用 setVisible(true) 来设置该窗口为可见的。

如果不再需要一个 Frame时，应调用 dispose 方法撤消它

Frame 类大致框架public class Frame extends Window implements MenuContai

ner{public Frame()public Frame(String title) //// 重载的构造方法重载的构造方法public String getTitle()public void setTitle(String title)public MenuBar getMenuBar()public void setMenuBar(MenuBar mb)public void dispose()}

//Ex9_1.javaimport java.awt.*;public class Ex9_1{　 static Frame frm=new Frame(" 第一个窗口程序！ ");// 创建一个窗

口　 static Label lab=new Label("蓝色的窗口 ");// 创建一个标签　 public static void main(String args[]){

frm.setSize(200,150);// 设置窗口的高为 200像素，宽为 150像素

frm.setBackground(Color.BLUE);// 设置窗口的背景为蓝色frm.setLocation(250,250);// 设置窗口的位置lab.setForeground(Color.yellow);// 设置标签的前景色frm.add(lab);//将标签对象加入窗口中frm.setVisible(true);// 显示窗口

　 }}

Frame 示例

程序分析•这个例子中，在类 Ex9_1里面定义了两个静态

的对象。一个是 Frame 窗口对象，在 Java 里面称为一个容器，另外一个是 Label 标签对象，它是一个 AWT基本组件。通过 setSize() 、 setBackground() 、 setLocation() 等方法来改变窗口对象的状态。•怎样才能使 frm 窗口中显示 lab 对象呢？通常使用 ad

d() 方法将一些基本组件加入到容器里面。•对于这个窗口，可以使用最大化按钮、最小化按钮、

拖拽边框来改变窗口的大小，但是却不能用点击关闭按钮的办法来关闭窗口，即使使用 ALT+F4 也不行。怎样才能实现窗口的关闭呢？ Java将利用窗口关闭事件来进行处理，将在本章第 5 节介绍。

AWT 基本组件 — Button

•按钮是交互式界面常用的组件，用户可以通过点击按钮控制程序的运行。

• 单击按钮将产生 ActionEvent事件public class Button extends Component{　 public Button()　 public Button(String label)　 public String getLabel()　 public void setLabel(String label)　 public void addActionListener(ActionListener l)　 public void removeActionListener (ActionListener l)　 }

import java.awt.*;public class Ex9_3{　　 public static void main(String args[]){

Frame frm=new Frame("按钮对象的创建 "); Button btn1=new Button("按钮一 ");// 创建一个按钮Button btn2=new Button();// 创建一个按钮btn2.setLabel("按钮二 ");// 设置按钮标题frm.setTitle(" 窗口对象的创建 ");frm.setLayout(null);//取消默认的布局frm.setSize(200,150); frm.setLocation(250,250); frm.add(btn1);frm.add(btn2);btn1.setBounds(40,40,80,30);// 设置按钮的位置和大

小btn2.setBounds(40,80,80,30);frm.setVisible(true);// 显示窗口

　　 }}

程序分析：这个例子中，在类 Ex9_3 程序中创建了 2 个按钮对象，

通过 Frame 类对象 frm 的 add() 方法加入到窗口中。程序中出现的 setLayout() 方法是用来设置窗口内组件的布局方式的。按钮对象的 setBounnds() 方法是在 Component 类中定义的，作用是设置组件的位置和大小。

Button

示

例

AWT 基本组件 — Label

• 标签（ label ）是用来在窗口中显示文字的文本框，也是在屏幕上显示图像或文本的一种最简单和快捷的方式。

• 单行非编辑文本组件，用于在一个版面中提供简单的信息描述，静态文字，无事件。

• public class Label extends Componet{public static final int LEFT,CENTER,RIGHTpublic Label()public Label(String text)public Label(String text,int alignment)public String getText()public void setText(String text)

}

import java.awt.*;public class Ex9_4{　　 public static void main(String args[]){

Frame frm=new Frame(" 标签对象的创建 ");Label lab=new Label();frm.setLayout(null);frm.setSize(200,150);frm.setLocation(250,250);frm.setBackground(Color.YELLOW);lab.setText("黑体斜体字 ");lab.setBackground(Color.PINK);lab.setForeground(Color.BLUE);lab.setFont(new Font("黑

体 ",Font.ITALIC,20));lab.setLocation(20,60);lab.setSize(120,30);frm.add(lab);frm.setVisible(true);

　　 }}

程序分析：这个例子中，在类 Ex9_4 程序中创建了 2 个标签对象，

分别使用 setBackground() 方法和 setForeground() 方法设置标签的背景和前景颜色。

Label

示例

Color 类用于封装默认sRGB颜色空间的颜色

Font用来规范组件所用的字体、

大小和样式等

AWT 基本组件 — TextField 与 TextArea• AWT 中主要用来处理文字输入组件的类。 TextField 用来

处理单行文字，而 TextArea 可以做多行文字处理。这两个类都继承自 TextComponent 类。

• TextComponent 类：允许创建、检索和修改文本的类。public class TextComponent extends Component{

public void setText(String t)public boolean isEditable()public void setEditable(boolean b)public String getSelectedText()public void select(int selectionStart, int selectionEnd)public void setCaretPosition(int position)public int getCaretPosition()public void addTextListener(TextListener l)public void removeTextListener(TextListener l) }

import java.awt.*;public class Ex9_5{　　 public static void main(String args[]){　　

Frame frm=new Frame("更改昵称和密码 ");Label lab1=new Label(" 用户名 ");Label lab2=new Label("昵称 "); Label lab3=new Label("密码 ");TextField txf1=new TextField("student001");TextField txf2=new TextField("学生 ");TextField txf3=new TextField("123456");frm.setSize(240,120); frm.setLayout(null);frm.setBackground(Color.yellow);lab1.setBounds(20,40,40,20); lab2.setBounds(20,60,40,20);lab3.setBounds(20,80,40,20); txf1.setBounds(80,40,120,20);txf2.setBounds(80,60,120,20); txf3.setBounds(80,80,120,20);txf1.setEditable(false); // 设置不可编辑txf3.setEchoChar('*'); // 设置字符显示为“ *”

frm.add(lab1);frm.add(txf1);frm.add(lab2);frm.add(txf2);frm.add(lab3);frm.add(txf3); frm.setVisible(true);}

}

程序分析：这个例子中，在类 Ex9_5 程序中使用了 3 个文本框。其中

第一个文本框使用 setEditable() 方法设置成不可编辑，第二个文本框默认，第三个文本框里面的输入字符显示成“ *” 。

TextField 示例

import java.awt.*;public class Ex9_6{　　 public static void main(String args[]) {

Frame frm=new Frame("文本域 ");TextArea txa;txa=new

TextArea("",8,14,TextArea.SCROLLBARS_BOTH);frm.setLayout(null);txa.setBounds(30,45,180,100);frm.setSize(240,180);frm.add(txa);frm.setVisible(true);

　　 }}

程序分析：这个例子中，在类 Ex9_6 程序中程序中，产生一个 8

行 14 列的文本框，这个文本框带有垂直和水平滚动条。

TextArea 示例

AWT 基本组件 — Checkbox 、 CheckboxGroup

•复选框可以让用户选取项目。通常分为复选和单选两种。复选表示多个选项可以同时选择，而单选择表示一组选项中只能选择一项。 AWT 中提供了 Checkbox类来实现复选功能。

•而实现单选，则必须将多个复选对象利用 CheckboxGroup 类对象组成一组。请参考 API文档熟悉Checkbox, CheckboxGroup 类的构造方法和常用方法。

import java.awt.*;public class Ex9_7{　　 public static void main(String args[]){

Frame frm=new Frame("复选框 ");Label lab=new Label("您喜欢的水果 ?");Checkbox ckb1=new Checkbox("苹果 ",true);Checkbox ckb2=new Checkbox("梨子 ",true);Checkbox ckb3=new Checkbox("桔子 ");frm.setSize(200,150); frm.setLayout(null);frm.setBackground(Color.yellow);

lab.setBounds(20,30,140,20);ckb1.setBounds(20,50,140,20);ckb2.setBounds(20,70,140,20);ckb3.setBounds(20,90,140,20);

frm.add(lab); frm.add(ckb1);frm.add(ckb2); frm.add(ckb3);frm.setVisible(true); 　　 }

}

Checkbox

示例

import java.awt.*;public class Ex9_8{ public static void main(String args[]){

Frame frm=new Frame(" 单选框 ");Label lab=new Label("您的职业 ?");Checkbox ckb1=new Checkbox("教师 ");Checkbox ckb2=new Checkbox("糕点师 ");Checkbox ckb3=new Checkbox("律师 ");CheckboxGroup grp=new CheckboxGroup();frm.setSize(200,150); frm.setLayout(null);frm.setBackground(Color.yellow);lab.setBounds(20,30,140,20);

ckb1.setBounds(20,50,140,20);ckb2.setBounds(20,70,140,20);ckb3.setBounds(20,90,140,20);ckb1.setCheckboxGroup(grp);ckb2.setCheckboxGroup(grp);ckb3.setCheckboxGroup(grp);grp.setSelectedCheckbox(ckb1);// 设置 ckb1 为选中状态frm.add(lab);frm.add(ckb1);frm.add(ckb2);frm.add(ckb3);frm.setVisible(true);}

}

CheckboxG

roup

示

例