4 图形用户界面设计
本章要点
Java图形用户界面设计的基本知识
布局管理器的应用
Java常用图形用界面设计组件的应用
Java常用组件事件处理的应用
4.1  认识AWT包和Swing
    用户界面是计算机用户与软件之间的交互接口。一个功能完善,使用方便的用户界面可以使软件的操作更加简单,使用户与程序之间的交互更加有效。因此图形用户界面(graphics user interface,GUI)的设计和开发已经成为软件开发中的一项重要的工作。
    Java语言提供的开发图形用户界面(GUI)的功能包括AWT(Abstract Window Toolkit)和Swi
ng两部分。这两部分功能由Java的两个包来完成-awt和swing。虽然这两个包都是用于图形用户界面的开发,但是它们不是同时被开发出来了。awt包是最早被开发出来的。但是使用awt包开发出来的图形用户界面并不完美,在使用上非常的不灵活。比如awt包所包含的组件,其外观是固定的,无法改变,这就使得开发出来的界面非常死板。这种设计是站在操作系统的角度开发图形用户界面,主要考虑的是程序与操作系统的兼容性。这样做的最大问题就是灵活性差,而且程序在运行时还会消耗很多系统资源。
    由于awt包的不足表现,SUN公司于1998年针对它存在的问题,对其进行了扩展,开发出了Swing,即swing包。但是,SUN公司并没有让swing包完成替代awt包,而是让这两个包共同存在,互取所需。awt包虽然存在缺点,但是仍然有可用之处,比如在图形用户界面中用到的布局管理器、事件处理等依然采用的是awt包的内容。
    Java有两个主要类库分别是Java包和Javax包。在Java包中存放的是Java语言的核心包。Javax包是Sun公司提供的一个扩展包,它是对原Java包的一些优化处理。
    swing包由于是对awt包的扩展和优化,所以是存放在Javax包下的,而awt包是存放在Java包下的。虽然swing是扩展包,但是,现在的图形用户界面基本都是基于swing包开发的。
    swing包的组件大部分是采用纯Java语言进行开发的,这就大大增加了组件的可操作性,尤其是组件的外观。通常情况下,只要通过改变所传递的参数的值,就可以改变组件的外观。而且swing包还提供Look and Feel功能,通过此功能可以动态改变外观。Swing包中也有一些组件不是用纯Java语言编写的,这些组件一般用于直接和操作系统进行交互的。
4.2  布局管理器
    在本节中将对图形用户界面中的布局管理器进行介绍。
【任务1】认识图形用户界面。
1. 基础知识
    先来看一个用Java语言编写的图形用户界面的例子,如图4-1所示。
图4-1  一个图形用户界面
    图4-1是一个帮助文件的用户界面。通过这个界面,我们来介绍三个与图形用户界面有关的术语。
    (1) 组件:构成图形用户界面的各种元素称为组件。图4-1中,放在“帮助窗口”中的每个一信息都是一个组件。例如“确定”按钮就是一种组件。
    (2) 容器:是图形用户界面中容纳组件的部分,一个容器可容纳一个或多个组件,甚至可以容纳其他容器。窗口就是一种容器。例如图4-1中的组件全部都是放在“帮助窗口”这个容器中的。容器与组件的的关系就像杯子和水的关系。需要说明的是,容器也可以被称为组件。
java布局管理器    (3) 布局管理器:组件在被放到容器中时,要遵循一定的布局方式。在Java的图形用户界面中,有专门的类来管理组件的布局,称这些类为布局管理器。在“帮助窗口”中每一条信息都是一个组件,这些组件应该如何安排就是由布局管理器负责的。所谓的布局管理器,实际上就是能够对组件进行布局管理的类。
    用吃饭的例子就能很好的说明这三个术语之间的关系。容器就是吃饭的桌子,组件就是一
盘盘的菜。我们放菜的时候总要安排一下哪个菜应该放在什么位置,这就是布局管理器。
2. 任务实施
    本任务的代码内容如下:
1
import java.awt.*;
2
import javax.swing.*;
3
public class FrameEx
4
{
5
        public void go()
6
        {
7
          JFrame win = new JFrame("帮助窗口");
8
          Container contentPane = ContentPane();
9
          contentPane.setLayout(new GridLayout(5,1));
10
          JLabel labOne = new JLabel("计算机基础模拟练习系统的1.0",JLabel.CENTER);
11
          JLabel labTwo = new JLabel("北京信息职业技术学院",JLabel.CENTER);
12
          JLabel labThree = new JLabel("软件工程系制作",JLabel.CENTER);
13
          JLabel labFour = new JLabel("(c)版权所有20106",JLabel.CENTER);
14
          JButton queding = new JButton("确定");
15
          contentPane.add(labOne);
16
          contentPane.add(labTwo);
17
          contentPane.add(labThree);
18
          contentPane.add(labFour);
19
          contentPane.add(queding);
20
          win.setSize(200,200);
21
          win.setVisible(true);
22
        }
23
  public static void main(String arg[]){
24
    FrameEx fe = new FrameEx();
25
    fe.go();
26
  }
27
}
3. 分析与提高
    (1) 第1行和第2行的作用就是将awt包和swing包引入到该程序中,因为该程序中要用到awt包和swing包中的类。例如第8行用到的Container类和第9行的GridLayout类都属于awt包。其他以“J”开头的类都属于swing包。这样做的目的很容易理解。例如,Containe类是Java语言的开发者事先定义好的类。关于这个类的一些功能也是设定好的。作为使用者,只要将这个类用import的方式引入到自己的程序中就可以使用它了。这两个包的引用会在图形用户界面的程序中经常用到。
    (2) 第7行定义的是一个窗口。第8行是开发图形用户界面必须要用到的类,这个类的作用会在后面的章节进行更详细的解释。
    (3) 第9行是对窗口进行了布局管理器设置,通过GridLayout布局管理器,将窗口划分成5行,1列。
    (4) 第10行至第13行定义了窗口要显示的信息。
    (5) 第14行定义了“确定”按钮。
    (6) 第15至第19行是将定义好的组件放入到窗口中。
    (7) 第20行定义了窗口的初始大小。
    (8) 第21行定义了窗口的可显示性。
    (9) 第24行和第25行是FrameEx类的对象,并通过这个对象调用go()方法,使这个帮助窗口运行起来。
    在此只对程序进行粗略解释,目的只是让读者对图形用户界面有个初步的认识。在后面的任务中会逐个对各种组件和它们的应用进行详细介绍。
4.2.1  FlowLayout布局管理器应用
【任务2】认识FlowLayout布局管理器。
1. 基础知识
    FlowLayout是一个最简单的布局管理器,这个布局管理器的功能就是将容器中的组件从左
到右,从上到下的排列。因此,它又被称为流布局管理器。例如图4-1中,帮助窗口共有五个组件。它们在窗口中的排列方式是5行,1列。如果采用FlowLayut布局管理器,那么窗口的执行结果应该是图4-2的样式。所有组件是按照添加时的顺序,按从左到右,从上到下的顺序排列的。默认情况下,第一个被添加的组件摆放在第1行居中位置,其后添加的组件摆放在第一个组件的后面。当第1行再也放不下组件的时候,其后的组件从第2行开始从左到右摆放。以此类推,直到添加完所有组件。
图4-2  FlowLayout布局管理器
2. 任务实施
    任务1中的第9行就是对窗口布局的设置语句。语句如下:
    contentPane.setLayout(new GridLayout(5,1));
    只要对这一行进行更改,就可以达到应用FLowLayout布局管理器的目的。
    contentPane是一个对象,它指向的是Container类。关于这个类的含义和作用会在以后的章节中详细讲解。读者暂时只需要知道contentPane引用是指向所建立的“帮助窗口”就可以了。
    从contentPane所调用的setLayout()方法的方法名的含义就可以知道这个方法的作用—设置(set)布局(layout)。通过对这个方法的参数赋予不同布局管理器的引用,达到对窗口进行布局设置的目的。
    要实现将“帮助窗口”的布局管理器设置为FlowLayout,只需要做如下的更改。
    contentPane.setLayout(new FlowLayout());
    其中的参数new FlowLayout()实际上是FlowLayout类的一个引用。这条语句的含义就是:将contentPane所指向窗口的布局管理器设置成FlowLayout。
    还有另外一种设置布局管理器的方法。如下语句所示。
    语句1:FlowLayout flow= new FlowLayout();
    语句2:contentPane.setLayout(flow);
    语句1创建了FlowLayout布局管理器的引用。语句2将语句1所创建的flow引用作为参数传递给setLayout ()方法。
    flow引用等价于new FlowLayout()。因此,语句contentPane.setLayout(new FlowLayout())实际上是语句1和语句2的组合写法。
3. 分析与提高
    FlowLayout布局管理器是Panel和Applet容器的默认局管理器。如果不专门对Panel和Applet进行布局管理器设置的话,它们的组件的布局将按FlowLayout进行管理。Panel和Applet都是一种容器。Panel和窗口很类似,Applet是嵌在浏览器中使用的一种客容器。这两个容器会在后面的章节中介绍。
    FlowLayout布局管理器对窗口中的组件的管理是与窗口的大小有关的。在任务1中有如下的语句:
    win.setSize(200,200);
这条语句设置了窗口的初始值大小。第一个参数为窗口的宽度,第二个参数为窗口的高度。FlowLayout布局管理器会根据这个大小来摆放组件。如果我们使用拖动的方法,改变窗口的大小,窗口中组件的排列方式也会跟着改变。
    每个组件也有自己的初始大小。当窗口设置的宽度小于组件的初始宽度时,窗口宽度会自动变为组件的宽度,但窗口高度不会改变。
    在摆放组件时,如果不设定组件的对齐方式,那么FlowLayout布局管理器是按居中对齐的方式摆放组件的。也可以通过向FlowLayout构造方法传递参数的方式设置所需的对齐方式。FlowLayout布局管理器的对齐方式有:FlowLayout.CENTER、FlowLaout.TRAILING和FlowLayout.LEADING。分别表示居中对齐、右对齐和左对齐。
    设置的方法如下面的语句所示:
    contentPane.setLayout(new FlowLayout(FlowLayout.LEADING));
    这语句可以将组件的对齐方式设置为左对齐
    还可以设置组件之间的水平和垂直间距。
    设置的方法如下面的语句所示:
    contentPane.setLayout(new FlowLayout(FlowLayout.LEADING , 50 , 50));

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。