实验十四 Swing图形界面组件
实验时间 20178-11-29
理论知识
Swing和MVC设计模式
（1）设计模式（Design pattern）是设计者一种流行的 思考设计问题的方法，是一套被反复使用，多数人 知晓的，经过分类编目的，代码设计经验的总结。
（2）模型-视图-控制器设计模式(Model –ViewController )是Java EE平台下创建 Web 应用程序 的重要设计模式。
（3）MVC设计模式 – Model（模型）：是程序中用于处理程序数据逻 辑的部分，通常模型负责在数据库中存取数据。
– View（视图）：是程序中处理数据显示的部分， 通常视图依据模型存取的数据创建。
– Controller（控制器）：是程序中处理用户交互 的部分。通常控制器负责从视图读取数据，控制 用户输入，并向模型发送数据。
（4）Java组件有内容、外观、行为三个主要元素；
布局管理器
（1）布局管理器是一组类。 – 实现 java.awt.LayoutManager 接口 – 决定容器中组件的位置和大小
Java.awt包中定义了5种布局管理类，每一种布 局管理类对应一种布局策略。
每个容器都有与之相关的默认布局管理器。
（2）5种布局管理器：（1）FlowLayout: 流布局(Applet和Panel的默认 布局管理器） （2）BorderLayout:边框布局( Window、Frame和 Dialog的默认布局管理器） （3）GridLayout: 网格布局 （4）GridBagLayout: 网格组布局 （5）CardLayout :卡片布局
3、GridLayout的构造函数如下：1、GridLayout():生成一个单行单列的网格布局
2、GridLayout(int rows,int cols):生成一个设定行数 和列数的网格布局
3、GridLayout(int rows,int columns,int hgap,int vgap)： 可以设置组件之间的水平和垂直间隔
文本输入
（1）文本域(JTextField) : 用于获取单行文本输入。
（2）文本区（JTextArea）组件可让用户输入多行文 本。生成JTextArea组件对象时，可以指定文本 区的行数和列数： textArea = new JTextArea(8, 40);
(3)文本区与文本域的异同相同之处： 文本域和文本区组件都可用于获取文本输入。
不同之处： 文本域只能接受单行文本的输入； 文本区能够接受多行文本的输入。
(4)文本区JTextArea的常用API：Java.swing. JTextArea 1.2 – JTextArea(int rows, int cols)
构造一个rows行cols列的文本区对象 – JTextArea(String text，int rows, int cols)
用初始文本构造一个文本区对象 – void setRows(int rows)
设置文本域使用的行数 – void append(String newText)
将给定文本附加到文本区中已有文本的后面 – void setLineWrap(boolean wrap)
打开或关闭换行
（5）标签组件：标签是容纳文本的组件。它们没有任何修饰（如没有边界 ），也不响应用户输入。
标签的常用用途之一就是标识组件，例如标识文本域。其使用步骤如下：
1. 创建一个JLabel组件
2. 将标签组件放置在距离被标识组件足够近的地方。
（6）密码域：密码域是一种特殊类型的文本域。每个输入的字 符都用回显字符实现,典型的回显字符为*。
– JPassWordField(String text, int columns） 构造一个密码域对象
（7）滚动窗格：
Swing中文本区没有滚动条，若需要滚动条。将文 本区放入一个滚动窗格中即可。
常用API—Java.swing. JScrollPane(教材340页) – JScrollPane(Component c) 在组件c上添加滚动条，返回添加后的组件。
选择组件
复选框 单选按钮 边框 组合框 滑动条
（1）复选框构造器 1.bold = new JCheckBox("Bold"); 复选框自动地带有表示标签。
2. JCheckBox(String label,Icon icon); 构造带有标签与图标的复选框，默认初始未被选择。
3.JCheckBox(String label,boolean state); 用指定的标签和初始化选择状态构造一个复选框
（2）单选按钮的构造器（教材492页） 1.JRadioButton(String label,Icon icon); 创建一个带标签和图标的单选按钮
2.JRadioButton(String label,boolean state); 用指定的标签和初始化状态构造单选按钮
（3）按钮组：为单选按钮组构造一个ButtonGroup的对象。 然后，再将JRadioButton类型的对象添加到按钮 组中。按钮组负责在新按钮被按下的时，取消前一 个按钮的选择状态。
（4）如果在一个窗口中 有多组复选框或单选按 钮，就需要可视化的形 式指明哪些按钮属于同 一组。Swing提供了一 组很有用的边框
（5）如果有多个选择项，使用单选按钮占据的屏幕空 间太大时，就可以选择组合框。
faceCombo = new JComboBox()； faceCombo.setEditable(true);
让组合框可编辑 faceCombo.addItem("Serif"); faceCombo.insertItemAt("Monospace",0);
增加组合框选项 faceCombo.removeItem("Monospace");
faceCombo.removeItemAt(0); 删除组合框选项内容
（6）组合框的事件监听：为了判断组合框的哪个选项被选择，可通过 事件参数调用getSource方法来得到发送事件的组 合框引用，接着调用getSelectdeItem方法获取当 前选择的选项。
（7）滑动条：滑动条可以让用户从一组离散值中进行选择 ，并且它还允许进行连续值得选择。
菜单
菜单创建 菜单项中的图标 复选框和单选按钮菜单项 弹出菜单 快捷键和加速器 启用和禁用菜单项 工具栏 工具提示
网格组布局 (GridBagLayout):GridBagLayout与GridLayout有点相似，它也是 将组件排在格子里，但是GridBagLayout在网格 的基础上提供更复杂的布局。
GridBagLayout允许单个组件在一个单元中不填 满整个单元，而只是占用最佳大小，也允许单个 组件扩展成不止一个单元，并且可以用任意顺序 加入组件。
定制布局管理器: 程序员可通过自己设计LayoutManager类来实现 特殊的布局方式。
定制布局管理器需要实现LayoutManager接口， 并覆盖以下方法。
对话框
选项对话框 创建对话框 数据选择 文件对话框 颜色选择器
(1)对话框是一种大小不能变化、不能有菜单的容器窗口； 对话框不能作为一个应用程序的主框架，而必须包含在其 他的容器中。
(2)选项对话框:JOptionPane提供的对话框是模式对话框。当模 式对话框显示时，它不允许用户输入到程序的 其他的窗口。使用JOptionPane，可以创建和自 定义问题、信息、警告和错误等几种类型的对 话框。
(3)数据交换:输入对话框含有供用户输入文本的文本框、一个确认和取 消按钮,是有模式对话框。当输入对话框可见时,要求用户 输入一个字符串。
(4)文件对话框:专门用于对文件（或目录）进行浏览和选择的对 话框，常用的构造方法: – JFileChooser()：根据用户的缺省目录创建文件对话框 – JFileChooser(File currentDirectory)：根据File型参数 currentDirectory指定的目录创建文件对话框
(5)颜色对话框: javax.swing包中的JColorChooser类的静态方 法: public static Color showDialog(Component component, String title, Color initialColor)创建一个颜色对话框
(6)参数component指定对话框所依赖的组件，title 指定对话框的标题；initialColor 指定对话框返回 的初始颜色，即对话框消失后，返回的默认值。 颜色对话框可根据用户在颜色对话框中选择的颜 色返回一个颜色对象.
1、实验目的与要求
(1) 掌握GUI布局管理器用法；
(2) 掌握各类Java Swing组件用途及常用API；
2、实验内容和步骤
实验1： 导入第12章示例程序，测试程序并进行组内讨论。
测试程序1
l 在elipse IDE中运行教材479页程序12-1，结合运行结果理解程序；
l 掌握各种布局管理器的用法；
l 理解GUI界面中事件处理技术的用途。
l 在布局管理应用代码处添加注释；
package calculator; import java.awt.*;
import java.awt.event.*;
import javax.swing.*; /**
* A panel with calculator buttons and a result display.
*/
public class CalculatorPanel extends JPanel
{
//属性
private JButton display;
private JPanel panel;
private double result;
private String lastCommand;
private boolean start;
//构造器
public CalculatorPanel()
{
setLayout(new BorderLayout());//设定新的边框布局管理器 result = 0;
lastCommand = "=";
start = true; // 添加display display = new JButton("0");//用来显示完成算式计算结果
display.setEnabled(false);//使得使能属性不能起作用
add(display, BorderLayout.NORTH);//将display添加到北部区域
//生成监听器对象
ActionListener insert = new InsertAction();
ActionListener command = new CommandAction(); // 在4 x 4网格中添加按钮 panel = new JPanel();//新建窗格组件
panel.setLayout(new GridLayout(4, 4));//设定4行4列的网格布局管理器
//生成16个事件源，数字注册的事件源是insert对象，运算符注册的事件源是command对象
addButton("7", insert);
addButton("8", insert);
addButton("9", insert);
addButton("/", command); addButton("4", insert);
addButton("5", insert);
addButton("6", insert);
addButton("*", command); addButton("1", insert);
addButton("2", insert);
addButton("3", insert);
addButton("-", command); addButton("0", insert);
addButton(".", insert);
addButton("=", command);
addButton("+", command); add(panel, BorderLayout.CENTER);//将panel添加到中部区域 } /**
* Adds a button to the center panel.
* @param label the button label
* @param listener the button listener
*/
//方法
private void addButton(String label, ActionListener listener)
{
JButton button = new JButton(label);//生成按钮对象
button.addActionListener(listener);//注册监听器对象
panel.add(button);//将其添加到窗格中
} /**
* This action inserts the button action string to the end of the display text.
*/
//内部类
private class InsertAction implements ActionListener
{
public void actionPerformed(ActionEvent event)
{
String input = event.getActionCommand();
if (start)//开始计算
{
display.setText("");
start = false;
}
display.setText(display.getText() + input);//完成多个数字的输入操作
}
} /**
* This action executes the command that the button action string denotes.
*/
//内部类
private class CommandAction implements ActionListener
{
public void actionPerformed(ActionEvent event)
{
String command = event.getActionCommand(); if (start)//开始计算还没有输入数字
{ if (command.equals("-"))
{
display.setText(command);//显示符号
start = false;
}
else lastCommand = command;
}
else
{
calculate(Double.parseDouble(display.getText()));//将数字字符串转化为数字
lastCommand = command;
start = true;
}
}
} /**
* Carries out the pending calculation.
* @param x the value to be accumulated with the prior result.
*/
//计算方法
public void calculate(double x)
{
if (lastCommand.equals("+")) result += x;
else if (lastCommand.equals("-")) result -= x;
else if (lastCommand.equals("*")) result *= x;
else if (lastCommand.equals("/")) result /= x;
else if (lastCommand.equals("=")) result = x;
display.setText("" + result);//将数字转化为数字字符串输出
}
}
package calculator; import java.awt.*;
import javax.swing.*; /**
* @version 1.34 2015-06-12
* @author Cay Horstmann
*/
public class Calculator
{
public static void main(String[] args)
{
EventQueue.invokeLater(() -> {
CalculatorFrame frame = new CalculatorFrame();
frame.setTitle("Calculator");//设置标题
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//关闭
frame.setVisible(true);//设置可见
});
}
}
package calculator; import javax.swing.*; /**
* A frame with a calculator panel.
*/
public class CalculatorFrame extends JFrame
{
public CalculatorFrame()
{
add(new CalculatorPanel());
pack();
}
}
测试程序2
l 在elipse IDE中调试运行教材486页程序12-2，结合运行结果理解程序；
l 掌握各种文本组件的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序3
l 在elipse IDE中调试运行教材489页程序12-3，结合运行结果理解程序；
l 掌握复选框组件的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序4
l 在elipse IDE中调试运行教材491页程序12-4，运行结果理解程序；
l 掌握单选按钮组件的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序5
l 在elipse IDE中调试运行教材494页程序12-5，结合运行结果理解程序；
l 掌握边框的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序6
l 在elipse IDE中调试运行教材498页程序12-6，结合运行结果理解程序；
l 掌握组合框组件的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序7
l 在elipse IDE中调试运行教材501页程序12-7，结合运行结果理解程序；
l 掌握滑动条组件的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序8
l 在elipse IDE中调试运行教材512页程序12-8，结合运行结果理解程序；
l 掌握菜单的创建、菜单事件监听器、复选框和单选按钮菜单项、弹出菜单以及快捷键和加速器的用法。
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序9
l 在elipse IDE中调试运行教材517页程序12-9，结合运行结果理解程序；
l 掌握工具栏和工具提示的用法；
l 记录示例代码阅读理解中存在的问题与疑惑。
package toolBar; import java.awt.*;
import javax.swing.*; /**
* @version 1.14 2015-06-12
* @author Cay Horstmann
*/
public class ToolBarTest
{
public static void main(String[] args)
{
EventQueue.invokeLater(() -> {
ToolBarFrame frame = new ToolBarFrame();
frame.setTitle("ToolBarTest");//设置标题
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);//设置可见
});
}
}
package toolBar; import java.awt.*;
import java.awt.event.*;
import javax.swing.*; /**
* A frame with a toolbar and menu for color changes.
*/
public class ToolBarFrame extends JFrame
{
private static final int DEFAULT_WIDTH = 300;
private static final int DEFAULT_HEIGHT = 200;
private JPanel panel; public ToolBarFrame()
{
setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT); // 添加颜色更改面板 panel = new JPanel();
add(panel, BorderLayout.CENTER); // 设定动作
Action blueAction = new ColorAction("Blue", new ImageIcon("blue-ball.gif"), Color.BLUE);
Action yellowAction = new ColorAction("Yellow", new ImageIcon("yellow-ball.gif"),
Color.YELLOW);
Action redAction = new ColorAction("Red", new ImageIcon("red-ball.gif"), Color.RED); Action exitAction = new AbstractAction("Exit", new ImageIcon("exit.gif"))
{
public void actionPerformed(ActionEvent event)
{
System.exit(0);
}
};
exitAction.putValue(Action.SHORT_DESCRIPTION, "Exit"); //填充工具栏 JToolBar bar = new JToolBar();
bar.add(blueAction);
bar.add(yellowAction);
bar.add(redAction);
bar.addSeparator();
bar.add(exitAction);
add(bar, BorderLayout.NORTH); // populate menu JMenu menu = new JMenu("Color");
menu.add(yellowAction);
menu.add(blueAction);
menu.add(redAction);
menu.add(exitAction);
JMenuBar menuBar = new JMenuBar();
menuBar.add(menu);
setJMenuBar(menuBar);
} /**
* The color action sets the background of the frame to a given color.
*/
class ColorAction extends AbstractAction
{
public ColorAction(String name, Icon icon, Color c)
{
putValue(Action.NAME, name);
putValue(Action.SMALL_ICON, icon);
putValue(Action.SHORT_DESCRIPTION, name + " background");
putValue("Color", c);
} public void actionPerformed(ActionEvent event)
{
Color c = (Color) getValue("Color");
panel.setBackground(c);
}
}
}
测试程序10
l 在elipse IDE中调试运行教材524页程序12-10、12-11，结合运行结果理解程序，了解GridbagLayout的用法。
l 在elipse IDE中调试运行教材533页程序12-12，结合程序运行结果理解程序，了解GroupLayout的用法。
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序11
l 在elipse IDE中调试运行教材539页程序12-13、12-14，结合运行结果理解程序；
l 掌握定制布局管理器的用法。
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序12
l 在elipse IDE中调试运行教材544页程序12-15、12-16，结合运行结果理解程序；
l 掌握选项对话框的用法。
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序13
l 在elipse IDE中调试运行教材552页程序12-17、12-18，结合运行结果理解程序；
l 掌握对话框的创建方法；
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序14
l 在elipse IDE中调试运行教材556页程序12-19、12-20，结合运行结果理解程序；
l 掌握对话框的数据交换用法;
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序15
l 在elipse IDE中调试运行教材556页程序12-21、12-22 12-23，结合程序运行结果理解程序；
l 掌握文件对话框的用法;
l 记录示例代码阅读理解中存在的问题与疑惑。
测试程序16
l 在elipse IDE中调试运行教材570页程序12-24，结合运行结果理解程序；
l 了解颜色选择器的用法。
l 记录示例代码阅读理解中存在的问题与疑惑。
实验2：组内讨论反思本组负责程序，理解程序总体结构，梳理程序GUI设计中应用的相关组件，整理相关组件的API,对程序中组件应用的相关代码添加注释。
我们组这次所分析的是工具栏和工具提示的用法方面的知识，工具栏(Toolbar Test)是在程序中提供的快速访问常用命令的按纽栏，它可以随意的移动安放，可以用JToolBar bar=new JToolBar();来创建工具栏。但工具栏有缺点，为了便利用户能快速明白小按钮的含义，用户界面设计者发明了工具提示toooltips,示例程序说明了如何将一个Action对象添加到菜单和工具栏中。
实验3：组间协同学习：在本班课程QQ群内，各位同学对实验1中存在的问题进行提问，提问时注明实验1中的测试程序编号，负责对应程序的小组需及时对群内提问进行回答。