Java第05次实验提纲（Java图形界面编程）

目录

• Java Swing编程与NetBeans
  • 题目1: Swing用户界面组件与事件处理（建议尝试提前完成）
  • 题目2：使用AI辅助编写Swing GUI程序
    • task1：使用AI仿照题目1中的登录窗口图片生成一个登录窗体。
    • task2：增加用户验证类
    • task3：建立主窗体
    • task4：为主窗体添加功能
    • task5：尝试看懂AI生成的代码。
    • task6：改进数据展示页面
    • task7：通过AI为自己以前的“商城购物车系统”生成UI。
    • 常见问题
  • 题目2: NetBeans基本使用
    • 主要讲解
    • 常见问题
    • 进阶
    • 使用布局管理器
  • 题目3: 代码阅读DataExchangeTest.java（自主完成）
  • 题目4: 使用NetBeans设计复杂用户界面
    • 项目初始化与界面编写
      • 如何在JFrame上设置CardLayout
      • NetBeans中一些对组件的操作
    • 使用接口改造
  • 题目5: 在NetBeans中使用JTable
  • 题目6: 其他可选题目
  • 其他问题
    • 1.系统安装JDK 9以上，在Eclipse编写Swing程序，提示javax.swing cannot be resolved to a type
    • 2.无法安装NetBeans，提示找不到JRE。或者安装成功，打开后，就是无法新建项目。
  • 本次实验参考资料
  • 其他参考资料
• Java游戏参考资料
  • Java游戏入门
  • Java游戏框架
  • Java游戏第三方库
• 下次实验

Java Swing编程与NetBeans

本次实验主要练习使用Java Swing编写简单界面。

实验资料：GUI实验参考文件中的0.第06次实验(图形程序设计、事件处理与Swing).doc

题目1: Swing用户界面组件与事件处理（建议尝试提前完成）

只使用Eclipse，手写界面布局与事件监听器代码。

需完成如上界面。请在以下代码的基础上进行修改。

import javax.swing.JFrame;        

public class FirstSwing {

    private static void createAndShowGUI() {
        //Create and set up the window.
        JFrame frame = new JFrame("HelloWorldSwing");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        //your code
       
        //Display the window.
        frame.pack();
        frame.setVisible(true);
    }

    public static void main(String[] args) {
        javax.swing.SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                createAndShowGUI();
            }
        });
    }
}

1. 布局伪代码

1. 整个窗体界面分成两部分：分别对应BorderLayout的centre与south。新建布局layout。
2. 在layout的center放入一个JPanel，将其布局管理器设置成GridLayout(2行2列)，分别放入两个JLable与JTextField
3. 在layout的south放入一个JPanel，然后在该面板上放置两个按钮btn1 ,btn2。注：JPanel默认布局为FlowLayout，无需更改。
4. 在btn1上注册事件监听器，功能：点击登录按钮后，如用户名、密码相同则提示“欢迎用户XXX进入系统！”，否则提示“用户名密码错误！”。
   • 说明：提示信息可使用信息对话框实现。

2.参考代码
BorderLayout参考代码

JFrame f = new JFrame("BorderLayoutTest");
f.setLayout(new BorderLayout());
f.add(new JButton("North"), BorderLayout.NORTH);
f.add(new JButton("South"), BorderLayout.SOUTH);
f.add(new JButton("East"), BorderLayout.EAST);
f.add(new JButton("West"), BorderLayout.WEST);
f.add(new JButton("Center"), BorderLayout.CENTER);
f.setSize(600, 600);
f.setVisible(true);

GirdLayout参考代码

JFrame frame = new JFrame("GridLayout Test");
JPanel panel = new JPanel(new GridLayout(2,2));
panel.add(new JButton("btn1"));
panel.add(new JButton("btn2"));
panel.add(new JButton("btn3"));
panel.add(new JButton("btn4"));
frame.add(panel);

各种对话框参考代码：

//消息对话框：用来显示消息。
JOptionPane.showMessageDialog(null, "消息对话框");

//输入对话框：用来从对话框获取值。
String x = JOptionPane.showInputDialog("请输入变量x的值:");
System.out.println("x="+x);

//确认对话框：根据不同的选择会有不同的返回值。
int choice = JOptionPane.showConfirmDialog(null, "请选择");  

/*
choice可能等于如下预先定义好的常量。
JOptionPane.YES_OPTION
JOptionPane.NO_OPTION
JOptionPane.CANCEL_OPTION
实际上JOptionPane.YES_OPTION等于0。使用常量使代码可读性更好
*/

对话框的使用详见：Java中对话框的弹出。

3.改进(可选)

1. 将输入密码的JTextField换成JPasswordField。
2. 使用BorderFactory为放在中间的面板添加边框。
3. 设置JLabel的对齐方式(new JLabel("密码", SwingConstants.RIGHT))。
4. 设置GirdLayout的vGap与hGap，观察效果。
5. 进阶：如何让登录界面更美观一点，比如插入背景图。

题目2：使用AI辅助编写Swing GUI程序

task1：使用AI仿照题目1中的登录窗口图片生成一个登录窗体。

改进：
- 让窗体居中且不可改变大小；
- 将输入密码的JTextField换成JPasswordField；
- 使用BorderFactory为放在中间的面板添加边框（如果有使用面板）；
- 设置JLabel的对齐方式；如果使用了GirdLayout，可尝试设置GirdLayout的vGap与hGap，美化登录窗体的外观。

问题：如何让生成的登录窗体使用指定的布局管理器（如，BorderLayout与GridLayout）？

task2：增加用户验证类

改造程序，登录验证的时候使用单独的用户验证类。登录成功则生成User对象，该对象包含刚才输入的用户名信息

提示：应当建立独立的User类。

task3：建立主窗体

登录成功则打开主窗体，主窗体的标题栏显示刚才输入的用户名。主窗体包含一个菜单条，上有“开始”菜单、“帮助”菜单。“开始”菜单有4个菜单项（欢迎、商品数据、注销、退出），“帮助”菜单有1个菜单项（About）。

问题1：如何将User对象从登录窗体传入主窗体；
问题2：打开主窗体后，登录窗体跑哪了？

完成task3就可以联系老师加分

task4：为主窗体添加功能

点击"欢迎"菜单项则在主窗体上显示大字的“欢迎使用XXX系统”，点击“商品数据”则在主窗体上显示一个JTable上面包含商品数据（建议新建一个商品类），点击“注销”则关闭主窗体返回到登录窗体、点击“退出”则直接退出整个程序。点击“帮助”中的“About”则在一个新的对话框中显示程序开发的信息，包含开发者、开发日期、开发版本号等信息。

问题1：找到点击"欢迎"菜单实现相应的功能的代码，并进行解释。监听器在哪里注册？监听器中的代码是什么？
问题2：代码中是如何实现点击“欢迎”就可以切换到欢迎页面，点击“数据展示”则可以切换到“数据展示”页面。是使用CardLayout还是使用移除所有的组件重新创建？你觉的哪种形式更好？

task5：尝试看懂AI生成的代码。

看看有无改进空间。

task6：改进数据展示页面

让数据展示页面的数据从商品列表或者商品的文件中读取。

task7：通过AI为自己以前的“商城购物车系统”生成UI。

提示1：可以在IDEA中安装通义灵码插件，该插件可在IDE中已有的代码的基础上生成相应的代码。
提示2：以前的代码不要不要删除。直接在以前代码的基础上进行修改。

常见问题

Q1：用户名怎么传递到主窗体。
A1：主窗体中包含一个User属性，当登录成功后创建User对象，然后通过构造方法或其他方法传递给主窗体。

Q2：如何找到“欢迎”菜单项对应的动作代码。
A2：首先找到“欢迎”菜单项（JMenuItem）的变量，比如说是welcomeJMenuItem，然后按照找welcomeJMenuItem后addActionListener的代码。

题目2: NetBeans基本使用

建议使用NetBeans 12.5及以上的版本。
编写用户信息更改模块。当点击修改，将界面上方两个JTextField的值读取，并在下方的"信息展示"框显示。

主要讲解

• NetBeans基本概念、图形界面设计器、简单布局、组件布置（如，辅助线、组件对齐、组件尺寸批量修改等）、组件变量名等
• NetBeans常用快捷键：ctrl+\(代码提示)，Tab(自动完成，比如sout,然后按tab)，Alt+Insert(自动生成代码，类似Eclipse中的Alt+Shift+S)、Alt+Enter (quick fix).
• 使用JPanel布置组件，设置带标题的边框。
• 预览不同风格的外观：右键点击JFrame，选择Preview Design.
• 添加事件处理代码
• 按钮监听器代码中包含三部分代码：
  1. 获取文本框数据并进行简单判断。如，name、age文本框不能为空。如果为空则弹出对话框提示“name不能为空”，并重设焦点（文本框的requestFocus方法）到相应的文本框。
  2. 业务逻辑代码：对数据按照业务要求进行判断(如，必须是整数、年龄不能小于0）与处理（如对年龄+1）。
  3. 将处理后的数据更新到下方标签。
• 进阶：使用MVC模式解释并改造上述代码。

常见问题

1. 组件与其变量名的对应关系。组件变量名最好要有意义，能体现出其类型，比如nameTextField就是一个显示姓名的JTextField。
2. 未将主窗体设置为主类无法启动。右键点击项目-属性(Properties)-运行(Run)，设置正确的主类(Main Class)。也可使用Shift+F6运行当前文件。
3. 文本类型转化为数值类型时可能出错。常见错误：当字符串前后带空格时，当文本框输入的字符串为非数字的时候。
4. GUI程序的发布：
   • 方法1:生成可执行jar文件。参见参考资料5.NetBeans生成可执行GUI jar程序.doc
   • 方法2:创建批处理脚本Run.bat执行jar程序。

       @echo off
       start javaw -jar GUI1.jar
   

5. 新版NetBeans(如14以上版本)中的Maven项目无法正常使用。
   • 现象：按照上面的步骤进行发布。生成的jar文件，双击无法启动。在控制台下执行，提示"firstgui-1.0-SNAPSHOT.jar中没有主清单属性"。
   • 原因：虽然在NetBeans中设置了主类，但是Maven并不知道主类是谁。因此需要在pom.xml中进行设置。
   • 在项目的Project Files中打开pom.xml，将如下配置写到pom.xml中<properties>...</properties>标签后

     <build>
         <plugins>
             <plugin>
                 <groupId>org.apache.maven.plugins</groupId>
                 <artifactId>maven-jar-plugin</artifactId>
                 <version>2.4</version>
                 <configuration>
                     <archive>
                         <manifest>
                             <addClasspath>true</addClasspath>
                             <mainClass>edu.jmu.net.firstgui.NewJFrame</mainClass>
                         </manifest>
                     </archive>
                 </configuration>
             </plugin>
         </plugins>
     </build> 
     

   • 参考资料：Building an executable JAR with Netbeans and Maven (no main manifest attribute)

新版NetBeans通常使用Maven创建项目，使用常规方法
6. NetBeans中项目启动过慢(因为Maven仓库)。可为NetBeans增加国内Maven仓库。
- 详见NetBeans增加maven repository
- 在NetBeans中的Services标签页下的Maven Repositories下Add Repository。阿里云的Maven仓库地址：https://maven.aliyun.com/repository/public

进阶

1. 年龄文本框使用JFormattedTextField对输入文本进行格式限制。
2. 尝试在NetBeans上操作布局管理器、添加事件处理代码，实现题目1的界面与功能。
3. 对比NetBeans自动生成的代码与自己手写的代码有何不同？(从布局管理器与事件处理代码这两个方面来分析)

使用布局管理器

在NetBeans中也可使用布局管理器(Layout)。在NetBeans中常用的布局管理器的主要有几种：FlowLayout、BorderLayout、CardLayout、GridLayout。
一般来说都是在一个JFrame或JPanel上设置布局管理器。
设置布局管理器方法：右键点击JFrame或JPanel->"Set Layout"，选择所需布局管理器进行添加。
以在jPanel1这个容器组件上设置布局管理器为例。

1. 使用FlowLayout
   • 在JFrame或JPanel添加完Layout后，直接将组件拖到jPanel1上。
   • 另一种更常用的添加组件的方法：右键点击jPanel1->"Add From Palette"，选择相应组件。
2. 使用BorderLayout
   添加完Layout后，直接将组件拖到拖到jPanel1的东西南北中方向。或使用"Add From Palette"方法添加组件
3. 使用CardLayout
   • jPanel1上添加完Layout后，并依次添加多个需要切换的JPanel后。右键点击每个JPanel，设置其“card name”方便切换。
   • 切换时需获得jPanel1上的CardLayout对象。可使用如下代码：

       CardLayout card = (CardLayout)jPanel1.getLayout();
       card.show(mainPanel, "panelOne");//panelOne是之前设置的card name
   

4. 使用GridLayout
   假设设置为2*2布局，那么按照从左到右、从上到下的顺序依次拖入4个组件，即可看到效果。注意：只添加2个，是看不到效果的。

题目3: 代码阅读DataExchangeTest.java（自主完成）

该程序点击File菜单的Connect菜单项，将弹出一个对话框。在对话框中输入信息后，可将该信息以User对象的形式返回，然后更新到主窗体的JTextArea。

主要关注

1. 这里设计了一个JPanel(PasswordChooser)。为了显示PasswordChooser这个JPanel，我们必须先新建一个对话框对象，并将该JPanel放在对话框上。代码中，调用showDialog方法后，将新建一个对话框对象并将该对象赋值给PasswordChooser的dialog属性，然后显示该对话框。这里显示对话框的方式比较特别，稍微了解一下即可。可参照题目4来实现同样界面。
2. 如何从弹出的对话框获取数据？如何将数据以对象的形式返回调用的地方。查看ConnectAction类。

演示：DataExchangeTest.java。该文件见参考资料GUI实验参考文件。
讲解：结合课件中的数据交换例子进行代码讲解。

题目4: 使用NetBeans设计复杂用户界面

注意：题目4、5中对NetBeans的具体使用，详见在线课程 "9.1.4 NetBeans下使用布局管理器、9.1.5 NetBeans下使用常用组件、9.1.6 NetBeans下编写菜单程序"章节。

任务
使用NetBeans采用MVC编程模式编写带菜单的GUI程序
掌握在NetBeans中使用布局管理器。
实现：用户登录、窗体切换、数据传递、信息查看等。

项目初始化与界面编写

1. 新建项目包结构：ui包、model包、dao包、util包。

2. model包:User类(int id, String name)

3. ui包:

   • LoginFrame类(JFrame): 主类，登录界面。界面见题目1中的布局伪代码。可在NetBeans中使用布局管理器来实现。
   • MainFrame类(JFrame): 主界面，包含菜单条(JMenuBar)、开始菜单(JMenu)、帮助菜单。（设置其为模式对话框，即设置其modal属性）
     • 开始菜单：读取文件到文本框菜单项(JMenuItem)、读取文件到表格菜单项(JMenuItem)、写入文件菜单项、分割线、注销菜单项。
     • 帮助菜单：About菜单项。点击后弹出AboutDialog。
     • 属性：User user（用来存放登录的用户信息）, JDialog aboutDialog。
     • 构造方法：MainFrame(), MainFrame(User user)。
     • 在MainFrame放入JPanel(如，jPanelMain)，并设置其Layout为CardLayout。在该Panel放入一个JTextArea(实际上NetBeans会自动将其放在一个JScrollPane上，然后将该组件放到Panel上)，用来显示从文件读取的内容。注意：JFileChooser控件为文件选择框。
     • 在jPanelMain上放入一个JTabel(同JTextArea)，用来以表格的形式显示数据。设置这两个Pane的"Card Name"属性分别为"card1"与"card2"，方便切换。
   • AboutDialog类(JDialog)：自定义的About对话框。显示欢迎“登录用户id、用户名”、程序版本、程序作者、当前时间。

4. 实现登录功能
   在LoginFrame的登录按钮中编写登录逻辑（比如用户名与密码相同就算通过）。验证成功则显示MainFrame。使用setVisible(false)隐藏窗体。

5. 编写自定义的AboutDialog

   • 设置其为模式对话框，即设置其modal属性。

如何在JFrame上设置CardLayout

以在一个JFrame上放置两个面板，希望在这两个面板之间切换为例。

步骤：

1. 在JFrame放置一个JPanel，如jPanel1
2. 在jPanel1上设置布局管理器(Set Layout)为"Card Layout"
3. 往jPanel1拖入两个JPanel。注意：如果是直接拖入JTextArea或JTabel，会自动生成JScrollPane并将组件放入其中。无需单独添加JPanel。
4. 为每个JPanel设置"Card Name"。对于两个面板，那就设置为"card1"与"card2"。
5. 在切换的按钮(比如菜单的某个菜单项)中输入如下代码获取指定面板上的CardLayout对象以进行切换：

CardLayout cl = (CardLayout)jPanel1.getLayout();
cl.show(jPanel1, "card1");

NetBeans中一些对组件的操作

1. 在某个JPanel上添加一个组件(Add From Palette)
   除了可以直接拖动放入，还可右键点击JPanel，选择Add From Palette。
2. 在LoginFrame使用布局管理器
   LoginFrame需设置为BoderLayout。方法：右键点击LoginFrame，选择Set Layout进行选择。
   在LoginFrame的center上添加CenterJPanel(包含输入用户名、密码的标签与文本域、密码文本域)。方法：右键点击LoginFrame，选择Add From Palette，添加JPanel。然后右键点击该JPanel-Properties-在Layout栏下选择Direction，设置其在BoderLayout的方位。往CenterJPanel添加JLabel与JTextFiel。
   在LoginFrame的south上添加SouthJPanel。设置其Layout为GridLayout(右键点击Propertie，设置Columns、Rows属性)，往其中添加"登录"、"退出"按钮。注意：可使用GridLayout的"Vertical gap, Horizontal gap"来调整组件的大小
3. 将弹出的JFrame居中显示。在要弹出的JFrame上右键点击-Properties-Code-Generate Center。

使用接口改造

dao包中

1. 编写UserLogin接口，包含方法：User login(String name, String pwd)。功能为验证成功返回User对象，失败返回null。
2. 编写UserLoginSimpleImpl实现UserLogin，写入一个简单的密码验证代码。
3. 编写UserLoginFileImpl实现 UserLogin，写一个从文件中读取用户名、密码进行验证的代码。

题目5: 在NetBeans中使用JTable

点击"题目4"的读取文件到表格菜单项(JMenuItem)，将文件中的数据读取到JTable中。

演示

1. 在Netbeans中设置JTable控件的属性。右键点击JTable，点击Table Contents。
2. 进阶：通过点击按钮，动态将文件数据读取到JTable中。

注意：如果要在MainFrame既要放JTextArea，又要放JTable，并且可以切换显示。那么需要设置MainFrame的Layout为CardLayout。

进阶
为JTable编写自己的TableModel。可参考DefaultTableModel的实现。
重要参考资料：JTable案例中如何使用JTable。详见其中的jTableDemo，使用代码控制JTable。

参考资料

Java GUI 中的JTable-Netbeans设置
JTable常见用法细则-主要讲DefaultTableModel的使用

题目6: 其他可选题目

6.1 查看以下参考资料，并思考Student、StudentController、StudentView分别有什么用？他们之间是什么关系？在GUI程序设计中，怎么使用这种模式编写代码。
6.2 模仿Windows记事本，编写一个简易记事本。
6.3 尝试使用MVC模式编写购物车、学生管理系统、计算器等程序。

参考资料:

MVC模式简介-主要看StudentController是怎样协调Model与View

其他问题

1.系统安装JDK 9以上，在Eclipse编写Swing程序，提示javax.swing cannot be resolved to a type

原因：JDK 9及以上引入模块系统，java swing相关包默认没有被导入。
解决:需要在Eclipse项目中的module-info.java加入requires java.desktop;。注意：请安装较高版本的Eclipse。

2.无法安装NetBeans，提示找不到JRE。或者安装成功，打开后，就是无法新建项目。

原因：NetBeans 8.2还不支持JDK 9及以上。
解决：安装JDK 8或者安装Netbeans 9.0。有可能还需要修改netbeans安装目录\etc下的netbeans.conf文件，修改里面的netbeans_jdkhome的值为jdk8的安装目录。注意：NetBeans 9.0安装后无法运行，也可考虑通过修改netbeans_jdkhome来解决，将其设置为jdk9及以上的安装目录。
参考资料：Can't create project on Netbeans 8.2

本次实验参考资料

1.重要：GUI实验参考文件
2.视频:使用Netbeans编写GUI
3.Java中对话框的弹出
4.JTable常见用法细则-主要讲DefaultTableModel的使用
5.JTable用法-进阶
6.Swing组件使用系列文章
7.官方文档-Java Tutorial-Creating a GUI With Swing
8.Designing a Swing GUI in NetBeans IDE
9.MVC模式简介-主要看StudentController是怎样协调Model与View
8.官方文档-在 NetBeans IDE 中设计 Swing GUI
9.官方文档-在 Java GUI 应用程序中处理图像(如，设置背景图片)
10.官网-使用Netbeans开发企业应用的一些案例

GUI实验参考文件说明：
0.第06次实验(图形程序设计、事件处理与Swing).doc
1.使用NetBeans设计GUI(by zhrb).doc-NetBeans教程。
2.NetBeans使用脚本.txt
3.一个简单的包括菜单的GUI小程序(SwingTest).zip-手写GUI示例代码(包含CardLayout、窗体间传递数据、MVC模式、外观观感、窗口放在屏幕中央等演示)。
4.DataExchangeTest.java-数据在GUI中如何传递。

其他参考资料

Open JavaFX
Java Swing Tutorial
各种计算机技术的Tutorial
第一篇 开始学习JavaFX

Java游戏参考资料

虽然使用Java开发的游戏（如MineCraft）较少，但初学Java 2D，可尝试使用Java编写一些简单的小游戏。主要学习Java游戏入门1-Java 2D games tutorial中的图形界面游戏基本原理：Basics、Animation、Moving sprites、Collision detection。知其然、知其所以然。怎么学？先把程序跑起来，然后尝试看懂程序并进行改造。

参考资料

Java游戏入门

Java游戏入门1-Java 2D games tutorial
Java游戏入门2-南洋理工大学的-Java Game Programming
Introduction to JavaFX for Game Development

Java游戏框架

2D Java Game Library-Slick2D，基于LWJGL
Java 3D游戏引擎-JMonkeyEngine，基于LWJGL

Java游戏第三方库

Lightweight Java Game Library 3(LWJGL)-OpenGL、OpenAL、OpenCL偏向底层处理-

下次实验

Java第06次实验提纲（集合）