css - 如何突出显示我通过 JavaFX 中的复选框选择的列

Question

我有这样的情况: Example

在我选择一个复选框(一个或多个)的那一刻，我想突出显示相应的列。

我正在尝试这种愚蠢和粗鲁的行为 solution ，但它仅在列的标题中有效。

Answer 1

如果你想高亮整个列，你需要在列上使用单元格工厂并高亮单元格。这在本质上类似于 JavaFX - Detect & highlight TableColumn being dragged onto ，但您需要能够突出显示多个列。为此，请使用 ObservableSet<TableColumn<?,?>跟踪哪些列应该突出显示，并从您的复选框中添加/删除列。

这是一个例子，改编自上面链接的例子:

import java.util.Arrays;
import java.util.List;
import java.util.function.Function;

import javafx.application.Application;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.beans.value.ObservableValue;
import javafx.collections.FXCollections;
import javafx.collections.ObservableSet;
import javafx.collections.SetChangeListener.Change;
import javafx.css.PseudoClass;
import javafx.scene.Scene;
import javafx.scene.control.CheckBox;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import javafx.util.Callback;

public class TableColumnHighlightByCheckBox extends Application {

    @Override
    public void start(Stage primaryStage) {
        TableView<Person> table = new TableView<>();
        table.getColumns().add(column("First Name", Person::firstNameProperty));
        table.getColumns().add(column("Last Name", Person::lastNameProperty));
        table.getColumns().add(column("Email", Person::emailProperty));

        ObservableSet<TableColumn<?,?>> highlightColumns = FXCollections.observableSet();

        table.getItems().addAll(createData());

        VBox checkBoxes = new VBox(5);
        checkBoxes.getStyleClass().add("controls");
        table.getColumns().forEach(col -> 
            checkBoxes.getChildren().add(createHighlightColumnCheckBox(col, highlightColumns)));

        table.getColumns().forEach(col -> highlightColumnWhenNeeded(col, highlightColumns));

        BorderPane root = new BorderPane(table);
        root.setTop(checkBoxes);

        Scene scene = new Scene(root, 800, 600);
        scene.getStylesheets().add("style.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private <S,T> CheckBox createHighlightColumnCheckBox(TableColumn<S,T> column, ObservableSet<TableColumn<?,?>> highlightColumns) {


        CheckBox checkBox = new CheckBox();
        checkBox.textProperty().bind(column.textProperty());
        checkBox.selectedProperty().addListener((obs, wasSelected, isNowSelected) -> {
            if (isNowSelected) {
                highlightColumns.add(column);
            } else {
                highlightColumns.remove(column);
            }
        });

        return checkBox ;
    }

    private <S,T> void highlightColumnWhenNeeded(TableColumn<S,T> column, ObservableSet<TableColumn<?,?>> highlightColumns) {

        Callback<TableColumn<S,T>, TableCell<S,T>> currentCellFactory = column.getCellFactory() ;

        PseudoClass highlight = PseudoClass.getPseudoClass("highlight");

        column.setCellFactory(tc -> {
            TableCell<S,T> cell = currentCellFactory.call(tc);
            highlightColumns.addListener((Change<? extends TableColumn<?,?>> c) -> 
                    cell.pseudoClassStateChanged(highlight,
                        highlightColumns.contains(column)));

            cell.pseudoClassStateChanged(highlight, highlightColumns.contains(column));

            return cell ;
        });
    }

    private static <S,T> TableColumn<S,T> column(String text, Function<S, ObservableValue<T>> property) {
        TableColumn<S,T> col = new TableColumn<>(text);
        col.setCellValueFactory(cellData -> property.apply(cellData.getValue()));
        return col ;
    }

    private List<Person> createData() {
        return Arrays.asList(
                new Person("Jacob", "Smith", "jacob.smith@example.com"),
                new Person("Isabella", "Johnson", "isabella.johnson@example.com"),
                new Person("Ethan", "Williams", "ethan.williams@example.com"),
                new Person("Emma", "Jones", "emma.jones@example.com"),
                new Person("Michael", "Brown", "michael.brown@example.com")     
        );
    }

    public static class Person {
        private final StringProperty firstName = new SimpleStringProperty();
        private final StringProperty lastName = new SimpleStringProperty();
        private final StringProperty email = new SimpleStringProperty();


        public Person(String firstName, String lastName, String email) {
            setFirstName(firstName);
            setLastName(lastName);
            setEmail(email);
        }


        public final StringProperty firstNameProperty() {
            return this.firstName;
        }



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



        public final void setFirstName(final String firstName) {
            this.firstNameProperty().set(firstName);
        }



        public final StringProperty lastNameProperty() {
            return this.lastName;
        }



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



        public final void setLastName(final String lastName) {
            this.lastNameProperty().set(lastName);
        }



        public final StringProperty emailProperty() {
            return this.email;
        }



        public final String getEmail() {
            return this.emailProperty().get();
        }



        public final void setEmail(final String email) {
            this.emailProperty().set(email);
        }



    }

    public static void main(String[] args) {
        launch(args);
    }
}

还有样式表:

.table-cell:highlight {
    -fx-background-color: -fx-background ;
    -fx-background: yellow ;
    -fx-border-color: -fx-table-cell-border-color -fx-table-cell-border-color transparent transparent ;
}
.controls {
    -fx-padding: 10 ;
}

如果它所在的列被突出显示，我只是将整个单元格设为亮黄色，但是您可以修改样式表以使用您喜欢的任何样式来突出显示。