GridPane JavaFx中的冗余单元格

GridPane JavaFx中的冗余单元格,java,javafx,gridpanel,Java,Javafx,Gridpanel,我是JavaFX新手,我想创建一个包含一些列和行的网格示例。网格如下所示: -第一行:第一个单元格(宽度=100)占据1列,第二个单元格(宽度=200)占据2列 -第二行:第一个(宽度=200)单元格占据2列,第二个单元格(宽度=100)占据1列 但我不知道为什么会出现意外的单元格。如下图所示: 我的代码如下: // Label 1 Label lbl1 = new Label("Label1"); lbl1.setPrefWidth(100); lbl

我是JavaFX新手,我想创建一个包含一些列和行的网格示例。网格如下所示: -第一行:第一个单元格(宽度=100)占据1列,第二个单元格(宽度=200)占据2列 -第二行:第一个(宽度=200)单元格占据2列,第二个单元格(宽度=100)占据1列

但我不知道为什么会出现意外的单元格。如下图所示:

我的代码如下:

     // Label 1
     Label lbl1 = new Label("Label1");
     lbl1.setPrefWidth(100);
     lbl1.setStyle("-fx-border-style: solid; -fx-background-color: #80aaff; -fx-border-width: 0.25");
     // Label 2
     Label lbl2 = new Label("Label2");
     lbl2.setStyle("-fx-border-style: solid; -fx-background-color:#ff80bf; -fx-border-width: 0.25");
     lbl2.setPrefWidth(200);
     // Label 3
     Label lbl3 = new Label("Label3");
     lbl3.setPrefWidth(200);
     lbl3.setStyle("-fx-border-style: solid; -fx-background-color:#66ff99; -fx-border-width: 0.25");
     // Label 4
     Label lbl4 = new Label("Label4");
     lbl4.setPrefWidth(100);
     lbl4.setStyle("-fx-border-style: solid; -fx-background-color: #ffff66; -fx-border-width: 0.25");

     GridPane gridPane = new GridPane();
     gridPane.setStyle("-fx-border-style: solid");

     // column 0, row 0, column span 1, row span 1
     gridPane.add(lbl1, 0, 0, 1, 1);
     // column 1, row 0, column span 2, row span 1
     gridPane.add(lbl2, 1, 0, 2, 1);
     // column 0, row 1, column span 1, row span 1
     gridPane.add(lbl3, 0, 1, 2, 1);
     // column 2, row 1, column span 2, row span 1
     gridPane.add(lbl4, 2, 1, 1, 1);
有人能指出我的问题吗?
谢谢。

对于带有列跨距/重叠列的
网格窗格
的首选宽度的计算通常不会像预期的那样工作。您看到的“单元格”是
GridPane
的背景,没有任何子级覆盖

要避免
网格窗格
变得太大,请通过
列约束设置列宽

// Label 1
Label lbl1 = new Label("Label1");
lbl1.setMaxWidth(Double.MAX_VALUE);
lbl1.setStyle("-fx-border-style: solid; -fx-background-color: #80aaff; -fx-border-width: 0.25");
// Label 2
Label lbl2 = new Label("Label2");
lbl2.setStyle("-fx-border-style: solid; -fx-background-color:#ff80bf; -fx-border-width: 0.25");
lbl2.setMaxWidth(Double.MAX_VALUE);
// Label 3
Label lbl3 = new Label("Label3");
lbl3.setMaxWidth(Double.MAX_VALUE);
lbl3.setStyle("-fx-border-style: solid; -fx-background-color:#66ff99; -fx-border-width: 0.25");
// Label 4
Label lbl4 = new Label("Label4");
lbl4.setMaxWidth(Double.MAX_VALUE);
lbl4.setStyle("-fx-border-style: solid; -fx-background-color: #ffff66; -fx-border-width: 0.25");

GridPane gridPane = new GridPane();

ColumnConstraints constraints = new ColumnConstraints(100);
gridPane.getColumnConstraints().addAll(constraints, constraints, constraints);

gridPane.setStyle("-fx-border-style: solid");

// column 0, row 0, column span 1, row span 1
gridPane.add(lbl1, 0, 0);
// column 1, row 0, column span 2, row span 1
gridPane.add(lbl2, 1, 0, 2, 1);
// column 0, row 1, column span 1, row span 1
gridPane.add(lbl3, 0, 1, 2, 1);
// column 2, row 1, column span 2, row span 1
gridPane.add(lbl4, 2, 1);
但是,这并不能防止在调整窗口大小时重新出现空的“空间”。要对所有列使用相同的大小,而不考虑网格窗格的宽度,请使用
percentWidth

ColumnConstraints constraints = new ColumnConstraints();
constraints.setPercentWidth(100d/3d);
gridPane.setPrefWidth(300);

请阅读并采取相应行动。谢谢您的评论。我检查了这篇文章,但我不知道我的问题的格式有什么错误,我必须如何编辑。你能不能告诉我清楚地告诉我,在SWT中,我可以通过GridLayout(100,true)创建一个具有指定列(例如:100列)的布局,列的大小基于布局的大小(布局将水平填充)和列的数量,我可以在JavaFX中这样做?JavaFX等价物是
int columnCount=100;ColumnConstraints=新ColumnConstraints();约束。setPercentWidth(100d/列计数);对于(int i=0;i