JavaFX 2.0 :: Using CSS Sub-structure On Own Nodes

May 26, 2014

I have noticed that you can style JavaFX controls using their sub-structure.

E.g. to style the label in a table column header to be left justified I can do this :

.table-view .column-header-background .label { -fx-alignment: center-left ; }

How can I style my own nodes/controls doing this? Basically it amounts to asking how the selectors like ".column-header-background" are associated with sub-structures of my Java control/node objects. So suppose I have something like

.fancy-node .fred .label { ... }

How does JavaFX associate fancy-node and fred with something in my implementation of a Node/Control?

View Replies

JavaFX 2.0 :: Why Does Scene Builder Constantly Create New Instances Of Nodes

Nov 28, 2014

I thought I had a simple idea for creating a control that would let me get some of the behavior of a card pane. This is the entire control:

import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.scene.Node;

[Code] ....

The idea is pretty simple; extend StackPane, add an active property, bind the visible and managed properties of the pane to the active property, and, whenever the active property is changed to true, iterate sibling nodes de-activating any siblings that are also of the type Card.

However, this doesn't work with Scene Builder. While trying to debug, I created an ExtStackPane:

import javafx.collections.ListChangeListener;
import javafx.scene.Node;
import javafx.scene.layout.StackPane;
public class ExtStackPane extends StackPane {
    {
        getChildren().addListener((ListChangeListener<Node>) c -> {
            System.out.println("ExtStackPane children change: " + c.toString());
        });
    }
}

All this does is log list change events. However, I was very surprised by the output when working in Scene Builder. I added both controls to Scene Builder and did the following:

0) Added an ExtStackPane
1) Added a Card to the ExtStackPane
2) Added another Card to the ExtStackPane
3) Added a Label to the first Card
4) Added a Label to the second Card
5) Changed the text of the first Label to Hello
6) Changed the text of the second Label to World
7) Set the first Card to active
8) Set the second Card to active

I get the following output:

1)
ExtStackPane children change: { [Card@5b9067b3] added at 0 }

2)
ExtStackPane children change: { [Card@6b6328bd] added at 0 }
ExtStackPane children change: { [Card@6aca8cc5] added at 1 }

[Code] ....

This is what things look like in Scene Builder:

Does Scene Builder recreate the entire hierarchy every time I make a small change? Here's an application that does the same as the manual steps I performed in Scene Builder:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.stage.Stage;
public class CardApplication extends Application {

[Code] ....

The output when running the above is:

1)
ExtStackPane children change: { [Card@6dfaa767] added at 0 }

2)
ExtStackPane children change: { [Card@6aa2c411] added at 1 }

[Code] ....

The behavior is obviously a lot different than when I'm working with the control in Scene Builder. What Scene Builder is doing to change the behavior of my Card control so much? Does my Card control break some rule(s) I'm not aware of?