2

I am unable to find a way to set the distance to the border in a GridPane. Now, the text starts immediately after the border stops, which is not very nice for the design. I could give all the children a padding, but I was thinking there must be a shorter way to do this (just some property of the GridPane).

Unfortunately, I was not able to find this anywhere online. I prefer a solution which uses FXML or CSS (preferably CSS), but if this must be done with some Java code, it is not a problem.

I have already tried:

  • Setting the margin of the GridPane in the CSS: #someGridPane { -fx-border-insets: 5; }, but these insets are outside the border (and I want them inside).
  • Setting padding on all of the child elements, which is not as efficient as I had hoped).

So the question is: How to set the distance to the border in a GridPane?

Notes:

  1. I am using JavaFX8
  2. If the solution is somewhere online already, please let me know. (I searched for it for some time now)
bashoogzaad
  • 4,611
  • 8
  • 40
  • 65
  • Set some insets on your text - if the text is represented by a `Node` that is not a region, wrap it in some kind of pane and set insets on the pane. – James_D Dec 12 '14 at 21:58
  • Thanks James_D for your comment! Do you share the opinion that being able to set an automatic padding to the border could be a great property for e.g. a `GridPane`? – bashoogzaad Dec 14 '14 at 21:10

2 Answers2

2

Depending on what's in your grid pane you could cheat a bit.

GridPane > Text  {-fx-translate-x : 5;}
GridPane > Label {-fx-label-padding: 0 0 0 5;}

Of course, add some style class names, but you get the idea.

brian
  • 10,619
  • 4
  • 21
  • 79
  • Thanks for your answer! Not quite what I was hoping for, but if the GridPane has no such property, this is probably the best way to do it. – bashoogzaad Dec 13 '14 at 16:12
  • I'm not yet experienced with javafx css, what do I have to do with it? If I apply it as inline-style it gives me an error: `CSS Error parsing '*{GridPane > Text {-fx-translate-x : 5;} GridPane > Label {-fx-label-padding: 0 0 0 5;}}: Expected COLON at [1,11] ` – xeruf Oct 23 '17 at 20:22
  • @Xerus It's not inline code, but goes in a style sheet. Inline you would do something like `text.setStyle("-fx-translate-x : 5;");` – brian Oct 23 '17 at 23:57
1

There is a simpler, more natural solution:

GridPane { 
    -fx-padding: 5; 
    -fx-hgap: 5; 
    -fx-vgap: 5; 
}

It does the same as using GridPane.setHgap(5) etc, but with CSS.

xeruf
  • 2,602
  • 1
  • 25
  • 48