Introduction to FXML

When we were talking about Scenegraph, we saw how conveniently UI is represented by a tree graph structure. What else is good to describe tree structures? XML!

That is what FXML is all about. It allows us to describe the UI by the XML files. It's a common approach to describing static UI pages. For example, XAML for C#, or Android GUI, uses a similar approach.

Basics of FXML

In FXML, each XML node corresponds to a JavaFX entity:

• Adding a tag to the FXML file is similar to calling a constructor for a corresponding class.
• XML attributes correspond to the constructor parameters or setter method calls.
• For Parent classes, the inner nodes correspond to the children nodes, building hierarchy on the fly.
• For other classes, the inner nodes correspond to any entities these classes may contain. For example, you can populate FXCollection through FXML.

Let's compare an application and the FXML that describes it. Here is the application:

The FXML that describes it is as follows:

<?xml version...