Wednesday, July 18, 2012

Hello World, JavaFX Style

The best way to teach you what it is like to create and build a JavaFX application is with a “Hello World” application. An added benefit of this tutorial is that enables you to test that your JavaFX technology is properly installed.
The tool used in this tutorial is NetBeans IDE 7.1. Before you begin, ensure that the version of NetBeans IDE that you are using supports JavaFX 2. See the System Requirements for details.

Construct the Application

  1. From the File menu, choose New Project.
  2. In the JavaFX application category, choose JavaFX Application. Click Next.
  3. Name the project HelloWorld and click Finish.
    NetBeans opens the file and populates it with the code for a basic Hello World application, as shown in Example 1-1.
    Example 1-1 Hello World
    package helloworld;
    import javafx.application.Application;
    import javafx.event.ActionEvent;
    import javafx.event.EventHandler;
    import javafx.scene.Scene;
    import javafx.scene.control.Button;
    import javafx.scene.layout.StackPane;
    import javafx.stage.Stage;
    public class HelloWorld extends Application {
        public static void main(String[] args) {
        public void start(Stage primaryStage) {
            primaryStage.setTitle("Hello World!");
            Button btn = new Button();
            btn.setText("Say 'Hello World'");
            btn.setOnAction(new EventHandler() {
                public void handle(ActionEvent event) {
                    System.out.println("Hello World!");
            StackPane root = new StackPane();
            primaryStage.setScene(new Scene(root, 300, 250));
Here are the important things to know about the basic structure of a JavaFX application:
  • A JavaFX application defines the user interface container by means of a stage and a scene. The JavaFX Stage class is the top-level JavaFX container. The JavaFX Scene class is the container for all content. Example 1-1 creates the stage and scene and makes the scene visible in a given pixel size.
  • In JavaFX, the content of the scene is represented as a hierarchical scene graph of nodes. In this example, the root node is a StackPane object, which is a resizable layout node. This means that the root node's size tracks the scene's size and changes when the stage is resized by a user.
  • The root node contains one child node, a button control with text, plus an event handler to print a message when the button is pressed.
Figure 1-1 shows the scene graph for the Hello World application.
Figure 1-1 Hello World Scene Graph
Description of Figure 1-1 follows
Description of "Figure 1-1 Hello World Scene Graph"

Run the Application

Run the application, click the Say Hello World button, and verify that the text "Hello World!" is printed to the NetBeans output window. Figure 1-2 shows the Hello World application, JavaFX style.
Figure 1-2 Hello World, JavaFX style
Description of Figure 1-2 follows
Description of "Figure 1-2 Hello World, JavaFX style"

Where to Go Next

This concludes the basic Hello World tutorial, but continue reading for more lessons on developing JavaFX applications:

1 comment:

Anonymous said...

This is a topic which is close to my heart.
.. Many thanks! Where are your contact details though?

Also visit my weblog: Michael Kors Canada