实验四 图形用户界面编程 实验报告

实验四图形用户界面编程实验报告
一、实验目的
1. 掌握常用组件的定义及使用
2. 理解常见的布局方式及其特点
3. 掌握事件处理机制
二、实验原理
1. 常用控件：
① JTextField：用于接受文本输入，表现为图形界面中文本框。

② JLabel：标签控件，表现为图形界面中的文字控件。

③ JSplitPane：一个用于把面板分成两个大小可以调整的面板的控件。

④JScrollPane：一个提供滚动支持的面板，当内容超出面板大小时，会自动下按时
滚动条。

⑤ JPanel：普通的面板。

可以通过布局管理器来控制面板中控件的布局。

⑥ JButton：按钮控件。

⑦ JPasswordField：用于接受密码的输入，表现为图形界面的密码输入框。

⑧ JList：列表框控件。

2. 每次单击按钮控件时，可以通过addActionListener方法对按钮注册监听，从而实现单击事件的监听。

三、实验内容
通过编写一个程序实现上面的界面
四、实验过程
1. 界面的分析，实验要求中的界面主要分成上下的两部分，界面的下面部分用于显示在上面文本框输入的用户名和密码，而上部分又分成了输入姓名和密码的区域。

而且根据实验的要求，需要把输入的用户名和密码添加到列表框之中，这需要一个按钮。

根据分析，可以得到整个界面控件的关系如下：
2. 代码的编写：
首先，如果要创建一个窗口，则需要编写一个JFrame的子类。

public class MainFrame extends JFrame {
}
然后，在类之中声明需要用的控件（需要用的控件在上述已经全部列出）
private JSplitPane mainSplitPane = null;
private JSplitPane inputSplitPane = null;
private JSplitPane topSplitPane = null;
private JScrollPane listBoxPane = null;
private JPanel buttonPanel = null;
private JPanel usernamePanel = null;
private JPanel passwordPanel = null;
private JButton okButton = null;
private JTextField username = null;
private JPasswordField password = null;
private JList listBox = null;
private JLabel usernameLabel = null;
private JLabel passwordLabel = null;
再然后，编写类的构造方法，对控件进行初始化以及进行相应的布局，同时对JFrame 的一些属性进行调整。

public MainFrame() {
ername = new JTextField(10);
this.password = new JPasswordField(10);
ernameLabel = new JLabel("输入姓名：");
this.passwordLabel = new JLabel("输入密码：");
this.okButton = new JButton("确定");
this.listBox = new JList(new DefaultListModel());
ernamePanel = new JPanel(
new FlowLayout(FlowLayout.CENTER));
ernamePanel.add(ernameLabel);
ernamePanel.add(ername);
this.passwordPanel = new JPanel(
new FlowLayout(FlowLayout.CENTER));
this.passwordPanel.add(this.passwordLabel);
this.passwordPanel.add(this.password);
this.listBoxPane = new JScrollPane(listBox);
this.buttonPanel = new JPanel(new FlowLayout());
this.buttonPanel.add(okButton);
this.inputSplitPane =
new JSplitPane(JSplitPane.HORIZONTAL_SPLIT,
ernamePanel, this.passwordPanel);
this.topSplitPane =
new JSplitPane(JSplitPane.HORIZONTAL_SPLIT,
inputSplitPane, buttonPanel);
this.mainSplitPane = new JSplitPane(JSplitPane.VERTICAL_SPLIT, this.topSplitPane, this.listBoxPane);
this.setLayout(new BorderLayout());
this.add(this.mainSplitPane, BorderLayout.CENTER);
this.setTitle("测试");
this.setLocationByPlatform(true);
this.setSize(500, 300);
this.setDefaultCloseOperation(EXIT_ON_CLOSE);
this.setVisible(true);
}
最后对按钮注册监听器。

这里采用了一个实现ActionListener的内部类的方法。

代码如下：
private final class ClickEvent implements ActionListener { @Override
public void actionPerformed(ActionEvent e) {
// 分别获得输入用户名和输入密码的文本框中的字符
String username = ername.getText();
String password =
new String(MainFrame.this.password.getPassword());
// 把用户名和密码组成成一个字符串并添加到列表框中
String newLine =
String.format("姓名：%s；密码：%s", username, password);
DefaultListModel model =
(DefaultListModel) MainFrame.this.listBox.getModel();
model.addElement(newLine);
}
}
运行结果如下：
五、完整代码
import java.awt.BorderLayout;
import java.awt.FlowLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.DefaultListModel;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JList;
import javax.swing.JPanel;
import javax.swing.JPasswordField;
import javax.swing.JScrollPane;
import javax.swing.JSplitPane;
import javax.swing.JTextField;
public class MainFrame extends JFrame {
private JSplitPane mainSplitPane = null;
private JSplitPane inputSplitPane = null;
private JSplitPane topSplitPane = null;
private JScrollPane listBoxPane = null;
private JPanel buttonPanel = null;
private JPanel usernamePanel = null;
private JPanel passwordPanel = null;
private JButton okButton = null;
private JTextField username = null;
private JPasswordField password = null;
private JList listBox = null;
private JLabel usernameLabel = null;
private JLabel passwordLabel = null;
private final class ClickEvent implements ActionListener { @Override
public void actionPerformed(ActionEvent e) {
// 分别获得输入用户名和输入密码的文本框中的字符
String username = ername.getText();
String password =
new String(MainFrame.this.password.getPassword());
// 把用户名和密码组成成一个字符串并添加到列表框中
String newLine =
String.format("姓名：%s；密码：%s", username, password);
DefaultListModel model =
(DefaultListModel) MainFrame.this.listBox.getModel();
model.addElement(newLine);
}
}
public MainFrame() {
ername = new JTextField(10);
this.password = new JPasswordField(10);
ernameLabel = new JLabel("输入姓名：");
this.passwordLabel = new JLabel("输入密码：");
this.okButton = new JButton("确定");
this.listBox = new JList(new DefaultListModel());
this.okButton.addActionListener(new ClickEvent());
ernamePanel =
new JPanel(new FlowLayout(FlowLayout.CENTER));
ernamePanel.add(ernameLabel);
ernamePanel.add(ername);
this.passwordPanel =
new JPanel(new FlowLayout(FlowLayout.CENTER));
this.passwordPanel.add(this.passwordLabel);
this.passwordPanel.add(this.password);
this.listBoxPane = new JScrollPane(listBox);
this.buttonPanel = new JPanel(new FlowLayout());
this.buttonPanel.add(okButton);
this.inputSplitPane =
new JSplitPane(JSplitPane.HORIZONTAL_SPLIT,
ernamePanel, this.passwordPanel);
this.topSplitPane =
new JSplitPane(JSplitPane.HORIZONTAL_SPLIT,
inputSplitPane, buttonPanel);
this.mainSplitPane =
new JSplitPane(JSplitPane.VERTICAL_SPLIT,
this.topSplitPane, this.listBoxPane);
this.setLayout(new BorderLayout());
this.add(this.mainSplitPane, BorderLayout.CENTER);
this.setTitle("测试");
this.setLocationByPlatform(true);
this.setSize(500, 300);
this.setDefaultCloseOperation(EXIT_ON_CLOSE);
this.setVisible(true);
}
public static void main(String[] args) {
MainFrame frm = new MainFrame();
}
}。