目录
- 核心概念：什么是 GUI？
- Eclipse 环境准备
- 创建第一个 GUI 程序 (Hello World)
- 步骤 1：创建 Java 项目
- 步骤 2：创建主类
- 步骤 3：编写 GUI 代码
- 步骤 4：运行程序
- 深入解析：GUI 编程的核心要素
JFrame(窗口)JPanel(面板)Swing组件 (按钮、标签、文本框等)LayoutManager(布局管理器)
- 常用 Swing 组件示例
JButton(按钮)JTextField(文本输入框)JLabel(标签)JTextArea(文本区域)
- 事件处理：让界面“动”起来
- 概念：监听器
- 示例：为按钮添加点击事件
- 一个更完整的示例：简易计算器
- 进阶与总结
核心概念：什么是 GUI？
GUI (Graphical User Interface) 即图形用户界面，它允许用户通过图形化的元素（如窗口、按钮、图标、菜单等）与程序进行交互,而不是传统的命令行。
（图片来源网络，侵删）
在 Java 中，开发 GUI 主要有两种技术：
- Java AWT (Abstract Window Toolkit): 早期技术，使用操作系统的原生组件，优点是外观与系统一致，缺点是不同系统上表现可能不同,且功能有限。
- Java Swing: 目前更主流、更推荐的技术，它是 AWT 的升级版，绘制自己的组件，因此外观在所有平台上都一致（称为 "Pluggable Look and Feel"），并且提供了更丰富、更强大的组件库。
本指南将完全基于 Java Swing。
Eclipse 环境准备
在开始之前,请确保你已经安装了：
- JDK (Java Development Kit): Java 程序的运行和开发环境，确保已配置好
JAVA_HOME环境变量和PATH路径。 - Eclipse IDE for Java Developers: 你可以从 Eclipse 官网 下载并安装。
创建第一个 GUI 程序 (Hello World)
我们将创建一个包含一个窗口和一个标签的简单程序。
（图片来源网络，侵删）
步骤 1：创建 Java 项目
- 打开 Eclipse。
- 点击菜单栏的
File->New->Java Project。 - 输入项目名称，
MyFirstGUI，然后点击Finish。
步骤 2：创建主类
- 在左侧的
Package Explorer中，右键点击你的项目MyFirstGUI。 - 选择
New->Class。 - 在 "Name" 字段中输入
MyWindow。 - 勾选
public static void main(String[] args),这会自动生成程序的入口点。 - 点击
Finish。
步骤 3：编写 GUI 代码
MyWindow.java 文件会被打开,将以下代码复制并粘贴进去：
package myfirstgui; // 如果项目名和包名不同，请相应修改
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.SwingUtilities;
// 我们的主类
public class MyWindow {
public static void main(String[] args) {
// 使用 SwingUtilities.invokeLater() 来确保 GUI 创建在事件分发线程上
// 这是编写健壮 Swing 应用程序的最佳实践
SwingUtilities.invokeLater(new Runnable() {
@Override
public void run() {
createAndShowGUI();
}
});
}
private static void createAndShowGUI() {
// 1. 创建一个顶级窗口 (JFrame)
JFrame frame = new JFrame("我的第一个窗口");
// 2. 设置窗口关闭时的操作：退出应用程序
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// 3. 创建一个标签组件
JLabel label = new JLabel("你好，世界！", JLabel.CENTER);
// 4. 将标签添加到窗口的内容面板中
frame.getContentPane().add(label);
// 5. 设置窗口大小 (宽, 高)
frame.setSize(400, 300);
// 6. 让窗口在屏幕上可见
frame.setVisible(true);
}
}
步骤 4：运行程序
右键点击 MyWindow.java 编辑器中的任意位置，选择 Run As -> Java Application。
你应该能看到一个标题为 "我的第一个窗口" 的窗口，中间显示着 "你好，世界！"。
深入解析：GUI 编程的核心要素
JFrame (窗口)
JFrame 是 Swing 应用程序的顶层容器，它代表一个窗口，几乎所有独立的 GUI 程序都需要一个 JFrame。
setTitle("标题"): 设置窗口标题。setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE): 非常重要！ 当你点击窗口的关闭按钮时，这个方法会告诉程序如何操作。EXIT_ON_CLOSE表示完全退出 Java 虚拟机。setSize(width, height): 设置窗口的初始大小。setVisible(true): 让窗口显示出来,在设置好所有属性后调用。
JPanel (面板)
JPanel 是一个通用的轻量级容器，你不能直接在 JFrame 上添加组件，而是添加到 JFrame 的内容面板 中，而 JPanel 是最常用的内容面板，当你把组件添加到 JPanel，然后再把 JPanel 添加到 JFrame 时,你实际上是在组织和管理你的界面布局。
Swing 组件
这些是构成界面的基本元素，如按钮 (JButton)、标签 (JLabel)、文本框 (JTextField)、复选框 (JCheckBox) 等,每个组件都有自己特定的属性和方法。
LayoutManager (布局管理器)
布局管理器负责决定组件在容器中的位置和大小。绝对定位（使用 setBounds(x, y, width, height)）在 Swing 中是不推荐的,因为它在不同分辨率的屏幕上表现会很差。
Eclipse/Swing 提供了几种常用的布局管理器：
BorderLayout: 将容器分为五个区域：北、南、东、西、中，这是JFrame默认的布局。FlowLayout: 组件从左到右、从上到下地排列,像文字一样。GridLayout: 将容器划分为一个网格,每个组件占据一个网格单元。GridBagLayout: 最强大也最复杂的布局,可以实现非常灵活的界面。
常用 Swing 组件示例
让我们扩展之前的例子,添加一个按钮和一个文本输入框。
import javax.swing.*;
import java.awt.*;
public class ComponentsExample {
public static void main(String[] args) {
SwingUtilities.invokeLater(() -> {
JFrame frame = new JFrame("组件示例");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setSize(400, 200);
// 使用 FlowLayout，让组件从左到右排列
frame.setLayout(new FlowLayout());
// 1. 标签
JLabel nameLabel = new JLabel("用户名:");
// 2. 文本输入框
JTextField textField = new JTextField(20); // 20 是列数
// 3. 按钮
JButton submitButton = new JButton("提交");
// 将组件添加到窗口
frame.add(nameLabel);
frame.add(textField);
frame.add(submitButton);
frame.setVisible(true);
});
}
}
运行后，你会看到三个组件水平排列。FlowLayout 就是让它们这样排列的。
事件处理：让界面“动”起来
一个静态的界面没有意义，事件处理就是让程序响应用户的操作，比如点击按钮、在文本框中输入文字等。
核心思想是监听器模式：
- 事件源: 产生事件的对象，比如一个按钮 (
JButton)。 - 事件: 用户操作，
ActionEvent(点击按钮)。 - 监听器: 一个实现了特定接口的对象，它“监听”事件源,并在事件发生时执行特定的代码。
示例：为按钮添加点击事件
我们修改上面的 ComponentsExample.java,让点击按钮时在控制台打印出文本框的内容。
import javax.swing.*;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
public class ComponentsExample {
public static void main(String[] args) {
SwingUtilities.invokeLater(() -> {
JFrame frame = new JFrame("组件示例");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setSize(400, 200);
frame.setLayout(new FlowLayout());
JLabel nameLabel = new JLabel("用户名:");
JTextField textField = new JTextField(20);
JButton submitButton = new JButton("提交");
// --- 核心代码：添加事件监听器 ---
// 1. 创建一个监听器对象
ActionListener listener = new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
// 当按钮被点击时，此方法会被调用
String inputText = textField.getText();
System.out.println("按钮被点击了！输入的内容是: " + inputText);
JOptionPane.showMessageDialog(frame, "你好, " + inputText + "!");
}
};
// 2. 将监听器注册到按钮上
submitButton.addActionListener(listener);
// --- 事件处理代码结束 ---
frame.add(nameLabel);
frame.add(textField);
frame.add(submitButton);
frame.setVisible(true);
});
}
}
现在运行程序，在文本框中输入你的名字，然后点击“提交”按钮，你会看到控制台打印了信息,并且弹出了一个对话框显示你的名字。
一个更完整的示例：简易计算器
这个例子将综合运用我们学到的知识：JFrame, JPanel, GridLayout, JTextField, JButton, 以及事件处理。
import javax.swing.*;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
public class SimpleCalculator extends JFrame {
private JTextField numField1, numField2, resultField;
public SimpleCalculator() {
// 1. 设置窗口基本属性
setTitle("简易计算器");
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setSize(300, 200);
// 2. 创建主面板，使用 GridLayout (4行, 2列, 5px间距, 5px间距)
JPanel mainPanel = new JPanel(new GridLayout(4, 2, 5, 5));
mainPanel.setBorder(BorderFactory.createEmptyBorder(10, 10, 10, 10)); // 添加边距
// 3. 创建组件
mainPanel.add(new JLabel("第一个数字:"));
numField1 = new JTextField();
mainPanel.add(numField1);
mainPanel.add(new JLabel("第二个数字:"));
numField2 = new JTextField();
mainPanel.add(numField2);
mainPanel.add(new JLabel("计算结果:"));
resultField = new JTextField();
resultField.setEditable(false); // 结果框不可编辑
mainPanel.add(resultField);
// 4. 创建按钮面板，使用 FlowLayout
JPanel buttonPanel = new JPanel(new FlowLayout());
JButton addButton = new JButton("加法");
JButton subtractButton = new JButton("减法");
// 5. 为按钮添加监听器
addButton.addActionListener(new AddListener());
subtractButton.addActionListener(new SubtractListener());
buttonPanel.add(addButton);
buttonPanel.add(subtractButton);
// 6. 将主面板和按钮面板添加到窗口
add(mainPanel, BorderLayout.CENTER);
add(buttonPanel, BorderLayout.SOUTH);
}
// 加法监听器
private class AddListener implements ActionListener {
@Override
public void actionPerformed(ActionEvent e) {
calculate('+');
}
}
// 减法监听器
private class SubtractListener implements ActionListener {
@Override
public void actionPerformed(ActionEvent e) {
calculate('-');
}
}
// 计算逻辑
private void calculate(char operator) {
try {
double num1 = Double.parseDouble(numField1.getText());
double num2 = Double.parseDouble(numField2.getText());
double result = 0;
if (operator == '+') {
result = num1 + num2;
} else if (operator == '-') {
result = num1 - num2;
}
resultField.setText(String.valueOf(result));
} catch (NumberFormatException ex) {
JOptionPane.showMessageDialog(this, "请输入有效的数字！", "输入错误", JOptionPane.ERROR_MESSAGE);
}
}
public static void main(String[] args) {
SwingUtilities.invokeLater(() -> {
SimpleCalculator calculator = new SimpleCalculator();
calculator.setVisible(true);
});
}
}
这个例子展示了如何：
- 使用
GridLayout和FlowLayout组合来布局界面。 - 为不同的按钮创建不同的监听器内部类。
- 处理可能的用户输入错误 (
try-catch)。 - 使用
BorderLayout将不同类型的面板组织到窗口中。
进阶与总结
- MVC (Model-View-Controller) 模式: 对于复杂的 GUI 程序，推荐使用 MVC 模式将数据模型、界面视图和控制逻辑分离开,使代码更易于维护和扩展。
- GUI 设计器: Eclipse 插件市场（如 WindowBuilder）提供了可视化的 GUI 设计器，你可以通过拖拽组件来快速构建界面，它会自动生成相应的 Java 代码，对于初学者来说，这可以让你更直观地理解布局,但一定要理解其背后的代码逻辑。
- 探索更多组件: Swing 非常强大，还有
JComboBox(下拉框),JList(列表),JTable(表格),JMenuBar(菜单栏) 等等,值得你深入学习。
希望这份指南能帮助你顺利地在 Eclipse 中开始 Java GUI 编程！祝你编码愉快！
