How can I set a graphic for a TreeItem in FXML?


Question

I'm trying to configure the root node of my TreeView in FXML:

<TreeView fx:id="treeView" prefHeight="-1.0" prefWidth="-1.0" VBox.vgrow="ALWAYS">
    <TreeItem expanded="false" value="Root" fx:id="rootItem" graphic="/icons/icon_folder.png" />
</TreeView>

There is a property called graphic which takes a Node, and not a String as I have supplied above.

How do I give it a node in FXML that would represent the image stored in my resource at icons/icon_folder.png?

In Java, I can do the following:

final Node iconFolder = new ImageView(
        new Image(TreeArchiveSuite.class.getResourceAsStream("/icons/icon_folder.png"))
);

And then I can just set it on the root node:

rootItem.setGraphic(iconFolder);

However, I would like to be able to do this from FXML only.

1
1
2/19/2014 7:28:28 PM

Accepted Answer

After finding this similar question about setting the graphic property for a Button control with FXML, I was able to accomplish my goal with the following FXML markup:

<TreeItem expanded="false" value="Root" fx:id="rootItem">
    <graphic>
        <ImageView>
            <image>
                <Image url="icons/icon_folder.png" />
            </image>
        </ImageView>
    </graphic>
</TreeItem>
2
5/23/2017 12:28:43 PM

Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
Icon