Chapter 9 ■ JavaFX 9 User InterFaCe DesIgn: the Front enD For Java 9 game DesIgn
All of this will involve adding new Java statements to both your .createBoardGameNodes() method
and your .addNodesToSceneGraph() method to put the ImageView background image plate and TextFlow
information text overlay into place, behind your VBox Button Control bank. You will also be adding two new
Java methods into the JavaFXGame class to load the Image assets (the loadImageAssets() method) and to
create your Text assets (the createTextAssets() method). You have a lot of coding, recoding, rewiring (object
referencing changes), and parameter adjustments to do to get your user interface a lot more organized and
professional, and we’ll get started on that after we look at some of the JavaFX API classes that we will be
leveraging over the course of this chapter on user interfaces.
UI Design Foundation: Finishing the Scene Graph
One of the first things that you are going to do in this chapter is to finish up your Scene Graph design for the
top-level user interface screens. This means instantiating your ImageView digital image display backplane,
which will hold your background Image objects that will reference your digital image assets. You will be
referencing these digital image assets during this chapter that were created using GIMP 2.10. On top of the
ImageView in the Scene Graph hierarchy, you will be adding a TextFlow information container; therefore,
your text content will be on top of the background image and not underneath it. Finally, on top of these
two leaf Node objects will be the VBox Button Control branch Node object, which you already created and
implemented during Chapter 8. Figure 9-1 shows the final Scene Graph hierarchy (expanding on the generic
root, branch, and leaf Scene Graph diagram that you saw in Chapter 7 in Figure 7-3). This time, I have
customized it for your pro Java 9 game application. Notice there are no connectors on the i3D Group branch
Node leaf Node objects, as we have not yet implemented them in the Java code.
This will require you to add two more leaf Nodes to your StackPane layout container Parent branch
Node, as shown on the lower left in Figure 9-1. Before we get into the Java coding to instantiate these two leaf
Node objects in the .createBoardGameNodes() method and to add them in your Scene Graph hierarchy, let’s
get an overview of each of the classes that you’ll be using in the new Java statements that you will be putting
into place during this chapter.
Figure 9-1. BoardGame user interface design Scene Graph hierarchy, showing the root, branch, and leaf Node
objects