第七章 图形用户界面 57
第七章 图形用户界面
在应用程序开发中,友好的用户界面是一个最基本的要求,本章将使用Java中提供的java.AWT和javax.Swing类包中有关组件设计用户界面。
7.1 实验一:一般用户界面的实现
实验目的
(1). 了解AWT和Swing常用容器组件和基本组件的作用和功能。 (2). 了解各类布局管理器的作用和功能。
(3). 使用各类布局管理器和组件创建程序的图形用户界面。
实验要求
使用java.AWT和javax.Swing类包中提供了设计用户界面的各种组件,诸如Frame、JFrame、Panel、JPanel等容器组件、TextField、JTextField、Label、JLabel、Button、JButton等基本组件等,编写程序创建并实现简洁明了的用户界面。
实验内容
使用AWT和Swing组件创建一般的应用程序用户界面。
实验示例7.1.1 在前边定义了公司的职员信息类,成员变量包括ID(身份证)、name(姓名)、sex(性别)、birthday(生日)、home(籍贯)、address(居住地)和number(职员号),设计一个录入或显示职工信息的程序界面(以FlowSaylout布局安排组件)。 实现该示例的步骤如下:
⑴ 简要分析
可以采用Frame容器组件构建用户界面,使用Label组件显示标识,使用TextField组件输入或显示个人信息,使用Button组件确定诸如输入、显示或退出操作。
可以建立一个Frame类的派生类EmployeeMess来完成用户界面的构建。 ⑵ 根据上述简要分析,给出如下参考程序代码(EmployeeMess.java):
/*公司职员信息界面程序 EmployeeMess.java *使用AWT组件构建,采用FlowLayout布局 */
57
第七章 图形用户界面
import java.awt.*;
public class EmployeeMess extends Frame {
TextField ID = new TextField(18); TextField name = new TextField(10);
TextField birthday = new TextField(10); TextField sex = new TextField(2); TextField home = new TextField(18); TextField address = new TextField(18); TextField brithday = new TextField(10); TextField number = new TextField(5); Button oprate = new Button(\操作\ Button exit = new Button(\退出\public EmployeeMess() {
super(\公司职员信息\
this.setLayout(new FlowLayout());
this.add(new Label(\身份证号码\把组件加入到框架窗口中 this.add(ID);
this.add(new Label(\姓名\ this.add(name);
this.add(new Label(\性别\ this.add(sex);
this.add(new Label(\出生日期\ this.add(birthday);
this.add(new Label(\籍贯\ this.add(home);
this.add(new Label(\居住地\ this.add(address);
this.add(new Label(\职工号\ this.add(number); this.add(oprate); this.add(exit);
this.pack();//按合适大小显示对象
this.setVisible(true); //设置组件是可见的 } }
58
⑶ 编译EmployeeMess.java程序,生成EmployeeMess.class类文件,以供其他应用程序所用。
⑷ 程序及分析
程序中使用了AWT组件来构建用户界面,在Frame容器上摆放Label、TextField和Button组件,由于采用了FlowLayout布局, 所以布局在容器上组件的大小不会随容器大图7-1 示例7.1.1用户界面 小的改变而改变,而组件所在的行会改变。
⑸ 测试EmployeeMess类的功能。编写一个简单的应用程序,创建EmployeeMess对象,验证EmployeeMess的功能。参考代码如下:
public class TestEmployeeMess {
public static void main( String[] args ) {
new EmployeeMess(); } 58
第七章 图形用户界面
}
59
编译并运行测试程序,用户界面经鼠标拖动改变大小后,如图7-1所示。 注意:该程序不能正常退出,只能强行退出。
自由练习7.1 仿照实验示例7.1.1,设计一个录入或显示学生信息的程序界面。学生信息量包括ID(身份证)、name(姓名)、sex(性别)、birthday(生日)、home(籍贯)、number(学号)和result(入学成绩),以FlowSaylout布局安排组件。 实验示例7.1.2 编程实现一个如图7-2的小学生习题训练用户界面。
实现该示例的步骤如下: ⑴ 简要分析
为了使该界面应用于其他程序,可以使用
JPanel组件构建界面。根据要求该界面有3行组图7-2 示例7.1.2程序界面 成:第一行由一个标签(JLabel)和一个按钮
(JButton)组件构成;第二行可以由4个标签(分别表示两个运算数、运算符号和等号)和一个文本框(JTextField)组件构成;第3行由一个按钮构成。
由上所述,由于第1行和第2行含有多个组件,可以将它们分别以FlowLayout流布局放在JPanel容器中。这样就可以GridLayout布局按3行的形式将所有组件摆放到界面上。
⑵ 根据上述简要分析,可以给出如下参考程序代码(StudentSreen.java):
/* 小学生训练题界面
* StudentScreen.java */
import java.awt.*; import javax.swing.*;
public class StudentScreen extends JPanel {
JLabel num1=new JLabel(\显示第1个运算数 JLabel num2=new JLabel(\显示第2个运算数 JLabel op=new JLabel(\显示运算符号
JLabel info=new JLabel(\测试时间10分钟,按'开始'键开始!\ JTextField answer=new JTextField(10); //输入运算结果 JButton next = new JButton(\下一题\操作按钮 JButton start = new JButton(\开始\操作按钮 JPanel pan1=new JPanel(); JPanel pan2=new JPanel(); JPanel pan3=new JPanel(); public StudentScreen() {
setLayout(new GridLayout(3,1)); pan1.add(info); //将第1行的组件放在pan1容器中 pan1.add(start);//…………………… pan2.add(num1); //将第2行的组件放在pan2容器中 pan2.add(op); //…………………… pan2.add(num2); //…………………… pan2.add(new JLabel(\…………………… pan2.add(answer); //……………………
add(pan1); //将pan1(第1行的组件)摆放在界面上 add(pan2); //将pan2(第2行的组件)摆放在界面上
59
第七章 图形用户界面
add(next); ////将next按钮(第3行的组件)摆放在界面上 } }
60
⑶ 编译StudentSreen.java程序,生成StudentSreen.class类文件,以供其他应用程序所用。
⑷ 程序及分析
本程序使用swing组件构建用户屏幕,采用JPanel容器嵌套JPanel容器的方式,目的是该界面可以添加到Frame或JFrame容器上,为其他程序所用。
⑸ 测试StudentSreen类的功能。编写一个简单的应用程序,将StudentSreen对象添加到JFrame窗口上,验证StudentSreen的功能。参考代码如下:
import javax.swing.*;
public class TestStudentScreen extends JFrame {
TestStudentScreen() {
add(new StudentScreen()); setVisible(true); pack();
setDefaultCloseOperation(3); }
public static void main(String [] args) {
new TestStudentScreen(); } }
编译并执行该程序,观看程序的界面效果。
实验示例7.1.3 在实验示例7.1.1中设计的用户界面,是用FlowSayout布局组件的,组件的大小不随容器的变化而变化,布局有些不太整齐,修改此用户界面,改用GridLayout布局,使界面整洁一些。
实现该示例的步骤如下: ⑴ 简要分析
为了界面的整洁性,可以使用Swing组件构建用户界面,为了使该界面能部署在JFrame窗体容器上,采用JPanel容器来构建用户界面屏幕,并在JPanel容器中嵌套两个JPanel容器,一个JPanel容器上布局用于显示标识的Label组件和输入或显示个人信息的TextField组件,以一行四列的形式摆放组件;另一个JPanel容器上布局Button组件,以一行两列的形式摆放。
⑵ 根据上述简要分析,给出如下参考程序代码(EmployeeMess2.java):
/*公司职员信息界面程序 EmployeeMess2.java *使用Swing组件构建,采用GridLayout布局 */
import java.awt.*;
import javax.swing.*;
public class EmployeeMess2 extends JPanel {
JTextField ID = new JTextField(18); JTextField name = new JTextField(10);
JTextField birthday = new JTextField(10); JTextField sex = new JTextField(2); 60
61 第七章 图形用户界面
JTextField home = new JTextField(18); JTextField address = new JTextField(18); JTextField number = new JTextField(5); JButton oprate = new JButton(\操作\ JButton exit = new JButton(\退出\ JPanel jp1=new JPanel(); JPanel jp2=new JPanel(); public EmployeeMess2() {
this.setLayout(new GridLayout(2,1));//设置JPanel容器上组件布局为2行1列 jp1.setLayout(new GridLayout(0,4)); //设置jp1容器上组件的布局为n行4列 jp1.add(new JLabel(\身份证号码\把组件加入jp2容器中 jp1.add(ID); //.................. jp1.add(new JLabel(\姓名\ jp1.add(name); //.................. jp1.add(new JLabel(\性别\ jp1.add(sex); //.................. jp1.add(new JLabel(\出生日期\ jp1.add(birthday); //.................. jp1.add(new JLabel(\籍贯\ jp1.add(home); //.................. jp1.add(new JLabel(\居住地\ jp1.add(address); //.................. jp1.add(new JLabel(\职工号\ jp1.add(number); //..................
jp2.setLayout(new GridLayout(1,2)); //设置jp2容器上组件的布局为1行2列 jp2.add(oprate); //将按钮添加到jp2容器上 jp2.add(exit); //..................... this.add(jp1); //将jp1放入当前容器中
this.add(jp2); //............................ this.setSize(200,200); } }
⑶ 编译EmployeeMess2.java程序,生成EmployeeMess2.class类文件,以供其他应用程序所用。
⑷ 程序及分析
程序中使用了swing组件来构建用户界面,在JPanel容器上嵌套摆放了两个JPanel容器组件,在两个Jpanel容器上分别布局了表示职工信息的组件和操作按钮组件。
由于全部采用了GridLayout布局,所以嵌套在JPanel容器上的两个JPanel组件的大小是一样的,同样布局在第一个JPanel容器上的所有组件其大小是一样,而布局在第二个JPanel容器上的两个按钮其大小也是一样的。它们会随界面大小的改变而改变,而组件所在的行不会改变。
⑸ 测试EmployeeMess2类的功能。编写一个简单的应用程序,创建一个JFrame窗口对象,将EmployeeMess2对象添加到JFrame窗口上,验证EmployeeMess2的功能。参考代码如下:
import javax.swing.*;
public class TestEmployeeMess2 {
public static void main( String[] args ) {
图7-3 示例7.1.3 用户界面
61