浮動TabPane的樣式不會出現

嘗試通過添加CSS文件來自定義浮動TabPane，就像下面的示例中一樣。新樣式不會僅顯示浮動Tabpane - 對於常規窗格，樣式按預期顯示。浮動TabPane的樣式不會出現

public class FloatingTabPaneTest extends Application 
{ 
    public static void main(String[] args) 
    { 
    Application.launch(args); 
    } 

    @Override 
    public void start(Stage stage) 
    { 
    Parent root = createContentPane(); 
    root.getStylesheets().add(getClass().getResource("/floatingTabPane.css").toExternalForm());   
    Scene scene = new Scene(root, 1000, 800);  
    stage.setScene(scene); 

    stage.setTitle(getClass().getSimpleName()); 
    stage.show(); 
    } 

    private Parent createContentPane() 
    { 
    TabPane tabPane = new TabPane(); 
    tabPane.getStyleClass().add(TabPane.STYLE_CLASS_FLOATING); 

    addTab(tabPane, "Tab 1", new StackPane()); 
    addTab(tabPane, "Tab 2", new StackPane()); 
    addTab(tabPane, "Tab 3", new StackPane()); 
    tabPane.getSelectionModel().selectLast(); 

    return new BorderPane(tabPane); 
    } 

    private void addTab(TabPane tabPane, String name, Node content) 
    { 
    Tab tab = new Tab(); 
    tab.setText(name); 
    tab.setContent(content); 
    tabPane.getTabs().add(tab);  
    } 
}

FloatingTabPane.css：

.tab-pane.floating > .tab-header-area > .tab-header-background { 
    -fx-border-color: red; 
    -fx-border-width: 2; 
    -fx-background-color: cyan; 
}

來源

2015-10-23 wzberger

這是非常有趣的。問題是因爲headerBackground可見性設置爲false，如果您在FLOATING樣式類。

如果裏面TabPaneSkin搜索，你會發現：

if (isFloatingStyleClass()) { 
    headerBackground.setVisible(false); // <---- Imp part 
} else { 
    headerBackground.resize(snapSize(getWidth()), snapSize(getHeight())); 
    headerBackground.setVisible(true); 
}

由於其可見性設置爲false，你最好的拍攝是做對tab-header-area的更改，而不是tab-header-background

.tab-pane.floating > .tab-header-area { 
    -fx-border-color: red; 
    -fx-border-width: 2; 
    -fx-background-color: cyan; 
}

這會在選項卡上留下細紅線，但這比根本沒有樣式更好;）

來源

2015-10-23 12:44:49 ItachiUchiha

浮動TabPane的樣式不會出現

回答

相關問題