JavaFX GridPane的大小相等的瓷砖在添加图像时没有保持正确的大小

Question

我试图在JavaFX中使用GridPane制作一个简单的国际象棋游戏，但我无法使棋盘GUI正常工作。当格网窗格中的块被添加到瓷砖上时，其他没有任何块的瓷砖就会被拉伸或收缩。我希望所有的瓷砖网格窗格总是相同的大小。GridPane中的瓷砖是StackPanes。我想将它们保留为StackPanes，以便将来可以在上面覆盖另一个图像或一些文本。

下面是它的样子（抱歉颜色难看）：

注意，当所有的瓷砖上都有碎片时，它看起来就像我想要的那样：

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Control;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.Background;
import javafx.scene.layout.BackgroundFill;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.CornerRadii;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.Priority;
import javafx.scene.layout.RowConstraints;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class SOQuestion extends Application{
    public static void main(String[] args) {
        Application.launch(args);
    }

    @Override
    public void start(Stage primaryStage) throws Exception {
        final int boardSize = 10;
        final GridPane gridPane = new GridPane();
        gridPane.setMinSize(200, 200);
        for (int i = 0; i < boardSize; i++) {
            final ColumnConstraints columnConstraints = new ColumnConstraints(Control.USE_PREF_SIZE, Control.USE_COMPUTED_SIZE, Double.MAX_VALUE);
            columnConstraints.setHgrow(Priority.ALWAYS);
            columnConstraints.setFillWidth(true);
            gridPane.getColumnConstraints().add(columnConstraints);

            final RowConstraints rowConstraints = new RowConstraints(Control.USE_PREF_SIZE, Control.USE_COMPUTED_SIZE, Double.MAX_VALUE);
            rowConstraints.setVgrow(Priority.ALWAYS);
            rowConstraints.setFillHeight(true);
            gridPane.getRowConstraints().add(rowConstraints);
        }

        Color color1 = new Color(1.0,0,0,1);
        Color color2 = new Color(0,1.0,0, 1);

        for (int i = 0; i < boardSize; i++) {
            for (int j = 0; j < boardSize; j++) {
                StackPane child = new StackPane();

                SOQuestion.WrappedImageView img = new SOQuestion.WrappedImageView(new Image(getClass().getResourceAsStream(
                        "/resources/knight_black.png")));

                child.setBackground(new Background(
                    new BackgroundFill((i+j) % 2 == 0 ? color1 : color2, CornerRadii.EMPTY, Insets.EMPTY)));

                if(Math.random() < 0.1) //to randomly place pieces around the board for demonstration
                    child.getChildren().addAll(img);

                child.setMinSize(0,0);

                GridPane.setRowIndex(child, i);
                GridPane.setColumnIndex(child, j);
                gridPane.getChildren().add(child);
            }
        }

        Scene scene = new Scene(gridPane, 800, 600);

        primaryStage.setScene(scene);
        primaryStage.show();
    }
    class WrappedImageView extends ImageView
    {
        WrappedImageView(Image im)
        {
            super(im);
            setPreserveRatio(false);
        }

        @Override
        public double minWidth(double height)
        {
            return 40;
        }

        @Override
        public double prefWidth(double height)
        {
            Image I=getImage();
            if (I==null) return minWidth(height);
            return I.getWidth();
        }

        @Override
        public double maxWidth(double height)
        {
            return 16384;
        }

        @Override
        public double minHeight(double width)
        {
            return 40;
        }

        @Override
        public double prefHeight(double width)
        {
            Image I=getImage();
            if (I==null) return minHeight(width);
            return I.getHeight();
        }

        @Override
        public double maxHeight(double width)
        {
            return 16384;
        }

        @Override
        public boolean isResizable()
        {
            return true;
        }

        @Override
        public void resize(double width, double height)
        {
            setFitWidth(width);
            setFitHeight(height);
        }
    }
}

事先感谢你的帮助；很抱歉这么长的帖子！

编辑：我还想确保调整窗口大小时，瓷砖和网格窗格的大小适当，以便它填充整个窗口，就像它对当前代码所做的那样。

Answer 1

按照James_D的建议使用SetPercentWidth（100.0/BoardSize)和SetPercentHeight(100.0/BoardSize)就像一个魅力。我决定坚持使用GridPane而不是TilePane,因为它更适合我计划在程序中做的其他事情。谢谢！