Alexander
Alexander

Reputation: 342

Java FX Color of Label is forgotten

I've observed the following problem in simple JavaFX project. In NetBeans I've create simple FXML project. It contains the FXML file

<AnchorPane id="AnchorPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="800.0" prefWidth="1280.0" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sensordemo.MainController">
    <children>
      <VBox blendMode="COLOR_DODGE" layoutX="14.0" layoutY="12.0" prefHeight="453.0" prefWidth="169.0">
         <children>
            <VBox prefHeight="147.0" prefWidth="109.0">
               <children>
                  <Label text="XXXXX" textFill="#8c5123">
                     <font>
                        <Font name="Arial Bold Italic" size="18.0" />
                     </font>
                  </Label>
               </children>
            </VBox>
            <VBox prefHeight="134.0" prefWidth="83.0">
               <children>
                  <Label text="YYYYY" textFill="#23288d">
                     <font>
                        <Font name="Arial Bold Italic" size="18.0" />
                     </font></Label>
               </children>
            </VBox>
            <VBox prefHeight="167.0" prefWidth="83.0">
               <children>
                  <Label text="ZZZZZ" textFill="#23288d">
                     <font>
                        <Font name="Arial Bold Italic" size="18.0" />
                     </font>
                  </Label>
               </children>
            </VBox>
         </children>
      </VBox>

    </children>
</AnchorPane>

The color of label correctly is correctly displayed in FX Scene Builder, but if I use preview feature of Scene Builder is see wrong color of label. I see white font on gray backend. In case I create the build of this simple project I see the same wrong colors. What is the reason of this issue? Seems to me the correct definition of colors is not included in build. I use

  1. Netbeans 8.1
  2. Java SDK 8 64-bits.
  3. Windows 7 64-bits

Thank you in advance

Upvotes: 1

Views: 3197

Answers (2)

fabian
fabian

Reputation: 82461

I'm afraid somehow SceneBuilder got the effect wrong.

You're using the BlendMode.COLOR_DODGE.

From the javadoc:

The bottom input color components are divided by the inverse of the top input color components to produce the resulting color.

So given the background color component B and the text color component T the component of the output P is calculated as

P = min(B / (1 - T), 1)

(Components in range [0, 1] here)

None of the color components of the colors you use for the Label text color is darker than 0.13, so B / (1 - T) >= B / 0.87 which means any background color with components (0.87, 0.87, 0.87) or brighter will display as white color. This is the case for the default background in a JavaFX scene. So white is the expected color.

Maybe you should to use a different blendMode or change the AnchorPane background to something darker to see the colors of the text:

<AnchorPane style="-fx-background-color: #888;" ...

My guess is that you do not need a blendMode different to the default (SRC_OVER), but just need to adjust the background of the AnchorPane:

<AnchorPane style="-fx-background-color: white;" id="AnchorPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="800.0" prefWidth="1280.0" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1">
    <children>
      <VBox layoutX="14.0" layoutY="12.0" prefHeight="453.0" prefWidth="169.0">
         ...
      </VBox>
    </children>
</AnchorPane>

Upvotes: 2

GOXR3PLUS
GOXR3PLUS

Reputation: 7255

Some ways to get the expected result is:

~>1) If you will keep that style this is recommended

In the SceneViewer manually add the background color of each VBox or Label using inline css:

-fx-background-color:white; 

~>2) Best practice

Add a StyleClass on each VBox or Label through SceneViewer and use an external css file for your application:

   .styleClassName { 

        -fx-background-color:white; 

     }

~>3)

You can add a unique id for each VBox or Label you have and modify their style into the Java code using:

elementID.setStyle(" -fx-background-color:white; ");

Mention that: The default background color of most JavaFX layouts is like gray so you have to change it.

Upvotes: 1

Related Questions