如何在FXML中使用BorderPane对齐来对齐HBox?

时间:2018-05-23 14:38:30

标签: java javafx fxml

我在尝试将HBox按钮对齐到底部对话框的中心位置。 我想在fxml中执行此操作。但是,BorderPane对齐在标签中工作。 这是我方的代码。我认为即使标签是Bottom,BorderPane.alignment =“BOTTOM_CENTER”也必须有效。

班级档案:

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>

1 个答案:

答案 0 :(得分:2)

BorderPane.alignment静态属性仅对父级为BorderPane的节点有意义。您的FXML文件中定义的ButtonHBox作为父级,因此在按钮上设置BorderPane.alignment属性将不起作用。

只需使用HBox的{​​{1}}属性(alignment&#39定位,您就可以通过将按钮置于HBox内来实现所需的效果;在其边界内的子节点):

HBox

这给出了

enter image description here

<?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> 需要LabelBorderPane.alignment="CENTER"需要HBox的原因是因为他们有不同的可调整范围,特别是他们的最大宽度不同。默认情况下,标签的最大宽度是其首选宽度,而alignment="CENTER"的最大宽度是无限宽度。您可以通过在它们上设置背景颜色来看到这一点:

HBox

enter image description here

<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的{​​{1}}属性。

如果需要,可以更改最大宽度以达到相同的效果。例如:

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> 属性具有所需的效果:

enter image description here

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> 会产生预期的效果:

enter image description here