在CSS中设置TableView样式(JavaFX)

时间:2015-11-26 12:31:08

标签: java css javafx tableview styling

我如何设计" THIS"指向我的TableView?

TableView

我的CSS代码如下:

   */*
 * Empty Stylesheet file.
 */

.root{
    -fx-background-color: #262626;
}

.table-view{
   -fx-background-color: transparent;
}

.table-view:focused{
    -fx-background-color: transparent;
}

/* Spaltenköpfe
    Struktur column-header-background -> column-header */

.table-view .column-header-background{
    -fx-background-color: linear-gradient(#131313 0%, #424141 100%);
}

.table-view .column-header-background .label{
    -fx-background-color: transparent;
    -fx-text-fill: white;
}

.table-view .column-header {
    -fx-background-color: transparent;
}

.table-view .table-cell{
    -fx-text-fill: white;
}

.table-row-cell{
    -fx-background-color: -fx-table-cell-border-color, #616161;
    -fx-background-insets: 0, 0 0 1 0;
    -fx-padding: 0.0em; /* 0 */
}

.table-row-cell:odd{
    -fx-background-color: -fx-table-cell-border-color, #424242;
    -fx-background-insets: 0, 0 0 1 0;
    -fx-padding: 0.0em; /* 0 */  
}

.table-row-cell:selected {
    -fx-background-color: #005797;
    -fx-background-insets: 0;
    -fx-background-radius: 1;
}

.table-view > .virtual-flow > .scroll-bar:vertical,
.table-view > .virtual-flow > .scroll-bar:vertical > .track,
.table-view > .virtual-flow > .scroll-bar:vertical > .track-background, 
.table-view > .virtual-flow > .scroll-bar:horizontal,
.table-view > .virtual-flow > .scroll-bar:horizontal > .track,
.table-view > .virtual-flow > .scroll-bar:horizontal > .track-background {
    -fx-background-color: transparent;
}



.table-view > .virtual-flow > .scroll-bar > .increment-button, 
.table-view > .virtual-flow > .scroll-bar > .decrement-button {
    -fx-opacity: 0;
}*

所以你可以看到我已经改变了colum-header-background和这样的一切。我也改变了TableView的背景。所以我真的不知道我应该在CSS中改变什么。 谢谢你的帮助! :)

-GhostfaceChilla -

6 个答案:

答案 0 :(得分:22)

.table-view .filler 是您要查找的选择器。 scenic view tool非常适合分析组件。

答案 1 :(得分:0)

.table-view{
   -fx-background-color: transparent;
}

如果TableView中没有记录,背景颜色可以是白色。也许很高兴为占位符设置样式

答案 2 :(得分:0)

万一有人来这里搜索column-show-hide按钮的CSS,这就是CSS。

.table-view .show-hide-columns-button {
    -fx-background-color: red;
    -fx-border-color: -fx-box-border;
    -fx-border-insets: -1 -1 0 0;
}

答案 3 :(得分:0)

我设法通过以下CSS代码解决了这个问题:

.table-view .filler {
    -fx-border-insets: 10 //Enter value depending on thickness;
}

答案 4 :(得分:0)

尝试一下

.table-view .filler{
    -fx-background-color: transparent;
}

答案 5 :(得分:0)

试试这个。

.table-view .column-header-background
{
    -fx-background-color: transparent;
}