元素的位置 - JavaFX 中的 GridPane

Question

我是初级学生 java 开发人员，我必须在 java fx 中创建简单的游戏。 我想学习这个，而不是使用模板或游戏另一个作者。 我在使用 GridPane 时遇到问题。 所以我的应用程序中有 8 个元素。 文本、标签和图像，但我的问题是在舞台上安排元素。 例如，如果我尝试定位一个元素，其他元素丢失了位置。 我做错了什么？

代码：

    grid.setHgap(20);
    grid.setVgap(20);
    grid.setPadding(new Insets(10, 10, 10 ,10));
    grid.add(welcome, 10, 0);

顺便提一句。 gridPane 适合简单的跳棋游戏吗？ 谢谢

Answer 1

因此，您已经在每一列和每一行上设置了填充，这意味着网格中每个元素的所有边都有 10 像素的空间。 然后您在第 10 列中添加了一些内容。 这将创建所有 0-9 列，宽度和高度为 0，因为它们没有内容。 但是，由于它们的填充，它们每个都占用大约 20x20 像素的正方形。 当您向这些空间添加东西时，它们当然会将您的welcome对象移过来，因为它们现在正在占用空间。

不要使用填充来创建列和行的宽度和高度， RowConstraints考虑ColumnConstraints和RowConstraints 。 我在下面添加了他们使用的文档。

从GridPane 文档：

行/列大小调整

默认情况下，行和列的大小将适合其内容； 一列的宽度足以容纳最宽的孩子，一行的高度足以容纳最高的孩子。但是，如果应用程序需要显式控制行或列的大小，则可以通过添加 RowConstraints 和 ColumnConstraints 对象来指定那些指标。 例如，要创建具有两个固定宽度列的网格：

GridPane gridpane = new GridPane();
gridpane.getColumnConstraints().add(new ColumnConstraints(100)); // column 0 is 100 wide
gridpane.getColumnConstraints().add(new ColumnConstraints(200)); // column 1 is 200 wide

默认情况下，网格窗格会将行/列的大小调整为其首选大小（根据内容计算或固定），即使网格窗格的大小调整为大于其首选大小。 如果应用程序需要在有额外空间的情况下增长特定行或列，则可以在 RowConstraints 或 ColumnConstraints 对象上设置其增长优先级。 例如：

GridPane gridpane = new GridPane();
ColumnConstraints column1 = new ColumnConstraints(100,100,Double.MAX_VALUE);
column1.setHgrow(Priority.ALWAYS);
ColumnConstraints column2 = new ColumnConstraints(100);
gridpane.getColumnConstraints().addAll(column1, column2); // first column gets any extra width

注意：跨越多行/多列的节点的大小也将设置为首选大小。 受影响的行/列按以下优先级调整大小：增长优先级，最后一行。 这是关于行/列约束。

百分比大小

或者，RowConstraints 和 ColumnConstraints 允许将大小指定为 gridpane 可用空间的百分比：

 GridPane gridpane = new GridPane();
 ColumnConstraints column1 = new ColumnConstraints();
 column1.setPercentWidth(50);
 ColumnConstraints column2 = new ColumnConstraints();
 column2.setPercentWidth(50);
 gridpane.getColumnConstraints().addAll(column1, column2); // each get 50% of width

如果在行/列上设置了百分比值，则该值优先，行/列的 min、pref、max 和增长约束将被忽略。 请注意，如果 widthPercent（或 heightPercent）值的总和大于 100，则这些值将被视为权重。 例如，如果 3 列每列的 widthPercent 为 50，则每列将分配网格窗格可用宽度的 1/3 (50/(50+50+50))。

混合尺寸类型

应用程序可以自由混合行/列的大小类型（根据内容、固定或百分比计算）。 百分比行/列将始终首先根据网格窗格可用空间的百分比（大小减去插图和间隙）分配空间。 剩余空间将根据行/列的最小、首选和最大大小以及增长优先级分配给行/列。