CODEWITHSUNDEEP
javacssjavafx
user7810882
user7810882

Reputation: 233

Style ChoiceBox list with CSS in JavaFX

list

How do I access this list in css or in code in order to style it. I couldn't figure it out from modena.css.

By using

.choice-box > * {
    -fx-background-color: black;
}

the list is unaffected, so it is some kind of separate control.

Upvotes: 11

Views: 11727

Answers (2)

Zempak1
Zempak1

Reputation: 1

In addition to the answer:

// Selected item mark color
.choice-box .left-container .radio { -fx-background-color: white; }

Upvotes: 0

DVarga
DVarga

Reputation: 21799

The following selectors should do the coloring in the context menu of the ChoiceBox:

// Background color of the whole context menu
.choice-box .context-menu { -fx-background-color: black; }
// Focused item background color in the list
.choice-box .menu-item:focused { -fx-background-color: orange; }
// Text color of non-focused items in the list
.choice-box .menu-item > .label { -fx-text-fill: white; }
// Text color of focused item in the list
.choice-box .menu-item:focused > .label { -fx-text-fill: black; }

If you color the ChoiceBox further:

// Background color of the control itself
.choice-box {
  -fx-background-color: black;
  -fx-mark-color: orange; // arrow color
}

// Selected item text color on the control itself
.choice-box > .label { -fx-text-fill: white; }

The result will be a ChoiceBox like this:

enter image description here

Upvotes: 23

Related Questions