Login | Register   
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

Using JavaFX Mobile to Combat Device UI Fragmentation

JavaFX 1.1, a powerful tool for building rich UIs across a multitude of clients, provides mobile emulation for developing JavaFX Mobile applications. Get a beginner's guide to JavaFX Mobile development.


advertisement
ith the recent release of the JavaFX Software Developer Kit 1.1, Sun also released the long awaited JavaFX Mobile platform. Through a Java-like scripting language (JavaFX Script) and a single API, JavaFX provides a development tool that supports a variety of platforms, from desktops to mobile devices.

This article provides a beginner's guide to JavaFX Mobile development, but because all JavaFX development relies on the same SDK and tooling, it could just as easily be about JavaFX in general. Rather than offering a separate JavaFX Mobile SDK, the JavaFX SDK 1.1 and its development tools provide mobile emulation for developing JavaFX Mobile applications. Joshua Marinacci from Sun's Java Swing team put it best in a recent blog posting: "There is no JavaFX Mobile. There is only JavaFX."

Java's ubiquity on mobile devices has made the "write once, run anywhere" (WORA) premise difficult to abide by given the thousands of mobile device screens. With JavaFX Mobile, the Java community has a tool to possibly combat this device UI fragmentation.



JavaFX's Syntax and Synergy with Java

JavaFX is a product framework comprised of JavaFX Script and JavaFX Mobile. JavaFX Script (JavaFX for short) is a scripting language meant to provide rich user interfaces and as its name implies, JavaFX Mobile is JavaFX for mobile platforms.

JavaFX Script uses a declarative syntax that resembles JavaScript and Scalar Vector Graphics (SVG). For example, here is the JavaFX code (minus imports) for creating a little "hello world" type of window as shown in Figure 1, Figure 2, and Figure 3.

Stage { title: "Cool Running" width: 250 height: 80 scene: Scene { content: Text { font: Font { size: 20 } x: 10, y: 30 fill: Color.GREEN content: "JavaFX is cool" } } }

As you can see, JavaFX has some resemblance to Java and/or JavaScript, but it is neither.


Figure 1. A Simple JavaFX UI Window Running on a Desktop: This simple JavaFX UI window is running on a desktop.
 
Figure 2. A Simple JavaFX UI Window Running in a Browser: This simple JavaFX UI window is running in a browser.
 
Figure 3. A Simple JavaFX UI Window Running in a Mobile Phone Emulator: This simple JavaFX UI window is running in a mobile phone emulator.

JavaFX's declarative style is more apparent when contrasted with the imperative programming style of Java Swing. The following Swing code creates the same "hello world" window as the previous JavaFX example (again minus imports):

public class Main { public static void main(String[] args) { JFrame aFrame = new JFrame("Cool Running"); aFrame.setSize(250, 80); JPanel content = new JPanel(); content.setLayout(new BorderLayout(5, 5)); content.setBackground(Color.WHITE); JLabel aLabel = new JLabel("Swing is cool"); aLabel.setFont(new Font(null, Font.PLAIN, 20)); aLabel.setForeground(Color.GREEN); content.add(aLabel, BorderLayout.CENTER); aFrame.setContentPane(content); aFrame.setVisible(true); aFrame. setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); } }

Notice the imperative nature (i.e., statement by statement, control flow) of Swing, which has been used for traditional Java UI development. Figure 4 shows the result of the Java Swing code.

Figure 4. Swing Versus JavaFX: This is the same "Hello World" window created from Swing code versus JavaFX code.

As previously stated, JavaFX is neither Java nor JavaScript, but JavaFX scripts can call Java classes or be called on by Java classes. For example, in the following JavaFX script for determining the size of a window, the Stage object's size has been rewritten to use the standard Java Math class:

var i = 250; var j = 300; Stage { title: "Cool Running" width: java.lang.Math.max(i, j) height: 80 scene: Scene { ...

Sun has touted JavaFX's ability to leverage existing Java code as one of its advantages over other RIA technologies such as Adobe Flex. Also, while JavaFX Script provides a platform for building any application, its purpose as defined by Sun is for use in UI development and not for business or backend components.



Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap