Javafx: set the background of a TreeTableView

Question

I'm trying to set the background of a TreeTableView .

CSS Styling Used :

.tree-table-cell, cell{
   -fx-background-color: rgba(0, 0, 0, 1);
   -fx-background-image: url("blur03.jpg");
}

.tree-table-row-cell{
   -fx-background-image: url("blur03.jpg");
}

here is an implementation of a TreeTableColumn in the treetableview

final TreeTableColumn<RootMaster, Integer> dataColumn = new TreeTableColumn<>("Data");
    dataColumn.setCellValueFactory(new TreeItemPropertyValueFactory<RootMaster, Integer>("budgetSum"));
    dataColumn.setCellFactory(col -> {
        TreeTableCell<RootMaster, Integer> cell = new TreeTableCell<RootMaster, Integer>() {
            @Override
            public void updateItem(Integer item, boolean empty) {
                super.updateItem(item, empty);
                if (empty) {
                    setText(null);
                } else {
                    setText(item.toString());
                }
            }
        };
        cell.setAlignment(Pos.CENTER);
        return cell ;
    });

with this css I get:

.tree-table-view, .table-view{
-fx-opacity: 0.3;}

Answer 1

Opacity can help you to make it a little transparent to show the parent behind it.

Inline CSS:

tableView.setStyle(
"-fx-background-color: rgba(0, 100, 100, 0.5);
-fx-background-radius: 10;"
);

Seperate CSS file:

.tree-table-view, .table-view{
-fx-background-color: rgba(0, 100, 100, 0.5);
}

In the above code, 0.5 specifies the opacity or alpha property of the node. A value of 0.5 makes it half opaque. Thus the value of a ranges from 0 to 1 where 1 is fully visible and 0 is fully opaque.

Answer 2

Try this css styling:

.tree-table-row-cell {
    -fx-background: transparent;
}

.tree-table-view {
    -fx-background-color: transparent;
}

Tested with:

@Override
public void start( Stage stage )
{
    TreeItem<String> childNode1 = new TreeItem<>( "Node 1" );
    TreeItem<String> childNode2 = new TreeItem<>( "Node 2" );
    TreeItem<String> childNode3 = new TreeItem<>( "Node 3" );

    TreeItem<String> root = new TreeItem<>( "Root" );
    root.setExpanded( true );

    root.getChildren().setAll( childNode1, childNode2, childNode3 );

    TreeTableColumn<String, String> column = new TreeTableColumn<>( "Column" );
    column.setPrefWidth( 150 );

    column.setCellValueFactory( ( TreeTableColumn.CellDataFeatures<String, String> p ) 
            -> new ReadOnlyStringWrapper( p.getValue().getValue() ) );

    TreeTableView<String> treeTableView = new TreeTableView<>( root );
    treeTableView.getColumns().add( column );


    VBox box = new VBox( treeTableView, new Button( "test" ) );
    box.setStyle( "-fx-background-color: green" );

    final Scene scene = new Scene( box, 200, 400 );
    scene.getStylesheets().add( "path/to/the-style-above.css" );
    stage.setScene( scene );
    stage.show();
}