JavaFX TableView change selected cell colour - css

I have a JavaFX TableView and a ListView and they both use custom cell factories. In particular I have overridden updateItem method in order to bind a particular CSS class based on cell value.
This is part of my CSS file:
.tissueCell {
-fx-text-fill: #F5AD11;
}
.tissueCell:selected {
-fx-background-color: #F5AD11;
-fx-text-fill: white;
}
.significantDataCell {
-fx-background-color: yellow;
-fx-text-fill: black;
}
.significantDataCell:selected {
-fx-background-color: white;
-fx-text-fill: black;
}
For the ListView everything work flawlessly: text is displayed with the proper colour and when the cell is selected the text becomes white and the background is filled with proper colour.
I am experiencing problems with the TableView instead. When unselected the text in the cell is displayed with the chosen colour, but when the cell is selected the background is filled with default JavaFX colour for selected table cells background and the text colour remains #F5AD11 (it does not become white).
The same happens with TableCells that use .significantDataCell class. Cells are displayed properly with yellow background and black text, but when selected nothing changes, not event the background this time.
Any ideas? I did a lot of research but couldn't find any working solution.

By default, TableViews do not allow selection of individual cells, but allow selection of rows. Thus the selector .table-cell:selected never matches any cell in the default selection mode. In this case, you would need
.table-row-cell:selected .table-cell {
/* style definitions */
}
or in your scenario
.table-row-cell:selected .tissue-cell {
-fx-background-color: #F5AD11;
-fx-text-fill: white;
}
etc.
If you allow the table to use cell selection, by calling
myTableView.setCellSelectionEnabled(true);
then individual cells become selected on mouse click (etc), and so your original CSS will work.

Related

Is there a way to color the row of a selected cell via css?

In My TableView with CellSelection enabled i would like to Color the Selected Cell in Light-Blue and the Row of the Selected Cell in Dark-Blue.
I can put this into the RowListener. This Works but drains Performance because i need to Reload the Rows when the selection of cells changes.
In Css i can do:
.table-row:selected {
-fx-background-color: #005797;
}
.table-row-cell:selected {
-fx-background-color: #009097;
}
But this only works for the Row with RowSelection and for the Cell with CellSelection.
Is there a way to do both in css for CellSelection?

Change tableview multiple selection javafx

I want to change the color of TableView row in multiple selection mode. I 've used setStyle("-fx-selection-bar: red;") to set color in single selection mode.
I tried setStyle("-fx-selection-bar-non-focused: salmon;") but this code change the color of the selections when table is unfocused.
Thanks in advance
Are you looking for -fx-control-inner-background?
.table-row-cell {
-fx-control-inner-background: orange;
-fx-selection-bar: red;
}

Keeping the same selection color in a TableView whether it's active or not

I'm using QTableView class in my GUI and I would like the selected row to have the same color whether the TableView is active or inactive.
I tried to set this CSS stylesheet to achieve this:
QTableView:!active {
selection-background-color: palette(Highlight);
selection-color: palette(HighlightedText)
}
On Linux, it works just fine, but on Windows 7, when the TableView loses its focus, the text turns black instead of staying white (the background stays blue, so that part is OK). Am I missing something here ?
You also have to style text color, for example just add:
QTableView:!active {
...
selection-color: white;
}
This works well in python
pal = tbl_list.palette()
pal.setColor(QPalette.Inactive, QPalette.Highlight, pal.color(QPalette.Active, QPalette.Highlight))
tbl_list.setPalette(pal)

How change color selected row in tableView javafx

I have a TableView clear.
I have an button1, when I click this I added a row in my tableView and I select the row. This row is in red by the line css :
.table-row-cell:selected {-fx-background-color: red;}
Next, I have a button2, and I would like that when I click on the button2, the background color on my row selected change in blue.
Help me.
Thanks.
add this code into your .css file:
#blue_cell .table-row-cell:selected{
-fx-background-color: blue;
}
then add this into your java file
button2.setOnAction(e -> productsTable.setId("blue_cell"));
You have many ways for changing the values of properties in css from java code.
You can define a look-up color in css and use setStyle() method in java like that :
.table-view {
-selected-color:red;
}
.table-row-cell:selected{
-fx-background-color: -selected-color;
}
Then use setStyle() method :
button2.setOnAction(e -> table.setStyle("-selected-color:blue;"));

Change the selection color of a QTableWidget

The default is for the selected row to be colored gray if the QTableWidget does not have focus, and orange if it does have focus. I would like to, instead, make the selected row be red whether or not the widget has focus. I tried adding this to the style sheet:
QTableWidget{ selection-background-color: red}
I also tried
QTableWidget:edit-focus{ selection-background-color: red}
and
QTableWidget:focus{ selection-background-color: red}
but none of them seem to turn anything red, it still seems to remain orange if focused and gray if not. What properties do I have to set to make the selected row always the same color, whether or not it has focus?
Thanks,
David
You almost had it. Technically speaking, you're adjusting the selection color of the items within your table widget, so:
QTableWidget::item{ selection-background-color: red}
should do the trick.
Alternatively:
QTableWidget::item{ background-color: blue }
QTableWidget::item:selected{ background-color: red }
background-color will set background color of the items in row and selection-color will set the text color because when the row is selected then if text are present in the row then it might become unreadable due to color so setting proper text color is important.
#d9fffb : light blue
#000000 : black
self.table.setStyleSheet(
"QTableView::item:selected"
"{"
"background-color : #d9fffb;"
"selection-color : #000000;"
"}"
)

Resources