In ChoiceBox control can not change style associated context-menu.
Attached is a test project.
file : ChoiceBoxTest
public class ChoiceBoxTest extends Application {
private AnchorPane root = new AnchorPane();
@Override
public void start(Stage primaryStage) {
root.setPrefSize(200, 200);
root.setStyle("-fx-background-color:#ffffff;");
ObservableList<?> list = FXCollections.observableArrayList("Orange","Yellow","Green");
ChoiceBox<?> choiceBox = new ChoiceBox<>(list);
choiceBox.setId("my-choice");
choiceBox.getStyleClass().add("my-choice");
choiceBox.getSelectionModel().selectFirst();
choiceBox.setLayoutX(50);
choiceBox.setLayoutY(50);
root.getChildren().add(choiceBox);
Scene scene = new Scene(root);
String cssURL = getClass().getResource("choice-box.css").toExternalForm();
scene.getStylesheets().add(cssURL);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
file: choice-box.css
#my-choice .context-menu {
-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
-fx-font-family:Arial;
-fx-font-size:14px;
-fx-text-fill: #FFFFFF;
-fx-border-width:1 1 1 1;
-fx-border-color:#C4D019;
-fx-border-radius: 5 5 5 5;
}
.menu-item .label {
-fx-text-fill: #FFFFFF;
}
.menu-item:focused {
-fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
}
#my-choice{
-fx-background-color: linear-gradient(to bottom,#5C5C5C, #1C1C1C);
-fx-font: 14px Arial;
-fx-border-width:1 1 1 1;
-fx-border-color:#FFFFFF;
-fx-border-radius: 5 5 5 5;
-fx-padding:0 0 0 10;
}
#my-choice:hover{
-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
-fx-border-color:#C4D019;
}
#my-choice .label {
-fx-text-fill: #FFFFFF;
-fx-font-size: 14px;
-fx-font-family: Arial;
-fx-border-width:0 1 0 0;
-fx-border-color:#898888;
}
#my-choice .open-button{
-fx-padding:11 10 10 10;
-fx-background-radius: 5 5 5 5;
-fx-border-width:0 0 0 1;
-fx-border-color:#222323;
}
#my-choice .open-button:hover{
-fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
}
#my-choice .open-button .arrow{
-fx-background-color: #FFFFFF;
}
#my-choice .context-menu{
-fx-background-color:red;
}
Attached is a test project.
file : ChoiceBoxTest
public class ChoiceBoxTest extends Application {
private AnchorPane root = new AnchorPane();
@Override
public void start(Stage primaryStage) {
root.setPrefSize(200, 200);
root.setStyle("-fx-background-color:#ffffff;");
ObservableList<?> list = FXCollections.observableArrayList("Orange","Yellow","Green");
ChoiceBox<?> choiceBox = new ChoiceBox<>(list);
choiceBox.setId("my-choice");
choiceBox.getStyleClass().add("my-choice");
choiceBox.getSelectionModel().selectFirst();
choiceBox.setLayoutX(50);
choiceBox.setLayoutY(50);
root.getChildren().add(choiceBox);
Scene scene = new Scene(root);
String cssURL = getClass().getResource("choice-box.css").toExternalForm();
scene.getStylesheets().add(cssURL);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
file: choice-box.css
#my-choice .context-menu {
-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
-fx-font-family:Arial;
-fx-font-size:14px;
-fx-text-fill: #FFFFFF;
-fx-border-width:1 1 1 1;
-fx-border-color:#C4D019;
-fx-border-radius: 5 5 5 5;
}
.menu-item .label {
-fx-text-fill: #FFFFFF;
}
.menu-item:focused {
-fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
}
#my-choice{
-fx-background-color: linear-gradient(to bottom,#5C5C5C, #1C1C1C);
-fx-font: 14px Arial;
-fx-border-width:1 1 1 1;
-fx-border-color:#FFFFFF;
-fx-border-radius: 5 5 5 5;
-fx-padding:0 0 0 10;
}
#my-choice:hover{
-fx-background-color: linear-gradient(to bottom,#808080, #2E2E2E);
-fx-border-color:#C4D019;
}
#my-choice .label {
-fx-text-fill: #FFFFFF;
-fx-font-size: 14px;
-fx-font-family: Arial;
-fx-border-width:0 1 0 0;
-fx-border-color:#898888;
}
#my-choice .open-button{
-fx-padding:11 10 10 10;
-fx-background-radius: 5 5 5 5;
-fx-border-width:0 0 0 1;
-fx-border-color:#222323;
}
#my-choice .open-button:hover{
-fx-background-color: linear-gradient(to bottom,#C4D019, #586F25);
}
#my-choice .open-button .arrow{
-fx-background-color: #FFFFFF;
}
#my-choice .context-menu{
-fx-background-color:red;
}
- blocks
-
JDK-8124275 Cannot set background on Popup
- Closed
- relates to
-
JDK-8128396 ContextMenu from Menu outside DOM structure, No access to ContextMenu object created for Menu
- Closed