FXML：调整窗口大小时如何使按钮居中？

【问题标题】：FXML: how to keep buttons in center when resizing window?FXML：调整窗口大小时如何使按钮居中？
【发布时间】：2018-05-16 00:14:36
【问题描述】：

我正在尝试在 FXML 中设计一个 UI，并部分使用 Scene Builder。我使用 Anchorpane 将所有内容放置在场景中。但是，当我将窗口大小调整为更大时，按钮会从中心向左移动。我想确保它们保持在页面的中心。这个怎么做？谢谢。

【问题讨论】：

发布您的FXML 文件。如果它很大，请发布一个淡化的版本，只显示你正在尝试做的事情。
如果您只是将所有内容放在AnchorPane 中，您可能会因为调整大小、字体更改和分辨率等原因而遇到很多问题。

标签： user-interface javafx fxml scenebuilder

【解决方案1】：

简单的方法是使用StackPane 或BorderPane。对于 BorderPane，您可以使用 Pos.CENTER 将按钮或包含按钮的容器保持在中心位置。

如果真的需要 AnchorPane，你可以利用 width 和 height 属性改变监听器在调整大小时调整按钮位置。

private AnchorPane anchorPane;
private Button button;

anchorPane.widthProperty().addListener((ObservableValue<? extends Number> observable, Number oldValue, Number newValue) -> {
        button.setLayoutX(newValue.doubleValue()/2 - (button.widthProperty().getValue() / 2));
    });
anchorPane.heightProperty().addListener((ObservableValue<? extends Number> observable, Number oldValue, Number newValue) -> {
        button.setLayoutY(newValue.doubleValue()/2 - (button.heightProperty().getValue() / 2));
    });

【讨论】：