Как выровнять HBox, используя выравнивание BorderPane в FXML?

Question

Я пытаюсь выровнять кнопки HBox по центру в нижней части диалогового окна.Я хочу сделать это в fxml. Однако выравнивание BorderPane работает в метке.Вот код с моей стороны. Я думаю, что BorderPane.alignment = "BOTTOM_CENTER" должен работать, даже если тег является Bottom.

Файл класса:

package application;

import java.io.IOException;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class HBoxDialog extends Application {

@Override
public void start(Stage primaryStage) {
    try {
        Parent root = FXMLLoader.load(getClass().getResource("HBoxDialog.fxml"));
        primaryStage.setScene(new Scene(root, 500, 100));
        primaryStage.show();
    } catch (IOException e) {
        e.printStackTrace();
    }
}

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

Файл FXML:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.layout.BorderPane?>
<BorderPane xmlns:fx="http://javafx.com/fxml/1">

<top>
    <Label text="this is dialogbox" BorderPane.alignment="TOP_CENTER"/>
    <font>
        <Font size="35"/>
    </font>
</top>

<bottom>
    <HBox spacing="10">
        <Button text="Okay" prefWidth="90" BorderPane.alignment="BOTTOM_CENTER"/>
        <Button text="Cancel" prefWidth="90" BorderPane.alignment="BOTTOM_CENTER"/>
        <Button text="Help" prefWidth="90" BorderPane.alignment="BASELINE_RIGHT"/>
    </HBox>
</bottom>
</BorderPane>

Answer 1

Статическое свойство BorderPane.alignment имеет смысл только для узлов, чей родитель является BorderPane.Button s, определенные в вашем файле FXML, имеют родительский HBox, поэтому установка свойства BorderPane.alignment для кнопок не будет иметь никакого эффекта.

Вы можете добиться желаемого эффекта, центрируя кнопкивнутри HBox, просто используя свойство alignment HBox (которое размещает дочерние узлы HBox в его границах):

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.layout.BorderPane?>
<BorderPane xmlns:fx="http://javafx.com/fxml/1">

    <top>
        <Label text="this is dialogbox"
            BorderPane.alignment="TOP_CENTER" />
        <font>
            <Font size="35" />
        </font>
    </top>

    <bottom>
        <HBox spacing="10" alignment="CENTER">
            <Button text="Okay" prefWidth="90" />
            <Button text="Cancel" prefWidth="90" />
            <Button text="Help" prefWidth="90" />
        </HBox>
    </bottom>
</BorderPane>

Это дает

Причина, по которой Label требуется BorderPane.alignment="CENTER", а HBox нуждается alignment="CENTER", заключается в том, что они имеют различные изменяемые диапазоны и, в частности, их максимальная ширина различна.Максимальная ширина метки по умолчанию является предпочтительной шириной, тогда как максимальная ширина HBox бесконечна.Это можно увидеть, установив цвета фона для них обоих:

    <Label text="this is dialogbox"
        BorderPane.alignment="TOP_CENTER" 
        style="-fx-background-color: aquamarine;"/>

    <!-- ... -->

    <HBox spacing="10" alignment="CENTER"
      style="-fx-background-color: lightskyblue;">

Свойство alignment позиционирует содержимое узла в его границах,Поскольку у метки нет лишних пробелов в пределах границ для текста, который нужно позиционировать, при настройках по умолчанию свойство alignment не будет действовать.С другой стороны, метка является менее широкой, чем верхняя область панели границ, поэтому есть место для ее размещения в этой области.Атрибут BorderPane.alignment="CENTER" центрирует всю метку в верхней области панели границ.

Напротив, сам HBox уже заполняет всю ширину нижней области панели границ.Таким образом, нет дополнительного пространства для его выравнивания в этой области, и поэтому для HBox настройка BorderPane.alignment="CENTER" не будет иметь никакого эффекта.С другой стороны, в самом HBox больше места, чем необходимо для кнопок, поэтому кнопки (содержимое HBox) можно выровнять внутри самого HBox, используя свойство alignment="CENTER"HBox.

Если вы хотите, вы можете изменить максимальную ширину для достижения того же эффекта.Например:

<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.Double?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.layout.BorderPane?>
<BorderPane xmlns:fx="http://javafx.com/fxml/1">

    <top>
        <Label text="this is dialogbox"
            alignment="CENTER" 
            style="-fx-background-color: aquamarine;">

            <maxWidth>
             <Double fx:constant="MAX_VALUE"/>
            </maxWidth>

        </Label>
        <font>
            <Font size="35" />
        </font>
    </top>

    <bottom>
        <HBox spacing="10" alignment="CENTER"
          style="-fx-background-color: lightskyblue;">
            <Button text="Okay" prefWidth="90" />
            <Button text="Cancel" prefWidth="90" />
            <Button text="Help" prefWidth="90" />
        </HBox>
    </bottom>
</BorderPane>

позволяет метке расти (как по умолчанию для HBox), поэтому теперь ее свойство alignment дает желаемый эффект:

или

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.Region?>
<BorderPane xmlns:fx="http://javafx.com/fxml/1">

    <top>
        <Label text="this is dialogbox"
            BorderPane.alignment="CENTER" 
            style="-fx-background-color: aquamarine;" />
        <font>
            <Font size="35" />
        </font>
    </top>

    <bottom>
        <HBox spacing="10" BorderPane.alignment="CENTER"
          style="-fx-background-color: lightskyblue;">

          <maxWidth>
              <Region fx:constant="USE_PREF_SIZE" />
          </maxWidth>

            <Button text="Okay" prefWidth="90" />
            <Button text="Cancel" prefWidth="90" />
            <Button text="Help" prefWidth="90" />
        </HBox>
    </bottom>
</BorderPane>

заставляет HBox вести себя как кнопка, поэтому теперь ее BorderPane.alignment дает желаемый эффект: