JavaFX Fxml Examples

A simple JavaFX tutorial through simple snippets.

Example 1: Fxml

Here are the code:

Step 1: Create Project

1. Open your favorite Java IDE.
2. In the menu go to File --> Create New Project.

Step 2: Dependencies

No dependencies are needed for this project.

Step 3: Write Code

Our code will comprise the following java files:

• FXMLExample.java
• MyFxmlController.java

1. In your editor or IDE, create a file known as FXMLExample.java.
2. Then add the following code:

(a). FXMLExample.java

First, go ahead and add the following imports:

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.media.Media;
import javafx.stage.Stage;

First, go ahead and add the following imports:

import java.io.File;
import java.net.URL;

We will need to extend our class using the extend keyword. By doing that our class can make use of inheritance to derive properties and functions defined in the parent class.

public class FXMLExample extends Application{

Our class will have the following methods:

• void main(String[] args)
• void start(Stage primaryStage) throws Exception

Every Java Program must have a main method. This is the entry point of all Java applications include JavaFX. Add a main() method and inside it invoke the launch() function.

    public static void main(String[] args) {

In this particular class we will be overriding our void start(Stage primaryStage) throws Exception method.
Prepend the code>@Override</code modifier to your method. Then add implementation code as follows:

    @Override
    public void start(Stage primaryStage) throws Exception {
        FXMLLoader loader = new FXMLLoader();

        MyFxmlController controller = new MyFxmlController();
        controller.setValue("New value");
        loader.setController(controller);

        File fxmlFile = new File("assets/fxml/hello-world.fxml");
        URL fxmlUrl = fxmlFile.toURI().toURL();
        loader.setLocation(fxmlUrl);

        VBox vbox = loader.<VBox>load();

        MyFxmlController controllerRef = loader.getController();
        System.out.println(controllerRef.getValue());
        System.out.println(controllerRef.getLabel1Text());
        System.out.println(controllerRef.getLabel2Text());

        Scene scene = new Scene(vbox);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

Here is the full code:

package com.jenkov.javafx.fxml;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.media.Media;
import javafx.stage.Stage;

import java.io.File;
import java.net.URL;

public class FXMLExample extends Application{

    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) throws Exception {
        FXMLLoader loader = new FXMLLoader();

        MyFxmlController controller = new MyFxmlController();
        controller.setValue("New value");
        loader.setController(controller);

        File fxmlFile = new File("assets/fxml/hello-world.fxml");
        URL fxmlUrl = fxmlFile.toURI().toURL();
        loader.setLocation(fxmlUrl);

        VBox vbox = loader.<VBox>load();

        MyFxmlController controllerRef = loader.getController();
        System.out.println(controllerRef.getValue());
        System.out.println(controllerRef.getLabel1Text());
        System.out.println(controllerRef.getLabel2Text());

        Scene scene = new Scene(vbox);
        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

1. Next create another file known as MyFxmlController.java.
2. And add the following code:

(b). MyFxmlController.java

First, go ahead and add the following imports:

import javafx.event.Event;
import javafx.fxml.FXML;
import javafx.scene.control.Label;

We will need to create class using the class keyword as shown below.

public class MyFxmlController {

Our class will have the following methods:

• String getValue()
• void setValue(String value)
• void initialize()
• String getLabel1Text()
• String getLabel2Text()
• void buttonClicked(Event e)

Here is the full code:

package com.jenkov.javafx.fxml;

import javafx.event.Event;
import javafx.fxml.FXML;
import javafx.scene.control.Label;

public class MyFxmlController {

    private String value = "Default value";

    public Label label1 = null;
    public Label label2 = null;

    public String getValue() {
        return value;
    }

    public void setValue(String value) {
        this.value = value;
    }

    public void initialize() {
        System.out.println("Initialized MyFxmlController");
    }

    public String getLabel1Text() {
        return this.label1.getText();
    }

    public String getLabel2Text() {
        return this.label2.getText();
    }

    @FXML
    public void buttonClicked(Event e){
        System.out.println("Button clicked");
    }
}

Download

Download the code using the below links: