如何将 TableCell 样式类绑定到 TableRow 样式类（JavaFX）答案

【问题标题】：How do I bind the TableCell style classes to the TableRow style classes (JavaFX)如何将 TableCell 样式类绑定到 TableRow 样式类（JavaFX）
【发布时间】：2018-07-26 15:16:30
【问题描述】：

我正在为我的 JavaFX 应用程序创建一个系统日志窗口。我认为显示日志和能够对过滤器等进行排序的最简单方法是使用 TableView。

日志消息有四种类型，由枚举（LogType）分类：

成功、信息、警告、错误。

如果类型为 ERROR，我想使用 CSS 类 .redText 将整个 TableRow 的文本更改为红色

我使用 RowFactory 做到了这一点。这里是声明变量：

@FXML
TableView<LogMessage> table;
@FXML
TableColumn<LogMessage, String> timeColumn;
@FXML
TableColumn<LogMessage, LogMessage.LogType> typeColumn;
@FXML
TableColumn<LogMessage, String> msgColumn;

这里是 setRowFactory()。它位于我的控制器类的 initialize() 方法中。

        //Change text color based on success/failure
        table.setRowFactory(new Callback<TableView<LogMessage>, TableRow<LogMessage>>() {

            @Override
            public TableRow<LogMessage> call(TableView<LogMessage> param) {
                TableRow<LogMessage> tableRow = new TableRow<LogMessage>() {

                    @Override
                    protected void updateItem(LogMessage item, boolean empty) {
                        super.updateItem(item, empty);
                        this.getStyleClass().remove("redText");
                        if (item != null && !empty) {
                            if(item.isError()) {
                                this.getStyleClass().add("redText");
                            }
                        }
                    }

                };

                return tableRow;
            }
        });

这可行，但我遇到了一些日志消息对于我的固定大小表来说太长的问题，因此用户必须水平滚动。

我宁愿它换成多行。所以我在msgColumn 上添加了一个自定义单元工厂，使用我在 StackOverflow 上找到的一些代码，如下所示：

//Auto wrap the message column
        msgColumn.setCellFactory(tc -> {
            TableCell<LogMessage, String> cell = new TableCell<>();
            Text text = new Text();
            cell.setGraphic(text);
            cell.setPrefHeight(Control.USE_COMPUTED_SIZE);
            text.wrappingWidthProperty().bind(msgColumn.widthProperty());
            text.textProperty().bind(cell.itemProperty());
            text.styleProperty().bind(cell.styleProperty());
            return cell ;
        });

我添加了text.styleProperty().bind(cell.styleProperty()); 试图让它也复制样式，但没有运气。

我认为消息列的 cellFactory 正在覆盖 TableRow 上的样式。自动换行效果很好，但是 msg 列的默认颜色为黑色，该行中的其余列的默认颜色为红色。

我怎样才能让它同时做到这一点，自动换行和保持风格？

我愿意通过 CSS 或 Java 控制器来实现。

【问题讨论】：

标签： java css user-interface javafx tableview

【解决方案1】：

给Text添加一个（固定的）样式类：

    msgColumn.setCellFactory(tc -> {
        TableCell<LogMessage, String> cell = new TableCell<>();
        Text text = new Text();
        cell.setGraphic(text);
        cell.setPrefHeight(Control.USE_COMPUTED_SIZE);
        text.wrappingWidthProperty().bind(msgColumn.widthProperty());
        text.textProperty().bind(cell.itemProperty());
        text.getStyleClass().add("table-cell-text");
        return cell ;
    });

然后在你的 CSS 中你可以这样做，例如，

.redText .table-cell .table-cell-text {
    -fx-fill: red ;
}

请注意，Text 对象的 CSS 属性是 -fx-fill。如果你使用Label（或者只是想直接设置表格单元格的文本颜色），你会使用-fx-text-fill。

【讨论】：