JavaFX - 表格视图 (TableView)



TableView 是一种图形用户界面组件,用于以表格形式显示数据。类似于典型的表格,TableView 包含列、行和单元格,每个单元格可以容纳任何类型的数据。一般来说,表格表示如下所示:

JavaFX TableView

JavaFX 中的 TableView

在 JavaFX 中,表格视图由TableView 类表示。此类是名为javafx.scene.control 包的一部分。通过实例化此类,我们可以在 JavaFX 中创建一个 TableView 节点。它有两个构造函数:

  • TableView() - 这是默认构造函数,用于创建一个没有任何预定义数据的表格视图。

  • TableView(ObservableList items) - 这是 TableView 类的参数化构造函数,它接受项目列表并创建一个包含指定项目的新表格视图。

在 JavaFX 中创建 TableView 的步骤

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

步骤 1:创建一个类来表示表格中的数据

首先,我们需要创建一个类来表示要在 TableView 中显示的数据。此类应具有与表格列对应的属性。在这里,我们将使用下面的代码块创建一个名为 movie 的类,其属性为标题、演员、价格和评分:

// The data model class 
public static class Movie {
    private final SimpleStringProperty title;
    private final SimpleStringProperty actor;
    private final SimpleDoubleProperty price;
    private final SimpleIntegerProperty rating;

步骤 2:为 TableView 创建列

创建 TableColumn 对象,并使用setCellValueFactory() 方法设置其单元格值。单元格值工厂是一个函数,它告诉列如何从上面声明的数据模型类中提取数据。以下代码块显示了如何创建列:

// Creating columns for the TableView
TableColumn<Movie, String> titleColumn = new TableColumn<>("Movie Name");
titleColumn.setCellValueFactory(cellData -> cellData.getValue().titleProperty());
TableColumn<Movie, String> actorColumn = new TableColumn<>("Actor");
actorColumn.setCellValueFactory(cellData -> cellData.getValue().authorProperty());
TableColumn<Movie, Number> priceColumn = new TableColumn<>("Price");
priceColumn.setCellValueFactory(cellData -> cellData.getValue().priceProperty());
TableColumn<Movie, Number> ratingColumn = new TableColumn<>("IMDB Rating");
ratingColumn.setCellValueFactory(cellData -> cellData.getValue().ratingProperty()); 

步骤 3:实例化 TableView 类

实例化javafx.scene.control 包的TableView 类,无需向其构造函数传递任何参数值,并使用以下代码块添加所有列:

// Creating a TableView
TableView<Movie> tableView = new TableView<>();
// Adding the columns to the TableView
tableView.getColumns().addAll(titleColumn, actorColumn, priceColumn, ratingColumn);

步骤 4:启动应用程序

创建表格视图并添加所有数据后,请按照以下步骤正确启动应用程序:

  • 首先,通过将 TableView 对象作为参数值传递给其构造函数来实例化名为BorderPane 的类。

  • 然后,通过将 BorderPane 对象作为参数值传递给其构造函数来实例化名为Scene 的类。我们还可以将应用程序屏幕的尺寸作为可选参数传递给此构造函数。

  • 然后,使用Stage 类的setTitle() 方法设置阶段的标题。

  • 现在,使用名为Stage 的类的setScene() 方法将 Scene 对象添加到阶段。

  • 使用名为show() 的方法显示场景的内容。

  • 最后,在launch() 方法的帮助下启动应用程序。

示例

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

import javafx.application.Application;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class JavafxTableview extends Application {
   // The data model class 
   public static class Movie {
      private final SimpleStringProperty title;
      private final SimpleStringProperty actor;
      private final SimpleDoubleProperty price;
      private final SimpleIntegerProperty rating;
      // constructor
      public Movie(String title, String actor, double price, int rating) {
         this.title = new SimpleStringProperty(title);
         this.actor = new SimpleStringProperty(actor);
         this.price = new SimpleDoubleProperty(price);
         this.rating = new SimpleIntegerProperty(rating);
      }
      // getters and setters to access the data
      public SimpleStringProperty titleProperty() {
         return title;
      }
      public SimpleStringProperty authorProperty() {
         return actor;
      }
      public SimpleDoubleProperty priceProperty() {
         return price;
      }
      public SimpleIntegerProperty ratingProperty() {
         return rating;
      }
   }
   // main method starts here
   @Override
   public void start(Stage stage) throws Exception {
      // adding some sample data
      ObservableList<Movie> movies = FXCollections.observableArrayList(
         new Movie("The Batman", "Robert Pattinson", 299, 7),
         new Movie("John Wick: Chapter 4", "Keanu Reeves", 199, 7),
         new Movie("12th Fail", "Vikrant Massey", 199, 9),
         new Movie("Money Heist", "Alvaro Morte", 499, 8),
         new Movie("The Family Man", "Manoj Bajpayee", 399, 8)
      );
      // Creating a TableView
      TableView<Movie> tableView = new TableView<>();
      // Creating columns for the TableView
      TableColumn<Movie, String> titleColumn = new TableColumn<>("Movie Name");
      titleColumn.setCellValueFactory(cellData -> cellData.getValue().titleProperty());
      TableColumn<Movie, String> actorColumn = new TableColumn<>("Actor");
      actorColumn.setCellValueFactory(cellData -> cellData.getValue().authorProperty());
      TableColumn<Movie, Number> priceColumn = new TableColumn<>("Price");
      priceColumn.setCellValueFactory(cellData -> cellData.getValue().priceProperty());
      TableColumn<Movie, Number> ratingColumn = new TableColumn<>("IMDB Rating");
      ratingColumn.setCellValueFactory(cellData -> cellData.getValue().ratingProperty());
      // Adding the columns to the TableView
      tableView.getColumns().addAll(titleColumn, actorColumn, priceColumn, ratingColumn);
      // Set the items of the TableView
      tableView.setItems(movies);
      // Create a BorderPane and set the TableView as its center
      BorderPane root = new BorderPane();
      root.setCenter(tableView);
      // Create a Scene and set it on the Stage
      Scene scene = new Scene(root, 400, 300);
      stage.setTitle("Table View 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 JavafxTableview.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls JavafxTableview

输出

执行上述程序后,将生成一个 JavaFX 窗口,其中显示一个 Tableview,其中包含如下所示的电影列表。

Tableview Output

创建 TableView 的嵌套列

有时,我们需要在多个子列中显示单个列的数据。当单个实体具有多个属性时,这很常见,例如,一个人可以有多个联系电话或电子邮件帐户。在这种情况下,我们创建所需的列,并使用getColumns() 方法将它们添加到父列中,如下面的 JavaFX 代码所示。将此代码保存在名为NestedTableview.java 的文件中。

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;
public class NestedTableview extends Application {
   @Override
   public void start(Stage stage) {
      // Defining the columns
      TableColumn firstCol = new TableColumn("Column One");
      TableColumn secondCol = new TableColumn("Column Two");
      // creating sub-columns of secondCol
      TableColumn firstSubCol = new TableColumn("Sub Col1");
      TableColumn secondSubCol = new TableColumn("Sub Col2");
      // adding the sub-columns to secondCol
      secondCol.getColumns().addAll(firstSubCol, secondSubCol);
      TableColumn lastCol = new TableColumn("Column Three");
      // instantiating the TableView class 
      TableView newTableview = new TableView();
      newTableview.getColumns().addAll(firstCol, secondCol, lastCol);
      VBox root = new VBox();
      root.setSpacing(5);
      root.getChildren().addAll(newTableview);
      // Create a Scene and set it on the Stage
      Scene scene = new Scene(root, 400, 300);
      stage.setTitle("Nested TableView 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 NestedTableview.java
java --module-path %PATH_TO_FX% --add-modules javafx.controls NestedTableview

输出

执行上述代码后,将生成以下输出。

Nested Tableview Output
广告