CODEWITHSUNDEEP
csscolorsjavafxdialogtitle
Tom
Tom

Reputation: 153

JavaFX How to change color of dialog/window title?

since yesterday, i'm trying to change the color of my dialog title (or maybe all title colors of my application) to get a black or dark color, because it's white color and not readable with grey background.

I still think it should work with css but i can't really find the specific entry for the title color.

I tried something like this in dialog.css but did not work, so commented out:

/*
.root {     
-fx-text-base-color: blue;
-fx-text-background-color: green;
-fx-text-inner-color: red;
-fx-selection-bar-text: yellow;
}
*/

Here my Dialog class:

package de.test.dialog;

import java.io.IOException;

import javafx.event.EventHandler;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.stage.Stage;
import javafx.stage.WindowEvent;


public class Dialog extends Stage {

public static final String OK_DIALOG = "OK";

private final String OK_XML = "/fxml/dialog_ok.fxml";


public enum DIALOG_ACTION {
    BUTTON_1, BUTTON_2, BUTTON_3, NOTHING, CLOSE_WINDOW
}

private DialogController controller = null;
private String message = null;


public Dialog(String name, String ... buttonName) {     
    String resource = getFXMLResource(name);
    if (resource != null) {
        try {
            FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource(resource));
            Parent root = (Parent) fxmlLoader.load();
            controller = fxmlLoader.getController();
            controller.setButtons(buttonName);
            setScene(new Scene(root));
        }
        catch (IOException e) {
            e.printStackTrace();
        }
    }

    setOnCloseRequest(new EventHandler<WindowEvent>() {
        @Override
        public void handle(WindowEvent event) {
            System.out.println("Closing?");             
        }
    });
}

private String getFXMLResource(String name) {
    String fxmlResource = null;

    switch(name) {
        case OK_DIALOG:
            fxmlResource = OK_XML;
            break;
        default:
            break;
    }

    return fxmlResource;
}

public Dialog.DIALOG_ACTION getAction() {
    if (controller != null) {
        return controller.getAction();
    }
    else {
        return DIALOG_ACTION.NOTHING;
    }
}

public void setMessage(String sMessage) {
    this.message = sMessage;
    if (controller != null) {
        controller.setMessage(message);
    }
}

public void setIcon(Image image) {      
    if (controller != null) {
        controller.setIcon(image);
    }       
}
}

Dialog fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.image.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="176.0" prefWidth="400.0" stylesheets="@styles/dialog.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="de.test.dialog.DialogController">
   <children>
  <ImageView fx:id="imgIcon" fitHeight="48.0" fitWidth="48.0" layoutX="8.0" layoutY="25.0" pickOnBounds="true" preserveRatio="true" AnchorPane.leftAnchor="15.0" AnchorPane.topAnchor="25.0">
     <image>
        <Image url="@../icons/dialog/48a.png" />
     </image>
  </ImageView>
  <Text fx:id="txtMessage" layoutX="85.0" layoutY="45.0" strokeType="OUTSIDE" strokeWidth="0.0" text="TEST" wrappingWidth="300.00" AnchorPane.leftAnchor="94.0" AnchorPane.rightAnchor="15.0" AnchorPane.topAnchor="25.0">
     <font>
        <Font size="14.0" />
     </font>
  </Text>
  <Button fx:id="btn1" defaultButton="true" layoutX="295.0" layoutY="134.0" mnemonicParsing="false" onAction="#doAction" prefHeight="25.0" prefWidth="90.0" text="OK" AnchorPane.rightAnchor="15.0">
     <font>
        <Font size="14.0" />
     </font>
  </Button>
  <Button fx:id="btn2" cancelButton="true" layoutX="180.0" layoutY="134.0" mnemonicParsing="false" onAction="#doAction" prefHeight="25.0" prefWidth="90.0" text="Abbrechen" visible="false" AnchorPane.rightAnchor="120.0">
     <font>
        <Font size="14.0" />
     </font>
  </Button>
  <Button fx:id="btn3" layoutX="102.0" layoutY="134.0" mnemonicParsing="false" onAction="#doAction" prefHeight="25.0" prefWidth="90.0" text="Button 3" visible="false" AnchorPane.rightAnchor="225.0">
     <font>
        <Font size="14.0" />
     </font>
  </Button>
   </children>
</AnchorPane>

Calling my dialog:

    Dialog dialog = new Dialog(Dialog.OK_DIALOG, "Löschen", "Abbrechen");
    dialog.initModality(Modality.APPLICATION_MODAL);
    dialog.initOwner(((Node)e.getSource()).getScene().getWindow());
    dialog.setResizable(false);
    dialog.setTitle("Dateianhang löschen");     
    dialog.setMessage("Wollen Sie die ausgewählte(n) Datei(en) wirklich löschen?");

    // Get the Stage.
    //Stage stage = (Stage) dialog.getScene().getWindow();
    // Add a custom icon.
    //stage.getIcons().add(new Image("/icons/dialog/48a.png"));

    dialog.showAndWait();

As you can see, i tried to change the title icon (commented out), and that worked. But no chance to change the color of the title.

If i try google whith e.g. javafx, i can see a lot of images with black title colors. So it must be possible to change the color, but i don't know how.

Any suggestions?

Greetings, Tom

Upvotes: 3

Views: 11442

Answers (1)

Jurgen
Jurgen

Reputation: 2154

I stand to be corrected but I don't think you can set the color of the NATIVE title bar. I think what you are seeing in the google results are custom (user) made title bars.

Maybe this link is useful to you: https://arnaudnouard.wordpress.com/2013/02/02/undecorator-add-a-better-look-to-your-javafx-stages-part-i/

You can also have a look at the FXControls Dialogs source code and see how they have done it: http://fxexperience.com/controlsfx/features/dialogs/

Upvotes: 3

Related Questions