JavaFX - How to change TableView color of selected unfocused row?

Question

No matter what i do - the color of the row keeps unchanged and has a greyish color. The changes only work for when the TableView is in focus.

I have tried every other suggestion i found online, for example a solution from another thread:

.table-row-cell:selected { -fx-background-color: red; }

Nothing seems to work and affect the rows when not in focus.

Answer 1

Problem

You want to change the color of the selection bar for a focused and unfocused state of TableView

Solution

There is a -fx-selection-bar and -fx-selection-bar-non-focused definition in modena.css (default JavaFX style sheet). Both of them are in a section called Theming. So they are meant to be part of a changeable "global" theme. If you change them for the whole application, it will not only change the way TableView will color the selection, it will change even Menu's, List's etc. So you should be aware of it.

But from your comments above it should be clear, that you try to add the style by calling the method .setStyle() on the TableView instance. If you doing that, changing the color by this boths attributes will result in changing only the color of the TableView selection bar.

An Minimal, Complete, and Verifiable example could look like the following code:

TableRowColor.java

 package tablerowcolor;

import javafx.application.Application;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class TableRowColor extends Application {

  @Override
  public void start(Stage primaryStage) {
    ObservableList<Person> persons
            = FXCollections.observableArrayList(
                    new Person("Sir", "Tobey"),
                    new Person("Admiral", "von Schneider"),
                    new Person("Mr.", "Pommeroy"),
                    new Person("Mr.", "Winterbottom"));

    TableView<Person> tableView = new TableView<>(persons);
    tableView.
            setStyle("-fx-selection-bar: red; -fx-selection-bar-non-focused: salmon;");

    TableColumn<Person, String> firstNameCol = new TableColumn<>("First Name");
    firstNameCol.setCellValueFactory(new PropertyValueFactory("firstName"));
    TableColumn<Person, String> lastNameCol = new TableColumn<>("Last Name");
    lastNameCol.setCellValueFactory(new PropertyValueFactory("lastName"));

    tableView.getSelectionModel().clearAndSelect(0);
    tableView.getColumns().setAll(firstNameCol, lastNameCol);

    Button btn = new Button();
    btn.setText("Focus me");

    VBox root = new VBox();
    root.getChildren().addAll(tableView, btn);

    Scene scene = new Scene(root, 300, 250);

    primaryStage.setTitle("Selection Row Color");
    primaryStage.setScene(scene);
    primaryStage.show();
  }

  /**
   * @param args the command line arguments
   */
  public static void main(String[] args) {
    launch(args);
  }

  public class Person {

    private final StringProperty firstName
            = new SimpleStringProperty(this, "firstName");

    public void setFirstName(String value) {
      firstNameProperty().set(value);
    }

    public String getFirstName() {
      return firstNameProperty().get();
    }

    public StringProperty firstNameProperty() {
      return firstName;
    }

    private final StringProperty lastName
            = new SimpleStringProperty(this, "lastName");

    ;

    public void setLastName(String value) {
      lastNameProperty().set(value);
    }

    public String getLastName() {
      return lastNameProperty().get();
    }

    public StringProperty lastNameProperty() {
      return lastName;
    }

    public Person(String firstName, String lastName) {
      this.firstName.set(firstName);
      this.lastName.set(lastName);
    }
  }
}

Netbeans Project Structure

The JavaFX Appliction Project in Netbeans should look like this:

Working Application

The working application will look like this:

Setting Style in Scene Builder

In Scene Builder you be able to set the same style to a TableView by open the Inspector, than Properties of the TableView and add the following to the style boxes: