0

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.

Mike Spike
  • 389
  • 8
  • 20

1 Answers1

1

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 ;
}
James_D
  • 201,275
  • 16
  • 291
  • 322
  • I tried it and got it to work. If you're changing the text fill you probably need `.tree-table-row-cell:first-row .tree-table.cell { -fx-text-fill: red; }` in the external css (for some reason the text fill is specified in both `tree-table-row-cell` and `tree-table-cell` in `modena.css`). – James_D Apr 22 '14 at 12:34
  • still no luck..I don't know why, could it be that I have a global invisible root item which contains several visible root items? – Mike Spike Apr 22 '14 at 15:00
  • yes it did, but it is the case I described in the comment above..there's only first global root item colored in red – Mike Spike Apr 22 '14 at 15:26
  • I thought that's what you were looking for. You said "the root row". There is only one root ion a TreeView or TreeTableView. – James_D Apr 22 '14 at 15:31
  • Ok, I guess I should reformulate the question – Mike Spike Apr 22 '14 at 15:34
  • Excellent! The updated answer(below the example) did the job. I apologize for the confusion created by the initial question. Thanks a lot! – Mike Spike Apr 22 '14 at 16:23