Programming Examples

Are you a Programmer or Application Developer or a DBA? Take a cup of coffee, sit back and spend few minutes here :)

Scene & Scene Graph in JavaFx

1. JavaFx Scene

In JavaFx, a Scene represents the visual content of a stage. The Scene in JavaFx is represented by the Scene class from the ‘javafx.scene’ package. JavaFx stage shows the scene in it & only one scene can be present in a stage. If scene goes to a different stage, JavaFx first detach it from the current scene.

Fig 1. JavaFx Stage and Scene
Fig 1. JavaFx Stage and Scene

In the above picture, we can see a stage is presenting a scene and when it needs to change the scene, it should discard the currently presented scene.

2. Scene Graph & Visual Nodes

A JavaFx Scene consists of tree structure of the Nodes. The top-level node is the Root-Node and a scene should have at least one root node. From the root node, the stage will travel through the visual elements in the Scene Graph.

Fig 2. Scene Graph and Visual Nodes
Fig 2. Scene Graph and Visual Nodes

When a node in the scene graph contains some other nodes, we call it as Parent Node. When a node does not have any child node, we call it as Leaf Node. In the picture above, nodes P1, P2, P3 are parent nodes whereas n1, n2, n3, n4 are leaf nodes. Each node in the scene graph is a javafx.scene.Node instance. This means, all the visual elements are somehow derived from Node class. When Fx runtime, goes through scene graph, it knows what to present in the stage.

3. Root Node of a Scene Graph

A Root Node can be resizable or non-resizable based on the type. For Example, A container control acting as a Root Node resizes itself when the size of the scene changes. The resizable node here also walks through the child nodes and revisits the layout of them.

A group is an example for non-resizable Root Node, and the scene will clip it to a fixed position. When user resizes the scene, the visual elements in the scene graphs maintains its location. This means the group will not call for node’s lay out again.

4. Node Types – Graphic, Container, Control

The Scene Graph is a hierarchical structure of tree defining the parent child relationship. Each node in the scene graph is derived from Node class and we can put them in three major categories.

  1. Shape: The nodes in this category are for drawings. It can be 2D or 3D. Examples are Rectangle, Circle.
  2. Region: These are nodes to hold other controls. They act as containers for other nodes, and we know that a container takes care of laying out the controls. Examples are: VBox, Pane.
  3. Control: These node forms the UI elements. Example: TextField, Radio Button.

When we launch JavaFx application, the stage will show the scene. The scene contains the scene graph and by walking through it, the stage knows what visual elements it needs to display.

Categories: JavaFx

Tags: , ,

Do you like this Example? Please comment about it for others!!

This site uses Akismet to reduce spam. Learn how your comment data is processed.