Aug 05 2008
Learning Curve Journal, Part 1: Exploring JavaFX Script(3)
Creating a JavaFX Application
After you’ve read at least some of the language reference document, it’s time to build a simple JavaFX application. Although you can build and run a JavaFX application manually from a command line, let’s do it using NetBeans IDE 6.1, which has many features designed to simplify developing applications. You will need to install the JavaFX plugin for NetBeans.
If you don’t have NetBeans IDE 6.1 installed, you can download NetBeans IDE 6.1 with JavaFX, a single installation package that contains NetBeans IDE 6.1 and the JavaFX plugin for NetBeans. If you already have NetBeans IDE 6.1 installed, you can add JavaFX technology support by installing the JavaFX plugin in the NetBeans update center. The JavaFX plugin for NetBeans is currently available for Windows and Mac OS/X environments. Installing the JavaFX plugin allows you to use NetBeans IDE 6.1 to create, test, debug, and deploy applications written in the compiler-based version of JavaFX Script. The plugin enhances editor and project support to include JavaFX Script files. It also provides the core libraries for the script engine and its libraries.
After you install NetBeans IDE 6.1 with JavaFX or the JavaFX plugin for NetBeans, you’re ready to build your first JavaFX application. Of course, who can resist starting with “Hello, world!”
Start by creating a project as follows:
- Choose File -> New Project from the main menu.
- In the New Project wizard, select the JavaFX category and the JavaFX Script Application project type.
- Click the Next button.
- Name the project, for instance, HelloWorldJFX.Accept the default project location or browse to select a different location.
- Leave the Create Main Class checkbox checked and the other default settings unchanged.
- Click the Finish button.
As Figure 1 shows, the IDE creates the project directory in the specified project folder and gives it the same name as your project, HelloWorldJFX. Expand the HelloWorldJFX project. Notice the Main.fx class file below the helloworldjfx package in the Source Packages node. The IDE creates the Main.fx file because the Create Main Class checkbox was checked when you created the project. This is the file that will hold the source code for the application.
Figure 1. HelloWorldJFX project files |
Let’s put some source code in the Main.fx file. Right click on Main.fx in the Projects window, then select Open. The file opens to display the following contents:
/* * Main.fx * * Created on ... */ package helloworldjfx; /** * @author ... */ // place your code here |
Replace the line // place your code here with the following code:
import javafx.ext.swing.Label; Label { text: "Hello, world!" }
|
The JavaFXScript editor provides basic formatting and code completion. Programmers new to JavaFX Script — that’s all of us — aren’t always sure what the language syntax expects, but code completion helps. Pressing the Ctrl + Space keys activates code completion in the editor.
In addition, the JavaFX Script plugin provides a preview feature that you can use to view the results of your application without having to compile and run it first. Changes that you make to the source file are immediately reflected in the preview pane. The preview feature is currently disabled on the Mac OS X platform.
Click the Enable Preview button
to enable the preview feature. You’ll see the output just above the editor, as shown in Figure 2.
Figure 2. Your Basic “Hello, world!” |
Not impressed? OK, although I’m really just trying to show you how to get set up, I’ll try something a little more interesting. The JavaFX environment implements all of the Swing UI components, so you don’t have to limit yourself to a label. You can use other widgets too, like buttons or dialog boxes.