Chapter 9 ■ JavaFX 9 User InterFaCe DesIgn: the Front enD For Java 9 game DesIgnThe Java code for this statement should look like the following and is shown highlighted in Figure 9-16:infoOverlay.getChildren().addAll(playText, moreText);
As you can see in Figure 9-17, the white text objects look cool, and your image compositing pipeline
looks as if it is being created using professional digital imaging software. Next, let’s add an image
compositing layer for a logo.
This UI design is starting to look more professional, with the Buttons positioned over the outcropping
of the rock and the “Welcome!” text centered in the screen design. However, the UI design still needs a
branding logo, and there is an extra space pushing the third line to the right that needs to be fixed (removed).
Let’s do this in the next section.
Using StackPane: Add More Digital Image Compositing Layers
Let’s add another ImageView object declaration named logoLayer at the top of the JavaFXGame class,
turning the ImageView declaration into an ImageView boardGameBackPlate, logoLayer; compound Java
statement. Open your createBoardGameNodes() method, add an object instantiation for this object, and then
a .setImage() method call wiring this to the alphaLogo Image object you created earlier when you imported
this digital image asset. Next, you will add two method calls off of the logoLayer object, one for X scaling and
one for Y scaling, using the same 80 percent value of 0.8, so that we lock the aspect ratio (also called uniform
scaling) for this scaling operation. Finally, you will move the logo up the y-axis 225 pixels from the center of the
screen, using a -225 value, as StackPane uses a 0,0 center screen referencing model rather than the standard
0,0 upper-left corner pixel referencing model. We will also pull the logo 75 pixels back toward the left using an
Figure 9-17. Run the project and check the result of adding a TextFlow object to the splash screen
compositing pipeline