Question

我正在为我的任务创建一个“ threes”克隆，其中一个属性是根据列和行的数量动态地调整大小GridPane，如何实现呢？

我已经考虑过添加ColumnConstraints和RowConstraints，并赋予它们总GridPane大小的百分位数宽度除以列数：

// width = total / number of columns
// height = total / number of rows

在Scene Builder中，GridPane的大小默认为4x4；这些元素似乎可以调整大小，但是当说加载4x5大小时，似乎只想显示4x4（样式化），而其余的瓦片看起来“很奇怪”。

是这样的：https://imgur.com/gallery/Qv1oWZb

// width = total / number of columns
// height = total / number of rows

gridPane.setGridLinesVisible(false);
gridPane.setAlignment(Pos.TOP_LEFT);

gridPane.getChildren().clear();

RowConstraints rowConstraint = new RowConstraints();
rowConstraint.setPercentHeight(300 / game.getBoardSizeY());

ColumnConstraints colConstraint = new ColumnConstraints();
colConstraint.setPercentWidth(350 / game.getBoardSizeX());

for(int x= 0; x < game.getBoardSizeX(); x++) {
    gridPane.getColumnConstraints().add(colConstraint);

    for(int y = 0; y < game.getBoardSizeY(); y++) {

        gridPane.getRowConstraints().add(rowConstraint);

        Tile tile = game.getBoard().getPos(x, y);

        Pane pane = new Pane();

        String lblText = "";
        String itemClass = "";

        if(tile.getValue() != 0) {
            lblText = String.valueOf(tile.getValue());
        }

        int tileVal = tile.getValue();

        if(tileVal == 1) {
            itemClass = "blueTile";
        }else if (tileVal == 2) {
            itemClass = "redTile";
        }else if (tileVal >= 3 ) {
            itemClass = "whiteTile";
        }else {
            itemClass = "defaultTile";
        }

        Label lblVal = new Label(lblText);

        pane.getStyleClass().addAll("tile", itemClass);
        lblVal.layoutXProperty().bind(pane.widthProperty().subtract(lblVal.widthProperty()).divide(2));

        pane.getChildren().add(lblVal);
        gridPane.add(pane, x, y);
    }       
}

我希望它相应地填满我的整个GridPane，但它会起作用并向我显示图像中显示的结果。

编辑：

我已经开始使用它了，但是当我区分行时（例如4x5），它的大小还不够。

gridPane.setGridLinesVisible(false);
gridPane.setAlignment(Pos.TOP_LEFT);

gridPane.getChildren().clear();
gridPane.getChildren().removeAll();
gridPane.getColumnConstraints().clear();
gridPane.getRowConstraints().clear();

RowConstraints rowConstraint = new RowConstraints();
rowConstraint.setPercentHeight(350 / game.getBoardSizeY());

ColumnConstraints colConstraint = new ColumnConstraints();
colConstraint.setPercentWidth(300 / game.getBoardSizeX());

for(int x= 0; x < game.getBoardSizeX(); x++) {
    gridPane.getColumnConstraints().add(colConstraint);
    gridPane.getRowConstraints().add(rowConstraint);

    for(int y = 0; y < game.getBoardSizeY(); y++) {
        Tile tile = game.getBoard().getPos(x, y);

        Pane pane = new Pane();

        String lblText = "";
        String itemClass = "";

        if(tile.getValue() != 0) {
            lblText = String.valueOf(tile.getValue());
        }

        int tileVal = tile.getValue();

        if(tileVal == 1) {
            itemClass = "blueTile";
        }else if (tileVal == 2) {
            itemClass = "redTile";
        }else if (tileVal >= 3 ) {
            itemClass = "whiteTile";
        }else {
            itemClass = "defaultTile";
        }

        Label lblVal = new Label(lblText);

        pane.getStyleClass().addAll("tile", itemClass);
        lblVal.layoutXProperty().bind(pane.widthProperty().subtract(lblVal.widthProperty()).divide(2));

        pane.getChildren().add(lblVal);
        gridPane.add(pane, x, y);
    }       
}

Answer 1

如果我的理解正确，您希望调整行和列的大小，以便所有列具有相同的宽度，所有行具有相同的高度。如果正确，那听起来是错误的：

我已经考虑过添加columnConstraints和rowConstraints，并赋予它们总网格面积大小的百分位数宽度，以列数表示
// width = total / number of columns
// height = total / number of rows

百分位宽度/高度是相对测量值。您不会根据当前的宽度/高度来计算该值。例如，如果您有4行，则每行应为高度的25％。

也就是说，我不认为您需要弄乱约束的宽度或高度设置。只需将RowConstraints.vgrow和ColumnConstraints.hgrow属性设置为Priority.ALWAYS。这是一个示例：

import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.geometry.Pos;
import javafx.geometry.VPos;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.Priority;
import javafx.scene.layout.RowConstraints;
import javafx.stage.Stage;

public class Main extends Application {

  @Override
  public void start(Stage primaryStage) {
    GridPane root = new GridPane();
    root.setAlignment(Pos.CENTER);
    root.setGridLinesVisible(true);

    for (int col = 0; col < 5; col++) {
      root.getColumnConstraints()
          .add(new ColumnConstraints(-1, -1, -1, Priority.ALWAYS, HPos.CENTER, false));
      for (int row = 0; row < 3; row++) {
        if (col == 0) {
          root.getRowConstraints()
              .add(new RowConstraints(-1, -1, -1, Priority.ALWAYS, VPos.CENTER, false));
        }
        root.add(new Label(String.format("(%d,%d)", row, col)), col, row);
      }
    }

    primaryStage.setScene(new Scene(root, 500, 300));
    primaryStage.show();
  }

}

动态调整GridPane的内容为其父级的属性的大小

1 个答案: