Question

如何在TableView中为选择设置z-index。某些行是条件格式化的，格式化覆盖了Selection。 Screenshot of what I mean。看看最后一行！

这是我的RowFactory：

public void createRowFactory(){
    final String CSS_OUTOFSTOCK = "outofstock";

    mainTableView.setRowFactory(row -> {
        return new TableRow<Artikel>(){
            @Override
            protected void updateItem(Artikel article, boolean empty){
                super.updateItem(article, empty);
                getStyleClass().removeAll(CSS_OUTOFSTOCK);
                if(article != null){
                    if(article.mengeLagerProperty().get() == 0){
                        getStyleClass().add(CSS_OUTOFSTOCK);
                    }
                }
            }
        };
    });
}

这就是我的CSS

.outofstock{
    -fx-background-color: rgba(255, 159, 160, .4);
}

Answer 1

以下是来自modena的默认CSS如何用于表行和表格单元格：

表格行的背景颜色设置为嵌套背景，具体取决于两种查找颜色：

.table-row-cell {
    -fx-background-color: -fx-table-cell-border-color, -fx-background;
}

插图设置为

.table-row-cell {
    -fx-background-insets: 0, 0 0 1 0;
}

所以这样做的效果是在底部使用-fx-table-cell-border-color有一个1像素的边框，而行的其余部分用-fx-background着色。

-fx-background本身定义为

.table-row-cell {
    -fx-background: -fx-control-inner-background;
}

并使用

覆盖奇数行

.table-row-cell:odd {
    -fx-background: -fx-control-inner-background-alt;
}

给出条纹效果。

单个单元格没有背景颜色（因此行的背景颜色可见），但它们在每个单元格的右侧定义了1像素边框

.table-cell {
    -fx-background-color: null;
    -fx-border-color: transparent -fx-table-cell-border-color transparent transparent;
}

选择行时，将修改查找颜色-fx-background以获取不同查找颜色的值（默认情况下基本上为亮蓝色）。类似地，单元格的边框颜色被修改为该颜色的较浅版本：

.table-row-cell:filled:selected {
    -fx-background: -fx-selection-bar;
    -fx-table-cell-border-color: derive(-fx-selection-bar, 20%);
}

由于您只是直接更改表格行的背景颜色，因此会丢失＆＃34;嵌套背景＆＃34; （即行底部的边框）。单个单元格仍然绘制边框，这些边框可以是灰白色（如果未选中行），也可以是蓝色（如果选择了行）。

因此，您可能希望重新定义CSS类的每个关键查找颜色，以继承所有基本功能（选择，边框等）。例如：

.outofstock {
    -fx-control-inner-background: rgba(255, 159, 160, .4);
    -fx-selection-bar: rgba(255, 79, 80, .4);
}

如果您愿意，也可以重新定义-fx-table-cell-border-color，但默认设置是非常中立的：#ececec。

Answer 2

尽管读了1000x，但我并不理解接受的答案。它过于复杂，无法提供确切的css来实现这一点。 -fx-control-inner-background在定义自定义单元工厂时不会设置单元格的背景颜色。

这是我找到的简单的CSS。

.table-row-cell:selected .outofstock {
  -fx-background-color: -fx-accent;
  -fx-border-color: -fx-accent;
}

-fx-accent在.root中定义（checkout javafx caspian.css）。它是定义表格行选择的颜色。

JavaFx中的TableView选择是否有z-index

2 个答案: