JavaFx : Customizing Alert Dialog

Viewed 808

I want to customize the buttons, button container, backgroud color, the AlertType icon as well in an Alert Dialog.

Tried following these two solutions :

  1. Styling default JavaFX Dialogs
  2. Customize JavaFx Alert with css

I suppose the code from CSS that I have mentioned should be applicable to all the Alert dialog-pane ? Not sure what am I missing here.

private static void createSimpleInformationDialog(String message){
    Alert alert = createSimpleInformationAlert(message, AlertType.INFORMATION);
    alert.getDialogPane().setHeaderText(StringTools.isNull(null, ""));
    alert.getDialogPane().setMaxWidth(200);
    alert.getDialogPane().setMinWidth(150);
    alert.getDialogPane().setPadding(new Insets(0, 10, 0, 10));
    alert.showAndWait();
}

private static Alert createSimpleInformationAlert(String message, AlertType type) {
    Alert alert = new Alert(type);
    alert.setTitle(Lang.get(Defs.FX_DIALOGS_EXCEPTIONS_GENERIC_TITLE));
    alert.setContentText(message);
    alert.initModality(Modality.APPLICATION_MODAL);
    alert.initOwner(FXMain.getInstance().getStage());
    return alert;
}

CSS file :

.dialog-pane{
  -fx-border-color:black;
  -fx-border-width:2.0px;
 }

/**Costumization of The Bar where the buttons are located**/
.dialog-pane > .button-bar > .container {
  -fx-background-color:black;
}

.dialog-pane > .content.label {
   -fx-padding: 0.5em 0.5em 0.5em 0.5em;
   -fx-background-color: yellow;
   -fx-text-fill:black;
   -fx-font-size:15.0px;
}

/**Costumization of DialogPane Header**/
.dialog-pane:header .header-panel {
  -fx-background-color: black;
}

.dialog-pane:header .header-panel .label{
  -fx-background-color: yellow;
  -fx-background-radius:10px;
  -fx-text-fill:black;
  -fx-font-size:15.0px;
}


/**Costumization of Buttons**/
.dialog-pane .button{
   -fx-background-color:black;
   -fx-text-fill:white;
   -fx-wrap-text: true;
   -fx-effect: dropshadow( three-pass-box, yellow, 10.0, 0.0, 0.0, 0.0);
   -fx-cursor:hand;
 }

.dialog-pane .button:hover{     
  -fx-background-color:white;
  -fx-text-fill:black;
  -fx-font-weight:bold; 
 }
0 Answers
Related