How to style TabPane dropdown menu in JavaFX

2
votes

I want to style JavaFX TabPane dropdown menu. The menu, which appears when there is too much tabs to fit to screen. I have found this substructure in java documentation.

  • tab-header-area — StackPane
    • headers-region — StackPane
    • tab-header-background — StackPane
    • control-buttons-tab — StackPane
      • tab-down-button — Pane
        • arrow — StackPane
    • tab — Tab
      • tab-label — Label
      • tab-close-button — StackPane
  • tab-content-area — StackPane

But there is nothing about the dropdown menu. So is there any way to style this with css?

2
cssjavafx-8

2 Answers

3
votes

Too late to the party, but this might help someone. You can access the tabs menu using this code:

// Access the tabs menu itself
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button .context-menu {
    // Do something.
}

// Access menu item
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button .context-menu .radio-menu-item {
    // Do something.
}

 // Access menu item's text
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button .context-menu .radio-menu-item .label {
    // Do something.
}

 // Access menu item's check sign
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button .context-menu .radio-menu-item .left-container .radio {
    // Do something.
}
2
votes

You can access the dropmenu with the class .context-menu in the CSS file. For example you can change the background color of the drop-down menu using this code snippet:

.context-menu {
    -fx-background-color: #d0d0d0;
}