JavaFX8 tree table view custom root row


Question

In my tree-table-view I have a root item which contains child items(I have mistakenly called them root items) that in turn have child items. I need to customize those mistakenly called root items rows text appearance. Is there such a selector or how else would that be done?

Thanks.

1
0
4/22/2014 3:39:44 PM

Accepted Answer

This will set a pseudo-class on the row containing the root:

final PseudoClass firstRowClass = PseudoClass.getPseudoClass("first-row");

treeTableView.setRowFactory(treeTable -> {
    TreeTableRow<...> row = new TreeTableRow<>();
    row.treeItemProperty().addListener((ov, oldTreeItem, newTreeItem) -> 
        row.pseudoClassStateChanged(firstRowClass, newTreeItem == treeTable.getRoot()));
    return row ;
});

Now you can select that row in css with

.tree-table-row-cell:first-row { ... }

Complete example here

It sounds like you want to style the immediate child nodes of the root node. In this case, just do

    row.treeItemProperty().addListener((ov, oldTreeItem, newTreeItem) -> 
        row.pseudoClassStateChanged(firstRowClass, 
           newTreeItem != null && newTreeItem.getParent() == treeTable.getRoot()));

instead of the condition in the code above. Obviously, you can use other criteria as you need them (e.g. ! newTreeItem.isLeaf()).

Note that the default style sheet rules for tree-table-row are a little strange: -fx-background-color is set for the row, but -fx-text-fill is set for both the row and the cells inside it. So if you want to change the background color, you just need

-tree-table-row-cell:first-row {
  -fx-background-color: antiquewhite ;
}

but if you want to change the text color, you need to change it on the cells:

-tree-table-row-cell:first-row .tree-table-cell {
  -fx-text-fill: red ;
}
1
4/22/2014 3:58:26 PM

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