JavaFxでの表のデザイン

Question

どのようにjavafxで上記のような表を設計できますか？私はtableviewを使用していくつかのCSSを行っていますが、デザインは好きではありません。

誰がどのように私は上記の設計に

を達成することができますここで私は

.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 */ 
} 

現在の設計テーブル

Answer 1

を試したCSSがある私に言うことができるしてくださいこのfiguのCss再：

.table-view .column-header, 
.table-view .column-header .filler, 
.table-view .column-header-background .filler { 
    -fx-background-color: derive; 
    -fx-stroke: transparent; 
    -fx-size:50; 
    -fx-alignment: CENTER ;  
    -fx-text-alignment: center; 

} 
.table-row-cell:filled:hover { 

    -fx-size:50; 
    -fx-alignment: CENTER; 
    -fx-text-alignment: center; 


} 
.table-view:row-selection { 
    -fx-background-color: transparent; 
    -fx-text-fill: white; 
    -fx-fixed-cell-size: 50; 
    -fx-alignment: CENTER; 
    -fx-text-alignment: center; 

} 

.table-view .table-column{ 
    -fx-text-alignment: center; 
    -fx-alignment: CENTER 

}