Question

以Pane为根，GridPane为其子。根调整阶段大小。如何实现GridPane自动自动使用root来调整宽度？ 应该可以使用任何宽度。是否可以不使用属性绑定？

情况就是这样：

Pane root （黄色）是Scene的根，因此它会填充Stage的宽度和高度。
GridPane（绿色），其中一行和三列作为 root 的子项。
该行应具有固定的高度。
第一列和第三列应具有恒定大小
中间列应该增长到最大值
GridPane应填充其父

不幸的是GridPane没有填充宽度：

代码：

@Override
public void start(Stage primaryStage) throws Exception {
    // Resizes with the stage
    final Pane root = new Pane();
    root.setStyle("-fx-background-color: yellow");

    // grid: 1 row, 3 colums
    // should have a constant height and should grow in width to fill parent pane
    final GridPane gridPane = new GridPane();
    root.getChildren().add(gridPane);
    gridPane.setStyle("-fx-background-color: green");
    gridPane.setGridLinesVisible(true);

    final RowConstraints row = new RowConstraints(100); // constant height = 100
    final ColumnConstraints col1 = new ColumnConstraints(100, Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE);
    // should grow as much as possible in width
    final ColumnConstraints col2 = new ColumnConstraints(200, Control.USE_COMPUTED_SIZE, Double.MAX_VALUE);
    final ColumnConstraints col3 = new ColumnConstraints(100, Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE);
    gridPane.getRowConstraints().add(row);
    gridPane.getColumnConstraints().addAll(col1, col2, col3);

    final Scene scene = new Scene(root);
    primaryStage.setScene(scene);
    primaryStage.setWidth(600);
    primaryStage.setHeight(400);
    primaryStage.show();
}

Answer 1

窗格内节点的大小由单个窗格实现其布局的方式控制：即节点的大小由其父节点有效确定。因此，网格窗格的总体大小由Pane的布局实现控制。

Pane实际上做了最小的布局工作：它有效地将所有内容定位在（0,0）并将其大小调整为其首选大小。因此，您的网格窗格将获得其首选宽度，即列的首选宽度的总和。

因此，要使网格窗格增长，您需要更改其首选宽度，或使用允许您控制其增长方式的布局窗格。

例如：

gridPane.prefWidthProperty().bind(root.widthProperty());

将使网格窗格增长到root的宽度。这只会在所有三列的右侧添加额外的空间，因此另外设置

col2.setHgrow(Priority.ALWAYS);

会让col2有额外的宽度。

或者，使用AnchorPane root：

// Pane root = new Pane();
AnchorPane root = new AnchorPane();

并设置

AnchorPane.setLeftAnchor(gridPane, 0.0);
AnchorPane.setRightAnchor(gridPane, 0.0);

（再次使用col2 hgrow设置）将产生相同的效果。

或者你可以做到

VBox root = new VBox();
root.setFillWidth(true);

（例如：有很多解决方案）。

解决方案的选择取决于根窗格中的其他节点（如果有）。

Answer 2

Pane不会自动布局其子项。请尝试使用VBox。它将填充可用空间的宽度（如果可能）调整其子节点的大小。这样GridPane将在舞台宽度变化时调整大小。

现在，您可以管理网格窗格列如何共享空间。根据你的描述，设置

就足够了

col2.setHgrow( Priority.ALWAYS );

Answer 3

实际上您的结果是预期的100 + 200 + 100 = 400px：

final ColumnConstraints col1 = new ColumnConstraints(100, Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE);
//                                                   ↑
final ColumnConstraints col2 = new ColumnConstraints(200, Control.USE_COMPUTED_SIZE, Double.MAX_VALUE);
//                                                   ↑
final ColumnConstraints col3 = new ColumnConstraints(100, Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE);
//                                                   ↑

你定义：

primaryStage.setWidth(600);

只需更改中间列即可填充余留200px

final ColumnConstraints col1 = new ColumnConstraints(100, Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE);
final ColumnConstraints col2 = new ColumnConstraints(400, Control.USE_COMPUTED_SIZE, Double.MAX_VALUE);
//                                                   ↑ change to 400
final ColumnConstraints col3 = new ColumnConstraints(100, Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE);

Answer 4

要使网格窗格自动调整，请使用fxml。不要使用Java。

请参阅下文，将它们设置为百分比宽度。下面示例中的最后一行具有固定设置。

<GridPane fx:id="gridPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="700.0" xmlns="http://javafx.com/javafx/8.0.121" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.Controller">

  <columnConstraints>
    <ColumnConstraints percentWidth="50" /> 
    <ColumnConstraints percentWidth="50" />
  </columnConstraints>
  <rowConstraints>
    <RowConstraints percentHeight="35" />
    <RowConstraints percentHeight="35" />
    <RowConstraints maxHeight="106.0" minHeight="10.0" prefHeight="106.0" vgrow="ALWAYS" />
  </rowConstraints>
   <children>

在窗格中填充宽度

4 个答案: