JavaFX中的按钮对齐方式

Pet*_*zov 7 java javafx javafx-2

我用关闭按钮创建了这个JavaFX对话框:

final int xSize = 300;
final int ySize = 280;
final Color backgroundColor = Color.WHITE;
final String text = "SQL Browser Version 1.0";

final Stage aboutDialog = new Stage();
aboutDialog.initModality(Modality.WINDOW_MODAL);

Button closeButton = new Button("Close");
closeButton.setAlignment(Pos.BOTTOM_CENTER);

closeButton.setOnAction(new EventHandler<ActionEvent>() {
    @Override
    public void handle(ActionEvent arg0) {
        aboutDialog.close();
    }
});

Scene aboutDialogScene = new Scene(VBoxBuilder.create()
    .children(new Text(text), closeButton)
    .alignment(Pos.CENTER)
    .padding(new Insets(10))
    .build(), xSize, ySize, backgroundColor);

aboutDialog.setScene(aboutDialogScene);
aboutDialog.show();
Run Code Online (Sandbox Code Playgroud)

我想在对话框的底部显示按钮.我用它来设置对齐: closeButton.setAlignment(Pos.BOTTOM_CENTER);但由于某种原因,按钮显示在对话框的中心.你能告诉我怎么解决这个问题吗?

jew*_*sea 18

如果你想使用a VBox,你正在寻找的方法是:

VBox.setVgrow(node, Priority.ALWAYS);


默认情况下,VBox只会将孩子从放置位置的左上角放在另一个之下.除非您对具有无限最大高度的子项设置Vgrow约束,否则子项不会展开以填充所有可用的垂直区域.

您可以通过几种不同的方式获得所寻求的布局(还有其他方式):

  1. 使用a StackPane代替a VBox并将按钮对齐StackPane.setAlignment(closeButton, Pos.BOTTOM_CENTER);
  2. 适当地使用AnchorPane而不是a VBox和设置约束AnchorPane.
  3. 使用弹簧区域,该区域是一个空的区域,可以扩展以填充空白区域.

样品弹簧区域:

Region topSpring    = new Region();
Region bottomSpring = new Region();
Scene aboutDialogScene = new Scene(VBoxBuilder.create()
        .children(topSpring, new Text(text), bottomSpring, closeButton)
        .alignment(Pos.CENTER)
        .padding(new Insets(10))
        .build(), xSize, ySize, backgroundColor);
VBox.setVgrow(topSpring, Priority.ALWAYS);
VBox.setVgrow(bottomSpring, Priority.ALWAYS);
Run Code Online (Sandbox Code Playgroud)

调用closeButton.setAlignment(Pos.BOTTOM_CENTER);设置closeButton中事物(文本和图形)的对齐方式,而不是closeButton在其父级内的对齐方式(这是您真正想要的).


为了理解布局约束的工作原理,SceneBuilder是一个很好的工具,而ScenicView可以帮助调试现有代码中的布局问题.


以下是您的布局的一些FXML示例,您可以将其加载到SceneBuilder中以查看不同的布局选项如何工作.

如果您愿意,可以使用JavaFX API轻松地使用Java编写下面的所有示例.我用fxml编写它们,因为它使布局很容易在SceneBuilder中预览.

使用StackPane的FXML示例:

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>

<StackPane id="StackPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="280.0" prefWidth="300.0" xmlns:fx="http://javafx.com/fxml">
  <children>
    <Label text="SQL Browser Version 1.0" />
    <Button mnemonicParsing="false" text="Button" StackPane.alignment="BOTTOM_CENTER" />
  </children>
  <padding>
    <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
  </padding>
</StackPane>
Run Code Online (Sandbox Code Playgroud)

fxml的快照

一些春季地区也是如此:

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>

<VBox alignment="CENTER" prefHeight="280.0" prefWidth="300.0" xmlns:fx="http://javafx.com/fxml">
  <children>
    <Region prefHeight="-1.0" prefWidth="-1.0" VBox.vgrow="ALWAYS" />
    <Label text="SQL Browser Version 1.0" />
    <Region prefHeight="-1.0" prefWidth="-1.0" VBox.vgrow="ALWAYS" />
    <Button mnemonicParsing="false" text="Close" />
  </children>
</VBox>
Run Code Online (Sandbox Code Playgroud)

与标签本身相同的事情设置为扩展以填充VBox中的空白空间:

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>

<VBox alignment="CENTER" prefHeight="280.0" prefWidth="300.0" xmlns:fx="http://javafx.com/fxml">
  <children>
    <Label maxHeight="1.7976931348623157E308" text="SQL Browser Version 1.0" VBox.vgrow="ALWAYS" />
    <Button mnemonicParsing="false" text="Close" />
  </children>
  <padding>
    <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
  </padding>
</VBox>
Run Code Online (Sandbox Code Playgroud)