Getting started with JavaFX and JavaFX Studio plug-in for Eclipse

This short tutorial shows you how to get started with JavaFX and Exadel JavaFX Studio plug-in for Eclipse. You will build an application where you can add users to a list and delete users from a list.

What you need

  1. Download and install JavaFX SKD for your operating system (download)
  2. Download and install Eclipse 3.4.2 – Eclipse IDE or Eclipse IDE for Java EE Developers (download)
  3. Download and install Exadel JavaFX Studio plug-in (download, click on Download, left-side bar). Installation steps

Creating JavaFX project

  1. In Eclipse, select File/New/Other…/JavaFX/JavaFX Project
  2. Click Next
  3. For Project name enter: javafx-users
  4. On the same screen, click Configure to configure JavaFX SDK
  5. Click Add
  6. Point to JavaFX SDK home via Browse…
  7. Click Finish and then OK to go back to new project wizard
  8. Click Finish to finish project creation

Creating JavaFX script

  1. Right-click src folder and select New/Package
  2. For name, enter: example and click Finish
  3. Right-click example and select New/Other/JavaFX/JavaFX Script. Click Next
  4. For name, enter: users. Click Next
  5. Check Generate Stage. Click Finish. This steps adds a small JavaFX application that you can run.
  6. Right click in editor whitespace and select Run As/JavaFX Application. You should see a small window open with Hello World message.

Creating users application

Copy and paste the following JavaFX script over the existing code replacing everything but the package name:

package example;
 
import javafx.scene.Scene;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.scene.control.TextBox;
import javafx.scene.control.Button;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.layout.Tile;
import javafx.geometry.HPos;
import javafx.geometry.VPos;
import javafx.stage.Stage;
 
var names : String [];
var textBox : TextBox = TextBox {
        columns: 15
}
Stage {
    title: "Application"
    width: 250 height:350
    scene: Scene {
        content: [ 
               HBox {
                  layoutX: 3 
                  layoutY: 3
                  spacing: 3
                  content: [
                     textBox,
                     Button {
                        text: "Add"
                        style: "base: blue" 
                        action: function () {
                           insert textBox.text into names;
                        }
                     }
                  ]
               }
               VBox {
                  layoutX: 3
                  layoutY: 30
                  spacing: 2
                  content: [
                     Tile {
                        columns: 2
                        content: bind for (name in names) { [
                           Text {
                              font: Font { size: 16 } 
                              content: name
                           },
                           Button {
                              text: "Delete"
                              style: "base: blue" 
                              action: function () {
                                 delete names[indexof name];
                              }
                           }
                        ]
                     }
                  }
              ]
           }
        ]
    }
};

To run, right-click in the editor and select Run As/JavaFX Application. You should get the following:
screenshot48

You can also run as Applet by selecting Run As/JavaFX Application (Applet).
screenshot50

8 comments

  1. Pingback: Learning JavaFX » Another Eclipse plugin
  2. Pingback: JavaFX and Seam with Flaming - Dzone article, part 1 | Maxa Blog
  3. Pingback: JavaFX Studio plug-in for Eclipse updated | Maxa Blog
  4. Pingback: Exadel JavaFX plug-in works with Eclipse 3.5 (Galileo) | Maxa Blog
  5. Pingback: Java desktop links of the week, June 15 | Jonathan Giles
  6. Pingback: Exadel JavaFX Studio plug-in for Eclipse 1.0.2 released | Maxa Blog
  7. Pingback: Exadel JavaFX Studio 1.1 now available | Maxa Blog
  8. Sergey

    OK, your script does work with my JavaFX project. So I feel like creating a more complicated project with the aid of Eclipse. It has taken me some time to properly install Eclipse on Ubuntu but at last everything is working fine.

    Reply

Leave a Reply