Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

Tags:

java

javafx

vbox

How to get the height or prefer height of a node in JavaFX, I have 3 VBox and I want to add nodes to the the most freer panel, example:

           Childrens      Total Height of the children's(Sum)
VBoxA          5                     890
VBoxB          4                     610
VBoxC          2                     720

in this case, the most freer is the VBoxB, I calculate the most freer pane with this method:

private int getFreerColumnIndex() {
    if(columns.isEmpty())
        return -1;

    int columnIndex = 0;
    int minHeight = 0;
    for(int i = 0; i < columns.size(); i++) {
        int height = 0;
        for(Node n : columns.get(i).getChildren()) {
            height += n.getBoundsInLocal().getHeight();
        }

        if(i == 0) {
            minHeight = height;
        } else if(height < minHeight) {
            minHeight = height;
            columnIndex = i;
        }

        if(height == 0)
            break;
    }

    return columnIndex;
}

This method only works if I add 1 element at the time. But if I add more elements at the time:

for (int i = 0; i < 10; i++) {
    SomeNode r1 = new SomeNode ();
    myPane.addElement(r1);
}

the method getFreerColumnIndex return the same index. This is because the new nodes dont have heigth in local yet.
So this line:

height += n.getBoundsInLocal().getHeight(); 

will return 0 with the new nodes.

Anyone knows how to get the heigth of a node ?


Extra:

SomeNode extends of Node

Method addElement() at myPane:

public void addElement(final Node element) {
     index = getFreerColumnIndex();
     columns.get(index).getChildren().add(element);
}

Extra 2:

suppose we have 3 vbox: Before:

 A      B      C
 |      |      |
        |      |
        |

Run:

for (int i = 0; i < 10; i++) {
    SomeNode r1 = new SomeNode ();
    myPane.addElement(r1);                      
}

After:

 A      B      C
 |      |      |
 |      |      |
 |      |
 |
 |
 |
 |
 |
 |
 |
 |

Correct:

 A      B      C
 |      |      |
 |      |      |
 |      |      |
 |      |      |
 |      |      |
 |

| = Some node

like image 409
iconer Avatar asked Oct 02 '14 00:10

iconer


2 Answers

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();
}

layout() vs requestLayout()

Calling layout() will perform a layout pass immediately.

Calling requestLayout() will perform a layout pass in the future:

Requests a layout pass to be performed before the next scene is rendered. This is batched up asynchronously to happen once per "pulse", or frame of animation.

So requestLayout() informs the system that a layout needs to occur, but doesn't do the layout right away.

Usually, you don't need to call requestLayout() directly, because most of the time, the JavaFX system is able to internally determine that a region of the scene is dirty and needs to perform layout automatically when needed.

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.

like image 156
jewelsea Avatar answered Nov 18 '22 01:11

jewelsea


import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.stage.Stage;
import java.io.Closeable;

public class Sizing  extends Application {

  @Override
  public void start(Stage stage) {
    var label = new Label();
    var labelHeight = label.getHeight();
    System.out.println(labelHeight);

    try (var s = new SizingSandbox(label)) {
      labelHeight = label.getHeight();
    }

    System.out.println(labelHeight);
  }

  public static void main(String[] args)  { launch(args); }
}


class SizingSandbox extends Group  implements Closeable {

  public SizingSandbox(Node... nodes) {
    new Scene(this);
    getChildren().addAll(nodes);
    layItOut();
  }

  @Override
  public void close() {
    try {
      getChildren().removeAll();
    } catch (Exception e) { }
  }

  private void layItOut() {
    applyCss();
    layout();
  }
}

// output:
// 0.0
// 17.0
like image 1
silvalli Avatar answered Nov 18 '22 03:11

silvalli