51、JavaFX 控件与事件处理入门

JavaFX 控件与事件处理入门

一、JavaFX 场景图节点操作

在 JavaFX 编程中，向场景图添加节点是常见操作。例如， rootNode.getChildren().add(myLabel); 这行代码将 myLabel 标签添加到以 rootNode 为父节点的子节点列表中。此外， ObservableList 提供了 addAll() 方法，可一次性添加多个子节点到场景图，如下所示：

rootNode.getChildren().addAll(btnUp, btnDown, response);

若要从场景图中移除控件，可调用 ObservableList 的 remove() 方法，示例如下：

rootNode.getChildren().remove(myLabel);

同时， ObservableList 还支持多种列表管理方法，如 isEmpty() 可判断列表是否为空， size() 可获取列表中的节点数量。

二、事件处理基础

2.1 事件类与委托模型

JavaFX 事件的基类是 javafx.event 包中的 Event 类，它继承自 java.util.EventObject ，这意味着 JavaFX 事件与其他 Java 事件具有相同的基本功能。其中， ActionEvent 是 Event 的一个子类，用于封装按钮产生的动作事件。

JavaFX 采用委托事件模型处理事件，处理事件时，需先注册作为事件监听器的处理程序。事件发生时，监听器被调用，处理完事件后返回，这与 Swing 事件的管理方式类似。

2.2 事件处理接口

事件处理通过实现 javafx.event 包中的 EventHandler 接口完成，该接口是泛型接口，形式如下：

Interface EventHandler<T extends Event>

其中， T 指定处理程序将处理的事件类型，它定义了一个 handle() 方法，接收事件对象作为参数：

void handle(T eventObj)

通常，事件处理程序通过匿名内部类或 lambda 表达式实现，也可使用独立类，具体取决于应用需求。

三、按钮控件与事件处理

3.1 按钮类与构造函数

JavaFX 中的按钮控件由 javafx.scene.control 包中的 Button 类提供，其继承了多个基类。创建文本按钮可使用以下构造函数：

Button(String str)

例如：

Button btnUp = new Button("Up");
Button btnDown = new Button("Down");

3.2 注册事件监听器

按钮被按下时会生成 ActionEvent ，可通过调用按钮的 setOnAction() 方法注册该事件的监听器，其通用形式如下：

final void setOnAction(EventHandler<ActionEvent> handler)

以下是使用匿名内部类处理按钮事件的示例：

btnUp.setOnAction(new EventHandler<ActionEvent>() {
    public void handle(ActionEvent ae) {
        response.setText("You pressed Up.");
    }
});

也可使用 lambda 表达式简化代码：

btnUp.setOnAction( (ae) ->
    response.setText("You pressed Up.")
);

3.3 完整示例代码

import javafx.application.*;
import javafx.scene.*;
import javafx.stage.*;
import javafx.scene.layout.*;
import javafx.scene.control.*;
import javafx.event.*;
import javafx.geometry.*;

public class JavaFXEventDemo extends Application {

    Label response;

    public static void main(String[] args) {
        launch(args);
    }

    public void start(Stage myStage) {
        myStage.setTitle("Use JavaFX Buttons and Events.");
        FlowPane rootNode = new FlowPane(10, 10);
        rootNode.setAlignment(Pos.CENTER);
        Scene myScene = new Scene(rootNode, 300, 100);
        myStage.setScene(myScene);

        response = new Label("Push a Button");
        Button btnUp = new Button("Up");
        Button btnDown = new Button("Down");

        btnUp.setOnAction(new EventHandler<ActionEvent>() {
            public void handle(ActionEvent ae) {
                response.setText("You pressed Up.");
            }
        });

        btnDown.setOnAction(new EventHandler<ActionEvent>() {
            public void handle(ActionEvent ae) {
                response.setText("You pressed Down.");
            }
        });

        rootNode.getChildren().addAll(btnUp, btnDown, response);
        myStage.show();
    }
}

该示例使用两个按钮和一个标签，每次按下按钮，标签会显示按下的按钮信息。同时，创建 FlowPane 时指定了水平和垂直间距，避免控件紧挨在一起，并通过 setAlignment() 方法将元素居中显示。

四、其他 JavaFX 控件

4.1 复选框（CheckBox）

4.1.1 基本操作

JavaFX 中的复选框由 CheckBox 类封装，其直接父类是 ButtonBase 。默认情况下，复选框有选中和未选中两种状态，还支持第三种不确定状态。创建复选框可使用以下构造函数：

CheckBox(String str)

例如：

CheckBox cbSmartphone = new CheckBox("Smartphone");

复选框状态改变时会生成 ActionEvent ，可通过 isSelected() 方法判断其状态，示例代码如下：

cbSmartphone.setOnAction(new EventHandler<ActionEvent>() {
    public void handle(ActionEvent ae) {
        if(cbSmartphone.isSelected())
            response.setText("Smartphone was just selected.");
        else
            response.setText("Smartphone was just cleared.");
        showAll();
    }
});

4.1.2 不确定状态

若要使用复选框的不确定状态，需显式启用，步骤如下：
1. 调用 setAllowIndeterminate() 方法启用不确定状态：

cbSmartphone.setAllowIndeterminate(true);

2. 在事件处理程序中添加对不确定状态的判断：

cbSmartphone.setOnAction(new EventHandler<ActionEvent>() {
    public void handle(ActionEvent ae) {
        if(cbSmartphone.isIndeterminate())
            response.setText("Smartphone state is indeterminate.");
        else if(cbSmartphone.isSelected())
            response.setText("Smartphone was just selected.");
        else
            response.setText("Smartphone was just cleared.");
        showAll();
    }
});

4.2 列表视图（ListView）

4.2.1 创建与配置

JavaFX 中的列表视图由 ListView 类封装，它是泛型类，可显示列表项供用户选择。创建 ListView 时，需传入 ObservableList 作为显示的列表项，示例如下：

ObservableList<String> computerTypes =
    FXCollections.observableArrayList("Smartphone", "Tablet", "Notebook", "Desktop");
ListView<String> lvComputers = new ListView<String>(computerTypes);

可通过 setPrefHeight() 和 setPrefWidth() 方法设置列表视图的首选高度和宽度，也可使用 setPrefSize() 方法一次性设置两个维度：

lvComputers.setPrefSize(100, 70);

4.2.2 事件监听

可通过注册 ChangeListener 监听列表视图的选择变化，步骤如下：
1. 获取列表视图的选择模型：

MultipleSelectionModel<String> lvSelModel = lvComputers.getSelectionModel();

2. 注册变化监听器：

lvSelModel.selectedItemProperty().addListener(
    new ChangeListener<String>() {
        public void changed(ObservableValue<? extends String> changed, String oldVal, String newVal) {
            response.setText("Computer selected is " + newVal);
        }
    }
);

4.2.3 启用多选

若要在 ListView 中启用多选功能，需调用选择模型的 setSelectionMode() 方法，示例如下：

lvComputers.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);

获取选中项列表可调用 getSelectedItems() 方法：

ObservableList<String> selectedItems = lvSelModel.getSelectedItems();

五、总结

本文介绍了 JavaFX 中场景图节点的添加与移除操作，详细阐述了事件处理的基础、按钮控件的使用及相关事件处理，还介绍了复选框和列表视图等控件的基本操作与高级特性。通过这些内容，你可以初步掌握 JavaFX 控件与事件处理的核心知识，为开发更复杂的 JavaFX 应用程序打下基础。

主要知识点总结

知识点	描述
场景图节点操作	使用 add() 和 addAll() 添加节点， remove() 移除节点， isEmpty() 和 size() 进行列表管理
事件处理	基于委托事件模型，通过 EventHandler 接口处理事件，可使用匿名内部类或 lambda 表达式
按钮控件	使用 Button 类创建按钮，通过 setOnAction() 注册事件监听器
复选框	CheckBox 类封装复选框，支持选中、未选中和不确定三种状态，通过 isSelected() 和 isIndeterminate() 判断状态
列表视图	ListView 类封装列表视图，可通过 ObservableList 提供列表项，使用 ChangeListener 监听选择变化，可启用多选功能

流程图：ListView 事件监听流程

graph TD;
    A[创建 ListView] --> B[获取选择模型];
    B --> C[获取选中项属性];
    C --> D[注册变化监听器];
    D --> E[选择变化时触发监听器];
    E --> F[更新显示信息];

流程图：CheckBox 事件处理流程

graph TD;
    A[复选框状态改变] --> B[生成 ActionEvent];
    B --> C[判断是否选中];
    C -- 是 --> D[显示选中信息];
    C -- 否 --> E[判断是否为不确定状态];
    E -- 是 --> F[显示不确定信息];
    E -- 否 --> G[显示未选中信息];
    D --> H[更新选中项列表显示];
    F --> H;
    G --> H;

六、各控件使用场景与优势分析

6.1 按钮（Button）

• 使用场景 ：按钮通常用于触发特定的操作，如提交表单、执行计算、切换视图等。在需要用户主动发起某个动作时，按钮是非常合适的选择。例如，在一个登录界面中，“登录”按钮用于触发登录验证操作；在一个文件管理系统中，“删除”按钮用于删除选中的文件。
• 优势 ：按钮的操作直观，用户可以很容易地理解其功能。通过设置不同的文本和样式，可以清晰地向用户传达按钮的作用。同时，按钮的事件处理机制简单明了，便于开发者实现各种功能。

6.2 复选框（CheckBox）

• 使用场景 ：复选框适用于需要用户从多个选项中选择零个或多个的场景。例如，在一个问卷调查中，让用户选择自己感兴趣的话题；在一个设置界面中，让用户选择需要启用的功能。
• 优势 ：复选框可以让用户灵活地选择多个选项，并且可以直观地看到自己的选择状态。其支持的不确定状态在某些特殊场景下非常有用，比如当需要表示某个选项的状态还未确定或者不适用时。

6.3 列表视图（ListView）

• 使用场景 ：列表视图用于展示一系列的选项，用户可以从中选择一个或多个。当需要展示大量数据，并且需要用户进行选择操作时，列表视图是一个很好的选择。例如，在一个音乐播放器中，展示歌曲列表供用户选择播放；在一个联系人管理系统中，展示联系人列表供用户选择查看详细信息。
• 优势 ：列表视图可以自动添加滚动条，当列表项数量超过显示区域时，用户可以方便地滚动查看所有选项。同时，通过设置不同的选择模式，可以满足单选和多选的需求。

七、实际应用案例

7.1 简单的设置界面

假设我们要创建一个简单的设置界面，允许用户选择需要启用的功能和设置首选的显示模式。可以使用复选框和按钮来实现这个界面。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.CheckBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class SettingsApp extends Application {

    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Settings");

        // 创建复选框
        CheckBox cbFeature1 = new CheckBox("Enable Feature 1");
        CheckBox cbFeature2 = new CheckBox("Enable Feature 2");
        CheckBox cbFeature3 = new CheckBox("Enable Feature 3");

        // 创建保存按钮
        Button btnSave = new Button("Save Settings");
        btnSave.setOnAction(e -> {
            // 处理保存设置的逻辑
            boolean feature1Enabled = cbFeature1.isSelected();
            boolean feature2Enabled = cbFeature2.isSelected();
            boolean feature3Enabled = cbFeature3.isSelected();
            System.out.println("Feature 1 enabled: " + feature1Enabled);
            System.out.println("Feature 2 enabled: " + feature2Enabled);
            System.out.println("Feature 3 enabled: " + feature3Enabled);
        });

        // 创建布局
        VBox vbox = new VBox(10);
        vbox.getChildren().addAll(cbFeature1, cbFeature2, cbFeature3, btnSave);

        // 创建场景
        Scene scene = new Scene(vbox, 200, 200);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

7.2 数据选择界面

创建一个数据选择界面，使用列表视图展示数据，用户可以选择一个或多个数据项，然后通过按钮进行操作。

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.ListView;
import javafx.scene.control.SelectionMode;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class DataSelectionApp extends Application {

    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Data Selection");

        // 创建数据列表
        ObservableList<String> dataList = FXCollections.observableArrayList(
                "Data 1", "Data 2", "Data 3", "Data 4", "Data 5"
        );

        // 创建列表视图
        ListView<String> listView = new ListView<>(dataList);
        listView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);

        // 创建处理按钮
        Button btnProcess = new Button("Process Selected Data");
        btnProcess.setOnAction(e -> {
            // 获取选中的数据项
            ObservableList<String> selectedItems = listView.getSelectionModel().getSelectedItems();
            for (String item : selectedItems) {
                System.out.println("Processing: " + item);
            }
        });

        // 创建布局
        VBox vbox = new VBox(10);
        vbox.getChildren().addAll(listView, btnProcess);

        // 创建场景
        Scene scene = new Scene(vbox, 200, 200);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

八、常见问题与解决方案

8.1 事件处理程序响应过慢

如果事件处理程序执行的操作过于复杂，会导致应用程序响应变慢。例如，在事件处理程序中进行大量的计算或网络请求。
- 解决方案 ：对于耗时的操作，应使用单独的线程来执行，避免阻塞主线程。可以使用 Java 的 Thread 类或 ExecutorService 来创建和管理线程。

8.2 控件布局混乱

在创建布局时，如果没有正确设置间距和对齐方式，可能会导致控件布局混乱，影响用户体验。
- 解决方案 ：在创建布局容器时，合理设置间距和对齐方式。例如，使用 FlowPane 时，通过构造函数指定水平和垂直间距；使用 setAlignment() 方法将元素居中或按照其他方式对齐。

8.3 多选功能无法正常使用

在 ListView 中启用多选功能后，可能会出现无法正确获取选中项的问题。
- 解决方案 ：确保正确设置了选择模式为 SelectionMode.MULTIPLE ，并使用 getSelectedItems() 方法获取选中项列表。

九、进一步学习建议

9.1 深入学习 JavaFX API

JavaFX 提供了丰富的 API，涵盖了各种控件、布局、动画等功能。可以深入学习这些 API，了解更多高级特性和用法，如自定义控件、样式表的使用等。

9.2 参考官方文档和示例

官方文档是学习 JavaFX 的重要资源，其中包含了详细的 API 文档和示例代码。可以参考官方文档来解决遇到的问题，并学习最佳实践。

9.3 参与开源项目

参与开源的 JavaFX 项目可以学习到其他开发者的优秀代码和设计思路，同时也可以为开源社区做出贡献。

9.4 实践项目

通过实践项目来巩固所学的知识，尝试开发一些小型的 JavaFX 应用程序，逐渐提高自己的开发能力。

十、总结回顾

10.1 知识体系总结

类别	具体内容
场景图操作	添加节点（ add() 和 addAll() ）、移除节点（ remove() ）、列表管理（ isEmpty() 和 size() ）
事件处理	委托事件模型、 EventHandler 接口、匿名内部类和 lambda 表达式的使用
控件使用	按钮（ Button ）、复选框（ CheckBox ）、列表视图（ ListView ）的创建、事件处理和高级特性
应用开发	实际应用案例的开发，包括设置界面和数据选择界面
问题解决	常见问题的分析与解决方案

10.2 流程图总结

按钮事件处理流程

graph TD;
    A[按钮被按下] --> B[生成 ActionEvent];
    B --> C[调用事件处理程序];
    C --> D[执行处理逻辑];
    D --> E[更新界面显示];

复选框状态变化处理流程

graph LR;
    A[复选框状态改变] --> B{判断状态};
    B -- 选中 --> C[显示选中信息];
    B -- 未选中 --> D[显示未选中信息];
    B -- 不确定 --> E[显示不确定信息];
    C --> F[更新相关设置];
    D --> F;
    E --> F;

通过本文的学习，你已经对 JavaFX 控件与事件处理有了较为全面的了解。希望这些知识能帮助你开发出更加丰富和实用的 JavaFX 应用程序。在后续的学习和实践中，不断探索和尝试，你将能够掌握更多的技巧和方法，提升自己的开发水平。