JavaFX CSS
JavaFX - CSS

JavaFX - 树视图

TreeView 是一种图形用户界面组件，用于显示项目的层次结构。它由一个根节点和任意数量的子节点组成。主要地，树视图用于组织具有层次结构的数据。它提供了对数据及其与其他组件关系的更好理解。在下图中，我们可以看到组件的树视图。

JavaFX 中的 TreeView

在 JavaFX 中，树视图由名为 TreeView 的类表示。此类属于 javafx.scene.control 包。通过实例化此类，我们可以在 JavaFX 中创建一个树视图。TreeView 类的构造函数如下所示：

TreeView() - 这是默认构造函数，用于构造一个空的树视图。
TreeView(TreeItem rootNode) - 它创建一个新的树视图，并使用指定的根节点。

如何在 JavaFX 中创建 TreeView？

按照以下步骤在 JavaFX 中创建树视图。

步骤 1：创建 TreeView 的根节点

首先，为所有项目的列表创建容器。在这种情况下，根节点是容器，因为它包含所有子节点。要创建根节点，我们使用 TreeItem 类，它是 javafx.scene.control 包的一部分。将根节点的名称作为参数值传递给此类的构造函数。

// Creating the root node
TreeItem<String> root = new TreeItem<>("Smartphones");

步骤 2：创建 TreeView 的子节点

再次使用 TreeItem 类创建子节点。创建子节点后，使用 getChildren() 方法以及 addAll() 将所需项目添加到其中。

TreeItem<String> ios = new TreeItem<>("iOS");
ios.getChildren().addAll(
   new TreeItem<>("iPhone 15 Plus"),
   new TreeItem<>("iPhone 14")
);

步骤 3：将子节点添加到根节点

要将子节点添加到根节点，请将子节点的名称作为参数值传递给 addAll() 方法，如下面的代码块所示：

// Add the child nodes to the root node
root.getChildren().addAll(android, ios);

步骤 4：实例化 TreeView 类

要创建树视图，请实例化 TreeView 类并将根节点作为参数值传递给其构造函数，如下面的代码所示：

// Create the TreeView and add the root node
TreeView<String> treesV = new TreeView<>(root);

步骤 5：启动应用程序

创建树视图后，请按照以下步骤正确启动应用程序：

首先，通过将 TreeView 对象作为参数值传递给其构造函数来实例化名为 Scene 的类。我们还可以将应用程序屏幕的尺寸作为可选参数传递给此构造函数。
然后，使用 Stage 类的 setTitle() 方法设置舞台的标题。
现在，使用名为 Stage 的类的 setScene() 方法将 Scene 对象添加到舞台。
使用名为 show() 的方法显示场景的内容。
最后，借助 launch() 方法启动应用程序。

示例

以下是使用 JavaFX 创建 TreeView 的程序。将此代码保存在名为 JavafxTreeview.java 的文件中。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.stage.Stage;
public class JavafxTreeview extends Application {
   @Override
   public void start(Stage stage) throws Exception {
      // Creating the root node
      TreeItem<String> root = new TreeItem<>("Smartphones");
      root.setExpanded(true);
      // Creating its child nodes
      TreeItem<String> android = new TreeItem<>("Android");
      android.getChildren().addAll(
         new TreeItem<>("Samsung Galaxy S23 Ultra"),
         new TreeItem<>("Xiaomi Redmi Note 13 Pro"),
         new TreeItem<>("OnePlus 11R")
      );
      TreeItem<String> ios = new TreeItem<>("iOS");
      ios.getChildren().addAll(
         new TreeItem<>("iPhone 15 Plus"),
         new TreeItem<>("iPhone 14")
      );
      // Add the child nodes to the root node
      root.getChildren().addAll(android, ios);
      // Create the TreeView and add the root node
      TreeView<String> treesV = new TreeView<>(root);
      // Create a scene and add the TreeView
      Scene scene = new Scene(treesV, 400, 300);
      stage.setTitle("TreeView in JavaFX");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String[] args) {
      launch(args);
   }
}

使用以下命令从命令提示符编译并执行保存的 Java 文件：

javac --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTreeview.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTreeview

输出

执行上述程序后，会生成一个 JavaFX 窗口，其中显示了一个 TreeView，其中包含如下所示的智能手机列表。

设置 TreeView 的鼠标事件

如果我们想显示用户点击了哪些项目，那么我们可以使用 setOnMouseClicked() 方法，并传递一个 lambda 表达式，如下面的 JavaFX 代码所示。将此代码保存在名为 JavafxTreeview.java 的文件中。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
import javafx.stage.Stage;
public class JavafxTreeview extends Application {
   @Override
   public void start(Stage stage) throws Exception {
      // Creating the root node
      TreeItem<String> root = new TreeItem<>("Smartphones");
      root.setExpanded(true);
      // Creating its child nodes
      TreeItem<String> android = new TreeItem<>("Android");
      android.getChildren().addAll(
         new TreeItem<>("Samsung Galaxy S23 Ultra"),
         new TreeItem<>("Xiaomi Redmi Note 13 Pro"),
         new TreeItem<>("OnePlus 11R")
      );
      TreeItem<String> ios = new TreeItem<>("iOS");
      ios.getChildren().addAll(
         new TreeItem<>("iPhone 15 Plus"),
         new TreeItem<>("iPhone 14")
      );
      // Add the child nodes to the root node
      root.getChildren().addAll(android, ios);
      // Create the TreeView and add the root node
      TreeView<String> treesV = new TreeView<>(root);
      // Handle mouse clicks on the nodes
      treesV.setOnMouseClicked(event -> {
         // Get the selected item
         TreeItem<String> item = treesV.getSelectionModel().getSelectedItem();
         if (item != null) {
            // Display the item text
            System.out.println(item.getValue());
         }
      });
      // Create a scene and add the TreeView
      Scene scene = new Scene(treesV, 400, 300);
      stage.setTitle("TreeView in JavaFX");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String[] args) {
      launch(args);
   }
}

要从命令提示符编译并执行保存的 Java 文件，请使用以下命令：

javac --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTreeview.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTreeview

输出

执行上述代码后，将生成以下输出。当我们点击项目时，其名称将显示在控制台上。

打印页面