HOWTO · Java

JavaFX 中的网格和子节点对齐

本教程将讨论 JavaFX 中的网格和子节点对齐。

本页内容

在 JavaFX 中,有一个名为 GridPane 的 UI 组件。通过这个 UI 组件,所有子节点都以列和行的网格形式排列。

该组件所需的包是 javafx.scene.layout

在本文中,我们将讨论对齐并解释有关此主题的示例,以便更好地理解。

JavaFX 中的网格和子节点对齐

在下面的示例中,我们创建了一个带有标签的网格窗格。下面给出了我们示例的代码。

import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class FxGrid extends Application {
  @Override
  public void start(Stage stage) {
    Label lbl = new Label("Simple grid example ..."); // Creating a label with text
    GridPane gridPane = new GridPane(); // Creating a Grid Pane

    gridPane.setPadding(new Insets(10, 10, 10, 10)); // Set the padding of the gridpane

    // Set the vertical and horizontal gaps between the columns
    gridPane.setVgap(15);
    gridPane.setHgap(15);

    gridPane.add(lbl, 0, 1); // Adding the label to the grid pane
    gridPane.setAlignment(Pos.CENTER); // Align the grid pane
    GridPane.setHalignment(lbl, HPos.RIGHT); // Setting the alignment for the child node of grid
                                             // pane

    Scene scene = new Scene(gridPane, 300, 300); // Creating a scene  with necessary size

    stage.setTitle("Grid Alignment Example"); // Setting title to the Application

    stage.setScene(scene); // Adding scene to the stage

    stage.show(); // Displaying the contents of the stage
  }
  public static void main(String args[]) {
    launch(args); // Launching the application
  }
}

我们已经在上面评论了每一行代码的目的。现在,我们将在这里讨论该主题的主要部分。

通过线 gridPane.setVgap(15); gridPane.setHgap(15);,我们为每一列创建了垂直和水平间隙。我们还通过 gridPane.setPadding(new Insets(10, 10, 10, 10)); 行添加了填充。

最重要的部分是分别对齐网格窗格和子节点。在代码中,通过 gridPane.setAlignment(Pos.CENTER); 行对齐网格窗格,并通过 GridPane.setHalignment(lbl, HPos.RIGHT); 行对齐网格窗格的子节点网格。

在我们的例子中,只有一个子节点有标签。编译上述示例代码并在你的环境中运行后,你将获得以下输出。

输出:

JavaFX GridPane 对齐输出

可用的 Hbox 对齐

下面列出了网格窗格子项的所有可用对齐方式。你需要在 setHalignment() 方法中设置它们。

这个方法的一般格式是 setHalignment( ChildNode, Alignment)

对齐方式 描述
HPos.BASELINE_LEFT 垂直对齐基线,水平对齐左
HPos.BASELINE_CENTER 垂直对齐基线,水平对齐中心
HPos.BASELINE_RIGHT 垂直对齐基线,水平对齐右
HPos.BOTTOM_LEFT 垂直对齐底部,水平对齐左
HPos.BOTTOM_CENTER 垂直对齐底部,水平对齐中心
HPos.BOTTOM_RIGHT 垂直对齐底部,水平对齐右
HPos.CENTER_LEFT 垂直居中,水平居左
HPos.CENTER 垂直居中,水平居中
HPos.CENTER_RIGHT 垂直居中,水平居右
HPos.TOP_LEFT 垂直对齐顶部,水平对齐左
HPos.TOP_CENTER 垂直对齐顶部,水平对齐中心
HPos.TOP_RIGHT 垂直对齐顶部,水平对齐右

请记住,如果你的 IDE 不支持自动包含库和包。然后,你可能需要在编译之前手动包含这些必要的库和包。