Game Development Reference
In-Depth Information
so you would use the <Button> 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:
<?
xml
version="1.0" encoding="
UTF-8
" ?>
<? import java.lang.* ?>
<? import java.util.* ?>
<? import javafx.scene.* ?>
<? import javafx.scene.layout.* ?>
<? import javafx.scene.control.* ?>
<
StackPane
id="root" prefHeight="250" prefWidth="300"
>
<children>
<
Button
id="btn" text="Say 'Hello World'"
layoutX="125" layoutY="116"
/>
</children>
</StackPane>
Next, let's take a look at the tag and parameter syntax so that you always know how
to construct FXML UI layout and control definition files. A UI element that has no
children, such as the prior <Button> UI control, will use a shorthand tag open-and-
close syntax, using the
<ClassName
opening tag and forward slash, greater-than sign
closing tag (
/>
), like this:
<Button
id="btn" text="Say 'Hello
World'" layoutX="125" layoutY="116"
/>
Note that the
parameters
that configure the tag, which would equate to the attrib-
utes of the object (or the variables in the class that creates the object) are (yet again)
nested
inside the tag itself and use the
variable name
and
equals
operator, along with
the
data value
specified in quotation marks, as shown in the previous code.
A FXML tag that has <children> objects nested inside it will use this different
<ClassName>
opening tag. Following the nested tags listed inside (after) this tag is a
</ClassName>
closing tag. This allows the tag syntax to specify (become) the
con-
tainer
for the <children> tags inside it, as you can see in the example here, in which
the opening and closing FXML tags are ordered according to their nesting (inside) hier-
archy:
