Reason #1: JavaFX is a Brand New Platform and Language With a New Declarative Syntax

For those of you who have been programming for a long time, have you noticed that the syntax for the Java language is very close to the syntax of the C programming language? Those who have been programming for an even longer time may have noticed that the syntax for the C programming language is very similar to the syntax of Pascal. This makes sense for language designers because they want as many developers as possible to migrate to their new language. However, it also means that the basic syntax used for Java (and Java ME) is originally based on languages and computing environments where the only mechanism for the user interface was the command line.

Now of course, more sophisticated graphical user interfaces have been introduced and adopted over the years. Today's customers not only expect your mobile or desktop application to be functional, but they're also expecting a rich user experience.

So what does all this mean? It simply means that the programming languages, paradigms, and even the syntax of the previous century are less applicable for today's standards. Java is a very powerful and versatile programming language, but structural and object-oriented programming languages are not well-suited to the creation of applications with intense graphical user interfaces.

This is where JavaFX comes in. JavaFX is a completely new platform and language with RIA-friendly features, including a declarative syntax for UI development. Figure 1 below shows an architecture diagram for the JavaFX platform.

Figure 1. JavaFX Platform Architecture

Now that you've seen the architecture for the JavaFX platform, let's look at some of the concepts presented in Figure 1. The JavaFX platform includes several functional pieces that allow developers (and designers) to build rich internet applications (RIAs). In the past, a graphical designer would have to learn how to program, or (even worse) a developer would have to acquire graphics and user experience skills. Java is a great language for us developers to use to build dynamic and innovating applications — but the concept of threads, static variables, memory management, and hashmaps are not as easy to learn for most graphical designers.

JavaFX has solved this problem with its declarative syntax for UI development. All JavaFX "screens" — that may be a new concept to you — support this new declarative syntax. A JavaFX screen is a runtime environment, and JavaFX supports desktop, mobile, and TV screens. The following listing contains the code for our first JavaFX application. This application, of course, uses the declarative syntax of the JavaFX Script language. This application also uses the common elements shown in Figure 1, so this application works on all JavaFX screens, which includes mobile.

package notifier;

import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.text.Text;
import javafx.scene.text.Font;

var img = Image {
           url: "{__DIR__}email.png"
         }

Stage {
   width: 200
   height: 250
   title: "Mail Notifier"
   scene: Scene {
       content: [
          
           ImageView {
               image: img
               x: 0
               y: 0
           }

           Text {
               font: Font {
                   size: 16
               }
               x: 10
               y: 140
               content: "New Email Received!"
           }
       ]
   }
}

As previously stated, the preceding code adheres to the JavaFX common elements, so it will run as a mobile application as well as a desktop application. If you run the code in Listing 1 under the mobile profile, you'll invoke the mobile emulator in NetBeans 6.5 and you should see your application running as shown in Figure 2. However, if you execute the code above according to the desktop profile, then you should see your application running as shown in Figure 3.

Figure 2. The MailNotifier.fx Application Running in the Mobile Profile

Figure 3. The MailNotifier.fx Application Running in the Desktop Profile

So, now that you've seen the code and know what results it will produce, let's start analyzing the code in greater detail. If you're new to JavaFX, then all the syntax in Listing 1 probably looks radically different from the Java syntax that you are accustomed to using. However, at second glance, you should notice the following five elements that allow the application to work:

• Stage — This is the root element which is needed for any JavaFX application. For Swing developers, this is analogous to a JFrame. For Midlet developers there is less of a direct one-to-one correlation, but you can imagine this to be a Display object.
  
  
• Scene — This is an internal element which is a container for UI components. For Swing developers, you can think of this as a JPanel. For Midlet developers you can think of this as a Form object. You should notice that all UI components need to be placed in the content of the Scene.
  
  
• Image — This is simple object that allow you to reference a external image via the url parameter. You should notice that I used the constant, {__DIR__} to get a reference to the current directory.
  
  
• ImageView — This is a displayable UI component that requires a reference to an Image object.
  
  
• Text — This is a simple UI component for rendering text on the screen.

Hopefully, it should be easy to see that the declarative syntax is one of the best new features in JavaFX. It will allow graphic designers and user-experience team members to aid in the process of creating compelling graphical applications that adhere to the MVC pattern. These team members do not need to learn the Java ME graphical APIs. In fact, once they learn the declarative syntax in JavaFX, they can easily use their skills to create user interfaces for desktop and TV applications.