GridPane 中的居中按钮和文本 (JavaFX)

Question

我有一个简单的显示，最上面有一个标题，中间有一个列表，然后底部有三个按钮。我希望顶部的标题和底部的按钮水平居中。

这是我一直在尝试使用的代码：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ListView?>
<?import javafx.scene.layout.GridPane?>

<GridPane
    xmlns="http://javafx.com/javafx/8.0.40"
    xmlns:fx="http://javafx.com/fxml/1"
    fx:controller="controllers.SongLibraryController"
>
    <Label
        text="Todo List"
        GridPane.columnSpan="3"
        GridPane.rowIndex="0"
        GridPane.halignment="CENTER"
    />
    <ListView
        prefWidth="300"
        prefHeight="400"
        fx:id="listView"
        GridPane.columnSpan="3"
        GridPane.rowIndex="1"
    />
    <Button
        fx:id="editItem"
        GridPane.halignment="CENTER"
        GridPane.columnIndex="0"
        GridPane.rowIndex="2"
        text="Edit Item"
    />
    <Button
        fx:id="addItem"
        GridPane.halignment="CENTER"
        GridPane.columnIndex="1"
        GridPane.rowIndex="2"
        text="Add Item"
    />
    <Button
        fx:id="deleteItem"
        GridPane.halignment="CENTER"
        GridPane.columnIndex="2"
        GridPane.rowIndex="2"
        text="Delete Item"
    />
</GridPane>

这是当前输出：

我已经尝试做各种事情，例如对我的 GridPane 使用 alignment="CENTER"，但似乎没有任何效果。如有任何帮助，我们将不胜感激！

Answer 1

您需要将 GridPane 的对齐方式设置为 alignment="center" 并且所有元素都将居中对齐。

更新您可以像这样将按钮居中对齐。

<HBox GridPane.rowIndex="2" GridPane.columnSpan="3" alignment="CENTER" spacing="25">
    <Button text="b1"/>
    <Button text="b2"/>
    <Button text="b3"/>
</HBox>

此次更新后，您还可以删除每个节点的 columnSpan 属性。

Answer 2

要以编程方式对齐网格窗格内的元素，您必须从 GridPane 调用静态方法 class。

要设置水平对齐方式，请调用 GridPane.setHalignment(Node n, HPos p)。要设置垂直对齐，请调用 GridPane.setValignment(Node n, VPos p).

您可以阅读 Oracle 自己的布局指南 here。如果您向下滚动直到看到饼图，它们会显示如何在网格窗格中管理布局的示例。

要通过 FXML 管理它，您必须设置特定的属性。我不记得我的头顶，但我认为它是您的 GridPane 节点中的 alignment="center"。

GridPane 中的居中按钮和文本 (JavaFX)

Centering buttons and text in a GridPane (JavaFX)

java

javafx

centering

fxml