JavaFX: вкладка закругленные углы

Question

Для того, чтобы сделать мои вкладки углы закруглены Я использую следующий код:

.tab { 
    -fx-border-radius: 10 10 0 0; 
    -fx-background-radius: 10 10 0 0; 
} 

.tab:selected .focus-indicator { 
    -fx-border-radius: 10 10 0 0, 10 10 0 0; 
} 

Однако я получаю довольно странное поведение. Когда новая вкладка создается, она имеет некоторые дополнительные углы, которые позже исчезают, когда я изменяю фокус или создаю новую вкладку. Например - создаю первую вкладку.

Теперь я создаю вторую вкладку. Первая вкладка уже нормальная, но вторая имеет эти странные углы.

Я проверил на centos и win7 - поведение такое же. Как это исправить?

EDIT 1
Это все мой файл css. Конечная цель состоит в том, чтобы сделать заголовки вкладок большими с закругленными углами.

.tab:selected .focus-indicator { 
    -fx-border-radius: 10 10 0 0, 10 10 0 0; 
    -fx-border-insets: -7 -7 -9 -8, -5 -5 -9 -6; 
} 

.tab-pane > .tab-header-area > .headers-region > .tab:selected{ 
    -fx-border-insets: 10 10 10 10, 10 10 10 10; 
} 

.tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > 
.tab-label { 
    -fx-alignment: CENTER; 
    -fx-text-fill: -fx-text-base-color; 
    -fx-padding:0 10 0 0; 
} 

.tab-header-area .tab{ 
    -fx-padding:4 10 5 10; 
    -fx-border-radius: 10 10 0 0; 
    -fx-background-radius: 10 10 0 0; 
} 

EDIT 2
Я проверил это на двух разных ПК: 1 (Ubuntu), 2 (Centoc 71 и VM Win7). Я попытался скомпилировать с помощью oracle jdk - результат будет таким же.

Answer 1

Это уже сообщалось ошибка https://javafx-jira.kenai.com/browse/RT-40462

ОБНОВЛЕНИЕ ошибка переместилась в OpenJDK системе распределения:

https://bugs.openjdk.java.net/browse/JDK-8090243

Некоторые из вашего кода является излишним. Так что это должно сработать.

.tab:selected .focus-indicator { 
    -fx-border-radius: 10 10 0 0, 10 10 0 0; 
    -fx-border-insets: -6 -9 -8 -8, -5 -8 -7 -7; 
} 
/* 
.tab-pane > .tab-header-area > .headers-region > .tab:selected{ 
    -fx-border-insets: 0 1 1 0, 1 2 0 1, 2 3 0 2; 
} 
*/ 
.tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > .tab-label { 
    -fx-padding:0 10 0 0; 
} 

.tab-header-area .tab{ 
    -fx-padding:4 10 5 10; 
    -fx-background-radius: 10 10 0 0; 
} 

Это будет выглядеть так:

UPDATE

Но если вы действительно хотите только, чтобы иметь больше радиуса к закругленным углам, это все, что вам нужно до:

.tab-pane > .tab-header-area > .headers-region > .tab { 
    /* if outer border should be 10 radius */ 
    -fx-background-radius: 10 10 0 0, 9 9 0 0, 8 8 0 0; 
} 

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

ОБНОВЛЕНИЕ

Это то, что я получаю от вашего кода. При добавлении вновь созданной вкладки возникает странное поведение. Поэтому я сделал gif, чтобы показать, как работает мышь.

UPDATE

Answer 2

Итак, давайте предположим, что это ошибка, и вы КСС хорошо, единственное решение я вижу сейчас, чтобы удалить и добавить стили по умолчанию после некоторой задержки.Что-то вроде этого:

Tab tab = new Tab("Tab " + (tabs.getTabs().size() + 1)); 
tabs.getTabs().add(tab); 
new Thread(()-> { 
    try { 
     Thread.sleep(50); 
    } catch (InterruptedException e) { 
     e.printStackTrace(); 
    } 
    Platform.runLater(()->{ 
      tabs.getStyleClass().remove("tab-pane"); 
      tabs.getStyleClass().add("tab-pane"); 
    }); 
}).start(); 

Насти хак, чтобы быть честным, но это работает для меня:

Answer 3

Это CornerRadii, это только увеличивает & уменьшает