JavaFX CSS: изменение TabPane Tab форма заголовка

Question

Я пытаюсь изменить форму Tab заголовка в css, но когда я смотрю на css ссылки на JavaFX в here, я не могу найти какие доступные свойства Tab через css. Я хочу иметь форму трапеции вместо прямоугольника. Любая идея, как выполнить эту задачу?

Answer 1

Вы можете проверить по умолчанию modena.css в любом случае:

Tab s имеют класс CSS: .tab-pane > .tab-header-area > .headers-region > .tab

Так, например, добавив следующую строку в файл CSS:

.tab-pane > .tab-header-area > .headers-region > .tab { 
    -fx-background-radius: 20; 
} 

.tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator { 
    -fx-border-radius: 20; 
} 

приведет в следующем порядке:

Для трапеции вам нужно использовать -fx-shape атрибут:

.tab-pane > .tab-header-area > .headers-region > .tab { 
     -fx-shape: "M300,290 L310,168 L410,168 L421,290 L300,290 z"; 
} 

.tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator { 
    -fx-shape: "M300,290 L310,168 L410,168 L421,290 L300,290 z"; 
} 

, что приведет к: