在GridPane中分配剩余的space或如何做

Question

我们需要满足以下要求的 3 列布局解决方案：

中间栏有固定大小
中间列在父列中居中
其他两列共享剩余的 space
其他两列大小相同

假设我们有 440 像素的水平 space 和固定大小为 40 像素的中间列。另外两列应共享剩余的 400px，以便每列的宽度为 200px。

------------------------------------
|    200px    | 40px |    200px    |
------------------------------------

如果整体尺寸发生变化，假设为 500px，中间列的宽度不应发生变化，但其他列的宽度应发生变化。

----------------------------------------
|     230px     | 40px |     230px     |
----------------------------------------

如果使用 GridPane 可以做到这一点，请告诉我怎么做。

如果 GridPane 无法做到这一点，我愿意听取其他建议。

我更喜欢一个简单的解决方案 a) Java 没有 FXML 的代码和 b) Java只有 Fx，所以有额外的库。

Answer 1

您只需要三个列约束：

ColumnConstraints leftCol = new ColumnConstraints();
leftCol.setHgrow(Priority.ALWAYS);
ColumnConstraints middleCol = new ColumnConstraints(40);
ColumnConstraints rightCol = new ColumnConstraints();
rightCol.setHgrow(Priority.ALWAYS);

GridPane gridPane = new GridPane();
gridPane.getColumnConstraints().addAll(leftCol, middleCol, rightCol);

如果您愿意，可以在 FXML 中执行相同的操作：

<GridPane>
  <columnConstraints>
    <ColumnConstraints hgrow="ALWAYS"/>
    <ColumnConstraints minWidth="40" prefWidth="40" maxWidth="40"/>
    <ColumnConstraints hgrow="ALWAYS"/>
  </columnConstraints>

  <!-- ... -->
</GridPane>

这是一个 SSCCE：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.stage.Stage;

public class GridPaneTest extends Application {

    @Override
    public void start(Stage primaryStage) {
        ColumnConstraints leftCol = new ColumnConstraints();
        leftCol.setHgrow(Priority.ALWAYS);
        ColumnConstraints middleCol = new ColumnConstraints(40);
        ColumnConstraints rightCol = new ColumnConstraints();
        rightCol.setHgrow(Priority.ALWAYS);


        GridPane gridPane = new GridPane();
        gridPane.getColumnConstraints().addAll(leftCol, middleCol, rightCol);

        Region left = new Region();
        left.setMinHeight(80);
        left.setStyle("-fx-background-color: red;");

        Region middle = new Region();
        middle.setMinHeight(80);
        middle.setStyle("-fx-background-color: green ;");

        Region right = new Region();
        right.setMinHeight(80);
        right.setStyle("-fx-background-color: blue ;");

        gridPane.addRow(0, left, middle, right);

        Scene scene = new Scene(gridPane, 400, 80);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

在GridPane中分配剩余的space或如何做

Distribute remaining space in GridPane or how to do it

java

user-interface

javafx

gridpane