Reputation: 13
I've a problem with an exercise. There is an unexplained space between the first and the second buttons on the scene. I've change the location of the buttons but still the first one has a space from the second one. What cause this and how can I make this space shorter? https://i.sstatic.net/YVmzC.jpg
public void start(Stage myStage) {
GridPane myPane = new GridPane();
myPane.setPadding(new Insets(10, 10, 10, 10));
myPane.setHgap(10);
myPane.setVgap(10);
Button btn1 = new Button("Computer Scinence");
Button btn2 = new Button("Chemistry");
Button btn3 = new Button("Arts");
DrawText txt1 = new DrawText("Computer Scince","Times Roman",FontWeight.BOLD,FontPosture.ITALIC,20,Color.GREEN);
DrawText txt2 = new DrawText("Chemistry","Times Roman",FontWeight.BOLD,FontPosture.ITALIC,20,Color.BLUE);
DrawText txt3 = new DrawText("Arts","Times Roman",FontWeight.BOLD,FontPosture.ITALIC,20,Color.YELLOW);
GridPane.setConstraints(btn1,0,1);
GridPane.setConstraints(btn2,1,1);
GridPane.setConstraints(btn3,2,1);
GridPane.setConstraints(txt1,0,2);
GridPane.setConstraints(txt2,0,3);
GridPane.setConstraints(txt3,0,4);
myPane.getChildren().addAll(btn1,btn2,btn3,txt1,txt2,txt3);
Scene myScene = new Scene(myPane,350,190);
myStage.setScene(myScene);
myStage.setTitle("Exercise 3_3");
myStage.show();
}
Upvotes: 0
Views: 54
Reputation: 10253
You can often debug GridPane
layout issues by turning on the grid lines:
myPane.setGridLinesVisible(true);
After recreating your application (you did not include your DrawText
class, so I'm just styling Labels instead) and turning on the grid lines reveals the issue:
You can see that the Computer Science Label
at GridPane
location 0, 1
has a greater width than the Computer Science Button
. This causes the GridPane
to expand the width of the first column to accommodate the Label
.
You have a couple of options to resolve this, depending on how you want the layout to work.
1) Set Column Span:
If you want to keep the Computer Science Button
the same size, but have the first column's width not expand to fit the Label
, just have that Label
span 2 columns:
GridPane.setColumnSpan(txt1, 2);
2) Increase Button Width:
If you'd like the Computer Science Button
to expand to fill the rest of the column, you can set its MaxWidth
property to use the maximum value:
btn1.setMaxWidth(Double.MAX_VALUE);
Upvotes: 6