Overview of JavaFX | Java Subject Material

Step 1 of 10

1.1 What is JavaFX?

Learning objective

Define JavaFX and identify the desktop interfaces it can create.

JavaFX is a Java framework used to develop graphical user interface applications. Instead of interacting only through a terminal, users work with windows, forms, controls, and visual feedback.

JavaFX can create

Windows and forms
Labels, buttons, and text fields
Lists and menus
Graphics and charts
Audio and video interfaces

Check your understanding: What kind of application does JavaFX primarily help us build?

Graphical user interface applications.

Step 2 of 10

1.2 Why JavaFX?

Learning objective

Compare console interaction with graphical interaction.

Console-only interaction

System.out.println("Hello");

Console and JavaFX interaction
Console application	JavaFX application
Text appears in a terminal	Content appears inside a window
Input is normally requested in sequence	Users interact with visible controls
Program flow is mostly sequential	Program flow responds to events

JavaFX is useful when an application needs a clear visual interface such as a registration form, dashboard, calculator, or data-entry screen.

Check your understanding: How does a JavaFX application differ from a console application?

It provides graphical controls and event-driven interaction instead of only sequential terminal text.

Step 3 of 10

1.3 Features of JavaFX

Learning objective

Recognize the principal capabilities provided by JavaFX.

Important JavaFX features

Rich controls including Button, Label, TextField, CheckBox, RadioButton, ComboBox, ListView, Slider, and DatePicker
Layout management with HBox, VBox, GridPane, BorderPane, FlowPane, StackPane, and AnchorPane
Event handling for buttons, selections, keys, and the mouse
Graphics, colors, images, animation, and transformations
Audio and video support
A hierarchical scene graph

Check your understanding: Which JavaFX feature automatically arranges controls?

Layout panes such as HBox, VBox, GridPane, and BorderPane.

Step 4 of 10

1.4 AWT vs Swing vs JavaFX

Learning objective

Compare the three major Java desktop GUI toolkits without treating older toolkits as obsolete.

AWT, Swing, and JavaFX compared
Feature	AWT	Swing	JavaFX
Generation	Original Java GUI toolkit	Richer toolkit built after AWT	Modern Java GUI framework
Components	Basic native-peer controls	Large lightweight component set	Controls represented as scene-graph nodes
Styling	Limited	Pluggable look and feel	CSS-based styling
UI model	Component hierarchy	Component hierarchy	Scene graph
Typical use	Legacy/basic applications	Existing desktop applications	Modern teaching and rich desktop interfaces

Check your understanding: Which toolkit in this comparison is based on a scene graph?

JavaFX.

Step 5 of 10

1.5 Basic JavaFX Architecture

Learning objective

Trace the relationship between Application, Stage, Scene, the scene graph, layouts, and controls.

Classroom architecture

Application starts the JavaFX program
Stage represents the top-level window
Scene contains the displayed graphical content
The scene graph organizes all nodes
Layout nodes arrange control nodes

Core assembly pattern

VBox root = new VBox();
root.getChildren().add(new Label("Hello"));

Scene scene = new Scene(root, 400, 200);
stage.setScene(scene);
stage.show();

Check your understanding: What is the correct outer-to-inner order: Scene, Node, Stage?

Stage, then Scene, then nodes in the scene graph.

Step 6 of 10

1.6 Stage

Learning objective

Create and configure a JavaFX top-level window.

A Stage represents a top-level window. JavaFX supplies the primary stage as the parameter of start(Stage stage), although additional Stage objects can be created.

Common Stage methods
Method	Purpose
setTitle(String)	Sets the title-bar text
setScene(Scene)	Places a scene in the window
setWidth(double)	Sets the window width
setHeight(double)	Sets the window height
show()	Displays the window
close()	Closes the window

Configure the primary stage

stage.setTitle("Student Application");
stage.setScene(scene);
stage.setWidth(500);
stage.setHeight(300);
stage.show();

Check your understanding: Which Stage method makes the window visible?

show().

Step 7 of 10

1.7 Scene

Learning objective

Explain how a Scene connects a root node to a Stage.

A Scene contains the graphical contents displayed inside a Stage. Its first constructor argument is the root node, followed optionally by width and height.

Create and attach a Scene

VBox root = new VBox();
Scene scene = new Scene(root, 400, 300);
stage.setScene(scene);

Check your understanding: What must the first argument of new Scene(...) be?

The root node of the scene graph.

Step 8 of 10

1.8 Node

Learning objective

Identify controls and layouts as nodes in the visual tree.

Almost every visual element placed inside a JavaFX Scene is a Node. A node is one item in the JavaFX visual tree.

Examples of nodes

Label
Button
TextField
CheckBox
VBox
HBox
GridPane

Add child nodes to a parent node

Label nameLabel = new Label("Name");
TextField nameField = new TextField();
Button submit = new Button("Submit");

VBox root = new VBox(10, nameLabel, nameField, submit);

Check your understanding: Is a VBox a node even though it mainly arranges other elements?

Yes. Layout panes such as VBox are nodes and can also contain child nodes.

Step 9 of 10

1.9 Scene Graph

Learning objective

Explain parent-child relationships in the JavaFX scene graph.

The Scene Graph is a hierarchical tree containing all graphical elements of a Scene. Parent nodes organize child nodes, and the root is the first node supplied to the Scene.

Example scene graph
Level	Node	Role
Root	VBox	Parent layout
Child	Label	Displays text
Child	TextField	Accepts text
Child	Button	Starts an action

Check your understanding: In a VBox containing a Label and Button, which node is the parent?

The VBox.

Step 10 of 10

1.10 First JavaFX Application

Learning objective

Assemble and trace a complete JavaFX application.

HelloJavaFX.java

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class HelloJavaFX extends Application {
    @Override
    public void start(Stage stage) {
        Label label = new Label("Welcome to JavaFX");
        VBox root = new VBox(10, label);

        Scene scene = new Scene(root, 400, 200);
        stage.setTitle("My First JavaFX Application");
        stage.setScene(scene);
        stage.show();
    }

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

Expected result

A 400 x 200 window opens.
Title: My First JavaFX Application
Content: Welcome to JavaFX

Program flow

main() calls Application.launch()
JavaFX initializes the application
start(Stage) creates the interface
A Label is placed in a VBox
The VBox becomes the Scene root
The Scene is placed on the Stage
stage.show() displays the window

Check your understanding: Which lifecycle method normally creates the user interface?

start(Stage stage).