Search code examples
javafxjavafx-8root-nodetreetableview

JavaFX8 tree table view custom root row


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.


Solution

  • 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 ;
    }