[JAVA][Beginning Java 8 Games Development]

Chapter 5 ■ An Introduction to Game Design: Concepts, Multimedia, and Using Scene Builder
Next, let’s take a look at FXML markup language specifically, at an in-depth level. After that, you will examine an
actual FXML UI definition structure, and you will see exactly how the current JavaFX application’s UI design would be
structured using an FXML UI definition construct. As you will see, FXML makes UI design a lot easier!
FXML Definition: Anatomy of an XML UI Definition Construct
The FXML structure is based on the JavaFX classes (objects), and their attributes, that the FXML tags, and parameters
structures, which you can easily create, allow you to “mock up” a front-end UI more easily, using a mark-up language.
The FXML structure lets you more easily construct your Scene Graph hierarchy, and the FXML tags and their
parameters, which you will be looking at in the next section, match up 1:1 with the JavaFX API classes.
Once you create your UI design, the Java programmers can use javafx.fxml classes and methods to inflate
your UI layout container and UI control arrangement into a JavaFX scene and Scene Graph structure, based on Java
objects. Then, the UI design can be used in the application Java code. As mentioned earlier, FXML is most useful for
designing complex, static (fixed) UI design layouts containing lots of buttons, forms, check boxes and the like.
Hello World UI FXML Definition: Replicating Your Current UI Design,
Using FXML
The first thing that you define in the FXML structure is the FXML processing instructions. Each processing
instruction starts with a less-than sign, question mark sequence (]). The first processing instruction is a declaration of the XML language
use, its version (1.0), and the text character set language-encoding format that you want to use (in this case,
UTF-8 [universal character set transformation format, 8 bit]). Because it is 8 bit, there are 256 characters in this
international character set, which was designed to span the many languages based on Germanic characters, that is,
languages that use an A to Z alphabet (including accented characters).
Following the declaration of an XML language and a character set are processing instructions. These import
the Java language, utilities, and javafx.scene package as well as the javafx.scene.layout and javafx.scene.control
packages, which are used to design the UI layout and the UI controls that the layout contains.
For example, the StackPane UI layout container that you are using in the current application is in the javafx.
scene.layout package, and the button UI control element is in the javafx.scene.control package. Because the
FXML UI layout container is the parent element in this structure, it goes first, or outside the nested
FXML UI definition structure that you are about to create.
Inside the , you will nest children of the StackPane class (object), using the tags
( XML tags are coded using ). Nested inside these tags are the UI control elements
(in this case, a button control, so you would use the tag). Note that the class (object) proper name is used
inside the arrowhead brackets to create the FXML tag, so this is very logical and should be quite easy to learn and
assimilate into your UI design work process:
www.it-ebooks.info
121