JavaFX 1.3 has just gone live on JavaFX.com.  This release is deceptively small, but has an enormous number of changes under the hood.  In this post I will take you through the Top 10 major features, giving you background information I learned from working with the JavaFX team, and flooding you with details on interesting tidbits you might otherwise miss.

JavaFX 1.3 Top 10 Features

1. New Controls

JavaFX 1.3 comes with several new controls that are extremely useful when designing user interfaces.  For building forms you have the new PasswordBox, ChoiceBox, and Separator classes.  The PasswordBox is similar to the TextBox control, except it automatically hides input as it is typed.  The ChoiceBox control is long overdue, but surprisingly simple to use.  The interface is similar to the ListView control, both of which take a sequence of items.

Speaking of the ListView, this control has received a serious upgrade.  This includes the ability to render horizontally or vertically as well as customizable cell renderers via a cellFactory closure.

In addition, there is a new ScrollView class that simplifies the task of creating a simple scrollable viewport surrounding a collection of nodes.  This has been a feature in JFXtras for a while, so it is nice to see that the JavaFX team thought it was useful enough to add to the core libraries.

Finally, all controls now take a Tooltip that will be displayed on rollover.

To bring it all together, here is a simple example that demonstrates all the new controls in action:

And here is the source code:

import javafx.scene.control.*;
import javafx.scene.layout.VBox;
import javafx.geometry.Insets;

var list = ["apples", "bananas", "oranges", "pears", "cabbage"];

ScrollView {
  width: 250
  height: 250
  managed: false
  node: VBox {
    padding: Insets {top: 10, left: 10, bottom: 10, right: 10}
    spacing: 10
    content: [
      PasswordBox {promptText: "enter password"}
      Separator {}
      ChoiceBox {
        items: list
      }
      ListView {
        vertical: false
        items: list
      }
    ]
  }
}

2. Layout Enhancements

Layout has undergone some serious changes as a result of this release, including the following:

• LayoutInfo and Resizable now include settings for fill, grow, and shrink.  Fill will allow you to specify whether the contents of a layout stop at their preferredSize or take up the maximum allowable space.  Grow and shrink are hints to the container about the relative priority for different nodes to get the available space.
• LayoutInfo also includes a new margin feature, which makes it very easy to add visual padding around your Nodes in a layout!  This is in addition to padding, which appears on all the built-in layouts.
• Container has a new snapToPixel boolean that allows you to create pixel-perfect alignments to avoid unwanted aliasing effects.
• There is a new autoSize feature on Groups. Children will be automatically resized to their preferred width and height, preventing layout bugs when uninitialized components return the wrong bounds initially. You can still disable this feature, but it is strongly recommended that you fix your application to make use of preferred widths and heights instead of setting Node width and height manually.
• Resizable classes automatically have layoutBounds set to [0, 0, width, height], avoiding an additional required declaration.
• New support for baseline layouts via the TextOrigin class.
• The Tile class now automatically sizes the tileWidth and tileHeight by default.
• HPos and VPos have boolean for fillHeight and fillWidth, which rarely should be changed, but allow you to default back to the pre 1.3 behavior.

For the most part, the JavaFX team has done an amazing job of keeping the layout changes backwards compatible.  However, to fully take advantage of the new layout features you will have to update your code.

The layout changes are significant enough that I can’t do them justice in this short blurb.  However, either myself or Amy Fowler (whoever makes it first) will do an in depth article on just this one topic!

3. Performance

There have been some very significant changes in performance in the JavaFX 1.3 release all the way down to the compiler generated code.

Some areas you will notice the largest performance improvement in include:

• Bind performance – All binds in the language are now lazy by default, which means that they will get marked as dirty immediately, but only get re-evaluated when needed (if at all).
• General code performance – With the compiler rewrite, a level of indirection on variable access has been removed, which will significantly improve the overall performance of any application.
• Layout performance – The layout code has been optimized to reduce the number of passes required on each layout cycle, greatly improving the perceived responsiveness of applications.
• Text performance – With the change to logical rather than physical layout bounds, any applications that heavily use Text elements will see a dramatic improvement in overall performance.
• CSS performance – The CSS support has been rewritten from the ground up, greatly improving performance of applied styles.

4. Enhanced CSS

The CSS support in JavaFX 1.3 has been rewritten from the ground up.  This includes some greatly enhanced functionality, especially for the Control classes, and also has a dramatic improvement on performance.

Because the changes are so significant, you may find that a lot of your previous styles do not work correctly on the 1.3 release.  The full set of CSS changes and supported tags is such a large topic that I will provide a link to the full JavaFX CSS specification once it is made available.

Dean Iverson has done an excellent writeup of some of the new CSS capabilties here: Advanced JavaFX Control Styling

5. 3D Support

Via the new, experimental Prism graphics stack you can start experimenting with 3D graphics in your JavaFX applications.  Some of the new APIs that you will see throughout the JavaFX documentation for working with 3D graphics include:

• New Camera classes for changing the viewing perspective of the Scene, including a ParallelCamera that does orthographic projections and a PerspectiveCamera that can be used to see things in full 3D
• Transition changes to accept a three dimensional axis on RotationTransition, ScaleTransition, and TranslateTransition
• A completely revamped set of transform classes that accept z coordinates
• A new Point3D class as well as changes to BoundingBox and Bounds to accept a third dimension
• The addition of rotationAxis, scaleZ, and translateZ on all scene graph Nodes

To use 3D in your applications you will need to enable the prism graphics stack with the following JVM argument:

-Xtoolkit prism

Runtime you can validate whether 3D is enabled or not using the new Platform and ConditionalFeature classes like this:

Platform.isSupported(ConditionalFeature.3D);

The best example of JavaFX 3D in action is Jim Weaver’s new 3D Calendar Cube post.

6. TV Emulator

For the first time, JavaFX 1.3 includes a TV Emulator as part of the distribution.  This gives you the chance to compile and test your applications against the new TV profile, and sometime in the near future deploy it to the big screen!

The easiest way to change your application to run against the TV profile is to select the “Run in TV Emulator” option in the NetBeans Properties dialog.  From the command line you can accomplish the same thing by passing in “-profile TV” to both the compiler and JavaFX runtime.

Here is a screenshot of the TV Emulator in action:

The biggest change you will notice is the different icon in the upper-left hand corner of the screen.  From a development perspective, it feels very similar to the desktop experience, but you need to keep in mind the following constraints:

• Screen Distance – Your end users will be sitting 5 to 6 feet away from the screen, so your entire application has to be designed to be visually distinctive at a distance.
• Remote Interaction – TV viewers do not typically sit on their couches with full QWERTY keyboards, so your UI will need to be designed to be fully operational from a common remote control.  This can make navigation, selection, and text input much more challenging.

If you are interested to see a live demonstration of JavaFX TV, join us in person or for the live web stream of our June SvJugFX meeting with Mikhail Gorshenev from the JavaFX TV development team.

7. Conditional Features

I mentioned a little bit about conditional features in the 3D section above.  However, having conditional features is itself an extremely important feature.

In previous release of JavaFX if you wanted to make use of certain features, such as effects, that were only in the desktop profile, you were required to remove these from your code to compile against mobile.  With the addition of conditional features you can now safely include these features in your application and they will be silently ignored if they are not supported on your platform.

This takes the concept of write once, run anywhere to a new level in JavaFX, greatly simplifying development on platforms that only support the common profile!

Here is a short program that will print out whether or not each of the conditional features is enabled for your platform:

import javafx.runtime.*;

println("Effect enabled: {Platform.isSupported(ConditionalFeature.EFFECT)}");
println("Input Method enabled: {Platform.isSupported(ConditionalFeature.INPUT_METHOD)}");
println("Scene 3D enabled: {Platform.isSupported(ConditionalFeature.SCENE3D)}");
println("Shape Clip enabled: {Platform.isSupported(ConditionalFeature.SHAPE_CLIP)}");

8. Custom Cursors

You are no longer limited to the set of default cursors defined on the Cursor class.  Using the new ImageCursor class you can take any JavaFX Image and turn it into a mouse cursor.

This capability was recently released as a part of the JFXtras 0.6 Release thanks to the hard work of Jeff Friesen, but is a very welcome addition to the core API!  Now all that is needed is an implementation of Jeff’s custom paints.

9. Faster Animation

JavaFX 1.3 has a new cacheHint option on Nodes that allows you to degrade performance while animations are taking place.  Perceptually it is hard for the user to notice the loss of quality, but it can have a very big difference in performance of your application.  This is a staple of other JavaFX scene graph technologies like Piccolo2D, so it is good to see progress on this in the JavaFX 1.3 release.

There is a great example of how to use this new capability right in the JavaFX Node API docs (duplicated here for convenience):

 expensiveNode.cache = true;
 expensiveNode.cacheHint = CacheHint.QUALITY;
 ...
 // Do an animation
 expensiveNode.cacheHint = CacheHint.SPEED;
 Timeline {
     keyFrames: [
         KeyFrame {
             time: 2s
             values: [
                 expensiveNode.scaleX => 2.0,
                 expensiveNode.scaleY => 2.0,
                 expensiveNode.rotate => 360,
                 expensiveNode.cacheHint => CacheHint.QUALITY
             ]
        }
     ]
 }.play();

10. Preview Features

In addition to the public API, JavaFX 1.3 contains a number of top secret new features!  These are features that are not final, but are very usable if you are willing to live with future API changes.  All of the preview features are grouped under the com.javafx.preview package, and include the following:

• Grid – A Grid layout that makes it much simpler to layout nodes in perfectly aligned rows and columns.  The original layout code was donated by the JFXtras team, and productized by the amazing layout skills of Amy Fowler.
• MenuBar/PopupMenu – This is the completed version of Jonathan Giles very popular Menu control.  He is now a core member of the JavaFX Control Team, and plugging away at bringing this and other great controls to the hands of JavaFX developers.
• TreeView – A full implementation of a hierarchical tree in JavaFX complete with TreeItems and TreeCells.
• ToolBar – A palette-like control that lets you create rows of tool buttons with icons and text.  This is the handiwork of Paru Somashekar.

In a future post I will go into more detail on usage of these preview features, which greatly extend the power of JavaFX!

Other Noteworthy Features

Besides the major features mentioned above, there are also thousands of little changes that have made it in to the 1.3 release.  While I don’t have time (or room) to cover all of them in detail, here are some other noteworthy features that you can take advantage of in your applications:

• New Amble font – JavaFX now includes its own high fidelity fonts that are consistent across all platforms.  Since this is the new default font, you may notice that the spacing and alignment of your existing applications may be slightly off.
• Timelines can now be paused.  There is also an evaluateKeyValues that allows you to reevaluate the value portion of your animation (whatever is on the right side of the =>) on demand (normally the value is evaluated once before the first Timeline execution).
• You can get exceptions that occur while processing JSON/XML via the new exception variable on Event.
• PullParsers can now be run asynchronously using the new ParserTask class.
• FXD now supports node selection via an XPath-like syntax and has metadata support on nodes, which is exposed as a map to the application.
• There is a new Bounds class for representing widths and heights.
• Builtins has a new isReadOnly function, which tells you if a variable is bound.  No more catching AssignToBoundException!
• Durations are now Comparable, have new constants for one and zero, and a new static TYPE_INFO variable.
• CustomNode now has a publicly exposed children sequence.  This makes it much easier to work with scenegraph navigation.  It also solves a potentially perplexing issue with object initialization order.  You should definitely make use of the new children sequence rather than overriding the old create function.
• The infernal scene graph warning is gone!  You can now move a node around the scenegraph without worrying about removing it from the previous parent.  Stuart Marks has a great blog post about this.
• Node has a new pickOnBounds variable that lets you change the active hit region to be the logical rather than the physical bounds.
• All container nodes (Group, CustomNode, Container, Control) now extend Parent and have a children sequence, greatly simplifying scene graph traversal.
• Text supports logical and physical bounds.  Big performance improvement with the new default of logical!
• Improved charts…  background lines, shading, and cleaner text.  Here is a before and after picture:

Additional Resources

The JavaFX team did a great job of documenting the new features and migration to JavaFX 1.3 in the following articles:

• What’s New in JavaFX 1.3
• JavaFX 1.3 Migration Guide

And not to be outdone, Jim Weaver had the very first external post about the 1.3 release emphasizing the new 3D capabilities:

• Your Calendar PWN3D: Leveraging the JavaFX SCENE3D ConditionalFeature

Since this post first appeared, some excellent resources have come up:

• Advanced JavaFX Control Styling by Dean Iverson

As additional resource become available, I will continue to update this section.

Conclusion

I hope you enjoyed this whirlwind tour through all the new features of the JavaFX 1.3 release.  There is a lot of goodness here, some of which I might have missed, so please comment on any features of the 1.3 release that you enjoy using!

Note 1: I am following Jim Weaver’s lead, since he discovered JavaFX 1.2 is downloadable from javafx.com. Enjoy the new release!

Note 2: I have updated the section below on nativearray.  Please use with caution!

The JavaFX 1.2 release is a huge upgrade from 1.1, both in terms of functionality and API improvements.  This means there are lots of cool new things to take advantage of, but at the same time you will spend quite a lot of time migrating your applications.

Fortunately, after upgrading JFXtras, WidgetFX, and dozens of sample applications for the Pro JavaFX Platform book, I have this all down to a science.  In the rest of this blog I will take you through a whirlwind tour of the relevant new features, and most common migration hurdles so you can be up and running in record time!

First the fun stuff…  new features.  Here are the top 10 features you should start using today:

JavaFX Top 10 Features (revised)

1. Skinnable UI Controls

It is great to have some pure JavaFX controls, such as Button, ListView, ProgressBar, and Slider that don’t rely on Swing peers underneath.  An added advantage is that they are fully skinnable to match the fonts and color palette of your application.

2. New Layout Classes

The new layout classes including Tile, Stack, Flow, ClipView, and Panel are a very welcome addition!  The layout API has also gotten a lot cleaner, which makes it easier to write your own layouts, such as the JFXtras Grid.

3. Charting Support: Area, Bar, Bubble, Line, Pie, Scatter, X/Y

Now I can compete with my Flex buddies on business oriented RIAs!  The new charting and graphing support is a must for any enterprise applications, so I am glad to see it made the cut.

4. RSS/Atom Feed Support

Having built-in RSS/Atom feed support is a welcome addition, and will make it much easier to write feed-based applications that cleanly port from the desktop to mobile.

5. Local Data Storage

An easy way to save state between sessions, no Web Start API hacking required!  See the new Resource and Storage classes in the javafx.io package for details.

6. Stage Infrastructure: Screen and Alerts

There is some new functionality that makes it easy to pop-up alert dialogs, or work directly with the screen bounds.  While you could have done direct Swing/Java2D hacks before, this helps keep your code mobile safe.

7. Improved Asynchronous Processing Model

The new Task class supercedes the AsynchronousAbstractOperation with a clean API for calling long-running tasks.  The code running in the background has to be coded in Java, but if you are looking for a JavaFX alternative see the JFXWorker (which is part of the JFXtras project).

8. BoxBlur effect

Finally, a high-performance alternative to Gaussian blur.  This is now the default for DropShadow, which should speed up a lot of applications!

9. Math and Properties Classes

There are new JavaFX equivalents for java.lang.Math and java.util.Properties in the javafx.util package.  Make sure you use these instead so your application is portable to mobile.

10. High Performance Referencing of Java Arrays (updated!)

Java arrays are now optimized so that they can be used directly from JavaFX code without conversion to a sequence.  This can have a huge performance gain in programs transfering large models between Java and JavaFX code, and is transparent to the application developer.

Note: There is experimental support for direct creation of Java arrays in JavaFX using the nativearray keyword.  Use with caution, because this functionality may be removed at any time.

 Now that you are incentivized to upgrade, it is time to figure out how to migrate your existing applications.

The Definitive 1.2 Migration Guide

If you have made it this far, you are a serious JavaFX hacker!  This section covers the most common language, functionality, and API changes that you will encounter when migrating applications from JavaFX 1.1.  If you notice anything that is not covered, feel free to add it in the comments and I will update the guide as appropriate.

General:

• JavaFX 1.2 is not binary compatible – If you use any jars or third-party JavaFX libraries (such as JFXtras), they must be recompiled for the new release or you will get compilation errors.  Speaking of JFXtras, a new version which has been updated for JavaFX 1.2 is nearly ready, and will be announced here when it is complete!
• All internal-only APIs are broken – More details broken out by section below, but if you rely on any impl_ or com.sun packages, your code will definitely need to be updated.
• Linux and Solaris are now supported – This is more of a feature than a migration issue, but if you have users on multiple platforms you can now proudly state that Linux is supported.

Language Changes:

• No more variable shadowing in nested blocks – It previously was valid to name a variable the same in both the inner and outer block of an expression.  The variable in the inner block would simply replace the one in the outer.  However, this will throw a compiler error in JavaFX 1.2.  The fix is simple…  just use a different variable name.
• Use Mixins instead of Multiple Inheritance – JavaFX no longer supports multiple inheritance.  Instead you can extend one class and as many mixins as you like.  Mixins are like interfaces in Java, except they can have variables and implementations that are shared by all the classes that extend them.  The only change you have to make in your application to start using mixins is to add the mixin keyword when you define a new class like this:

public mixin class Resizable { /* variables and functions here */ }

• Commas are required in sequences – Sequences now require commas between elements (except those that end in braces).  This is a little less convenient, but actually a very good thing, because it avoids several language pitfalls that were hard to track down before.

Node Changes:

• Node.boundsInScene is gone – This was removed for performance reasons, fortunately there is an easy replacement that offers the same functionality:

node.localToScene(node.boundsInLocal)

• Node.focusable -> Node.focusTraversable – Small API change, but good to know when you get the compilation error on focusable not found.  This is part of a larger focus fix where any Node that is visible, focusTraversable, and not disabled will be eligible for focus (a key listener is no longer required).
• CustomNode.create() gets called before init – Previously the CustomNode create() method would get called after init and before postinit.  Now that it gets called even earlier than init, some of your code may not work correctly.  Make sure that any variables you are depending upon in the create() method are either initialized inline or have a bind declaration so they get updated once set.
• SwingControl.enabled -> Node.disable – There is a new disable flag on the Node class that is used universally across all controls to enable or disable them.  This conflicted with the old SwingControl.enabled variable, which has now been removed.
• Rectangle2D -> Bounds – All references to Rectangle2D have been changed to the new javafx.geometry.Bounds class, which may have a ripple effect through your code.

Layout Changes:

• min/max/pref -> getters – All of the Resizable methods (minimumWidth, minimumHeight, maximumWidth, maximumHeight, preferredWidth, preferredHeight) have been replace with function getters (getMinWidth, getMinHeight, getMaxWidth, getMaxHeight, getPrefWidth, getPrefHeight respectively).  The prefWidth/Height functions take an extra parameter, which is the amount of space in the opposite dimension.  This is very useful for doing height or width constrained layouts, such as Flows, but can be ignored by passing -1.
• impl_layoutX/Y -> layoutX/Y – The impl_layoutX and impl_layoutY methods have been replaced with official layoutX and layoutY variables.  It is recommended that you use these variables over translateX/Y if you are moving nodes into position.
• impl_requestLayout() -> requestLayout() – The requestLayout function has similarly moved from an internal to a public API.
• impl_layout -> doLayout() – Rather than having a function to set the layout on, you now override Parent.doLayout().
• Panel class added for declarative layouts – If you are looking for a functional alternative to Container, take a look at the new Panel class, which lets you set the layout declaratively.  It also has variables to override the default min/max/pref values without subclassing Container.
• New functions on Container to help with layouts – There are a whole slew of new functions on the Container class that make it easier to work with the new layout system.  Make sure to read through them, because they will both save you time and help you follow the best practices for layout design.
• Different transformation order – Previously the transforms[] variable allowed you to apply transformations included in the layoutBounds, while scaleX/translateX/rotate etc. were applied after layout.  Now both transforms[] and the transformation variables are calculated after layout uniformly.

Skin/Control Changes:

• Skin.scene -> Skin.node – The name of the Node on Skin has changed from scene to node, which helps reduce confusion with the Scene class.
• Skin.compute* methods removed – There were a series of computePreferredWidth/Height/etc. methods that were removed.  Instead you can directly use the getPrefWidth/Height/etc. methods on the Resizable class mentioned above.
• Skin is now abstract – The Skin class is now abstract, and required that you implement your own contains and intersects methods.  You can either do this by using the new JFXtras AbstractSkin class or using the following boilerplate code:

override function contains(localX:Number, localY:Number):Boolean {
    return node.contains(localX, localY);
}

override function intersects(localX:Number, localY:Number, localWidth:Number, localHeight:Number):Boolean {
    return node.intersects(localX, localY, localWidth, localHeight);
}

• New Behavior class – There is a new Behavior class that is meant to be used together with Control and Skin to provide reusable behaviors.
• TextBox.text -> rawText, TextBox.value -> text – There was some swizzling of variables on the TextBox class.  What used to be text changed to rawText, and value now has the same semantics text used to have.

Asynchronous Changes:

• RemoteTextDocument has been removed – Use HttpRequest directly instead.
• AbstractAsyncOperation has been removed – Use the new Task infrastructure instead for communcating with Java code running in a background thread.

Animation Changes:

• Transition.interpolate -> Transition.interpolator – A small name change to make room for a new interpolate flag that allows you to turn on or off interpolation altogether.
• Transition now extends Timeline - This is a welcome change, which makes it much easier to work with Transitions and Timelines together.  To support this change ParallelTransition and SequentialTransition now take a sequence of Timeliens.

Java Equivalent Functions:

• java.lang.Math -> javafx.util.Math – There is a new JavaFX math library, which is a drop-in replacement for the Java math library.  The main advantage of using the new JavaFX math library is that all functions are supported on mobile devices (including pow, log, etc.).
• java.lang.Properties -> javafx.util.Properties – Another class that is similar in functionality to the Java equivalent, but portable to mobile.  Be warned, however, that the JavaFX properties file format is not the same as the standard Java properties file format.

CSS Changes:

• CSS Update Defect (RT-4817) – Stylesheet updates no longer affect newly added Nodes due to a known defect.  In the meantime, you can do this to force a stylesheet refresh:

def senators = bind model.senators on replace {
    delete sceneRef.stylesheets;
    sceneRef.stylesheets = "{__DIR__}styles.css";
}

• CheckBoxSkin.textFill doesn’t accept styles (RT-4819) - The check mark will pick up the style you set, but the text won’t.  The workaround for now is to create a checkbox with empty text and add a text node beside it with the correct styling and event handlers.
• Can’t update the skin property of Control from CSS (RT-4820) – Another bug in the skin support.  You can set this in code instead for now.

Production Suite:

• UiStub -> FXDNode – UiStub has been replaced with FXDNode, which includes some extra functionality, such as backgroundLoading, and placeholder images.

Miscellaneous:

• Image.fromBufferedImage() removed – This has moved to SwingUtils.toFXImage().  Remember that if you use this function it will limit portability to mobile devices.
• Color.fromAWTColor() removed – Yet another AWT-ism that has been removed. The JavaFX Color class is pretty thorough, so there shouldn’t be any reason to work with AWT Colors.
• Duration.toDate is gone – As far as I know there is no equivalent functionality, but you can always get a duration’s value as a long and manipulate it directly.
• Different variable names for the Affine class – If you use the Affine class, then your code is likely to break due to the new, more descriptive, method names, but the functionality is the same.

Whew!  …that was quite a lot to take in.  If you are interested to read more about the JavaFX 1.2 release including the new controls, layouts, and other functionality, the best source is to checkout the Pro JavaFX book that Jim, Dean, Weiqi, and I are writing.  It is almost fully updated for the JavaFX 1.2 release, and is available in Alpha right now from the book website.

I want to give a special thanks to Richard Bair and Amy Fowler from the Sun JavaFX team for providing a lot of valuable information on the JavaFX 1.2 release along the way.

Happy hacking on JavaFX 1.2!