Get the height of a node in JavaFX (generate a layout pass)

Solution 1:

What you need to do is:

  1. Create the nodes which are to be placed in the VBoxes.
  2. Add them to some scene (it can just be a new dummy scene not attached to the stage but having the same CSS rules as your main scene).
  3. Call applyCss() and layout() on each of the nodes (or the dummy scene root).
  4. Measure the layout bounds of each of the nodes.
  5. Add the nodes to the VBoxes in your real scene according to your layout algorithm.

Related

To find out how to measure the size of a node, see the answer to:

  • How to calculate the pixel width of a String in JavaFX?

Background

JavaFX layout calculations work by applying CSS and a layout pass. Normally this occurs as part of a pulse (a kind of automated 60fps tick in the internal JavaFX system which checks for any dirty objects in the scene which need new css or layout applied to them). In most cases, you can just specify the changes you want to the scene and let the automated pulse layout mechanism handle the layout at that time; doing so is quite efficient as it means that any changes between a pulse are batched up and you don't need to manually trigger layout passes. However, when you need to actually get the size of things before the layout occurs (as in your case), then you need to manually trigger the CSS application and layout pass before you try to query the height and width extents of the node.

Documentation

Unfortunately the detailed Java 8u20 Javadoc for the node.applyCSS() method is currently broken, so I'll reproduce the sample which is in the Javadoc code here, so you can see the recommended usage in context. For the next Java feature release (8u40), the broken javadoc is fixed as part of RT-38330 Javadoc is missing for several methods of the Node class, so with that release, you will be able to find the following text in the JavaFX javadoc:

If required, apply styles to this Node and its children, if any. This method does not normally need to be invoked directly but may be used in conjunction with layout() to size a Node before the next pulse, or if the Scene is not in a Stage.

Provided that the Node's Scene is not null, CSS is applied to this Node regardless of whether this Node's CSS state is clean. CSS styles are applied from the topmost parent of this Node whose CSS state is other than clean, which may affect the styling of other nodes. This method is a no-op if the Node is not in a Scene. The Scene does not have to be in a Stage.

This method does not invoke the layout() method. Typically, the caller will use the following sequence of operations.

parentNode.applyCss();
parentNode.layout();

As a more complete example, the following code uses applyCss() and layout() to find the width and height of the Button before the Stage has been shown. If either the call to applyCss() or the call to layout() is commented out, the calls to getWidth() and getHeight() will return zero (until some time after the Stage is shown).

public void start(Stage stage) throws Exception {
   Group root = new Group();
   Scene scene = new Scene(root);

   Button button = new Button("Hello World");
   root.getChildren().add(button);

   root.applyCss();
   root.layout();

   double width = button.getWidth();
   double height = button.getHeight();

   System.out.println(width + ", " + height);

   stage.setScene(scene);
   stage.show();
}

Alternative

The other option here is to override the layoutChildren() method of a parent node, which is "Invoked during the layout pass to layout the children in this Parent.". In doing so, it may also be necessary to override methods to computePrefHeight() as well as other computation methods for prefWidth and min & max height & width. A detailed description of using this approach is complicated and outside the scope of this answer.