How can I style a JavaFX SplitMenuButton in CSS

I try to style a SplitMenuButton in JavaFX. I‘ve got a menuButton and a SplitMenuButton in my fxml-file.

My CSS-File looks like this:

.menu-button {
    -fx-background-color: red;
    }

.split-menu-button .label {
    -fx-background-color: green;
    }

.split-menu-button .arrow {
    -fx-background-color: yellow;
    }

But I can‘t figure out how to style the area around the arrow for the SplitMenuButton. I tried several ways, but nothing worked

.split-menu-button .menu-button {
    -fx-background-color: blue;
    }

.split-menu-button .menu-button .label {
    -fx-background-color: blue;
    }

.split-menu-button .menu{
    -fx-background-color: blue;
    }

.split-menu-button .menu-item {
    -fx-background-color: blue;
    }

.split-menu-button .button {
    -fx-background-color: blue;
    }

.split-menu-button .menu-bar {
    -fx-background-color: blue;
    }
share|improve this question
 

1 Answer

up vote 2 down vote accepted

There are two useful techniques for figuring out the style classes for individual parts of complex components like this:

  1. Extract the default style sheet, modena.css, from the jfxrt.jar file and see how the default styles are defined (you can also find modena.css online)
  2. Use ScenicView to inspect your application when it‘s running

In this case I used ScenicView; the css you need is

.split-menu-button .arrow-button {
    -fx-background-color: yellow ;
}

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。