Hello Today after long days I’ve came here to share my experience of FXML in JavaFX. After working with FXML I found it’s really easy for every developer.
Requirements:
- XML knowledge
- CSS knowledge
FXML and Binding Stuff
Ok First lets start with a FXML Template.
|
|
<?import java.lang.*?> <?import javafx.scene.*?> <?import javafx.scene.control.*?> <?import javafx.scene.layout.*?> <?import javafx.scene.shape.*?> <?import fxmlstuff.fxml.*?> <GUITemplate id="main" prefHeight="200" prefWidth="320" xmlns:fx="http://javafx.com/fxml" fx:controller="fxmlstuff.fxml.GUITemplate"> <children> <Rectangle fx:id="back" /> <Rectangle fx:id="front" /> <Button fx:id="button" text="Click Me" onAction="#handleButton"/> <Button fx:id="clear" text="Clear Me" onAction="#handleClearButton"/> <TextArea fx:id="textArea"/> </children> </GUITemplate> |
In above FXML I’ve not added Rectangle,Button,TextArea controls.
As per the FXML specification you can call the function from the FXML attribute using ‘#’ just before the function name. Here I’ve added #handleButton() and #handleClearButton() functions to handle the event of Buttons. Here First we are going to load them in JavaFX Application moreover we are going to make the Rectangle flexible to the Stage‘s width and height. To make any shapes or controls width and height relative to the Stage‘s width, height we can use bind feature plus a the control or the shape which we are going to make bind must static. Ok now we are going to need one Controller for the FXML which helps to control the FXML GUI components. I’ve already added fx:controller = "fxmlstuff.fxml.GUITemplate" in above FXML. So to map the controller we ought to make one conroller class inside fxmlstuff.fxml package with classname GUITemplate.java
Read More »JavaFX has FXML as Flexible XML
