Computer programming is tremendous fun. Like music, it is a skill that derives from an unknown blend of innate talent and constant practice. Like drawing, it can be shaped to a variety of ends—commercial, artistic, and pure entertainment. Programmers have a well-deserved reputation for working long hours, but are rarely credited with being driven by creative fevers. Programmers talk about software development on weekends, vacations, and over meals not because they lack imagination, but because their imagination reveals worlds that others cannot see.
—Larry O’Brien and Bruce Eckel
JavaFX provides a rich set of capabilities for building applications that lets you create immersive user interfaces that go beyond what you can accomplish with traditional UI toolkits. However, it does not stop there, because by sitting on top of the Java language, you can also take full advantage of all the languages and tools that have been developed for the Java platform. Also, JavaFX comes with its own UI declaration language written in XML, which is quite powerful in its own right.
In this topic we show how you can leverage different languages and markup to create great-looking JavaFX user interfaces with less code. The wonderful thing about all the languages and capabilities discussed in this topic is that it is your choice. You can continue to build JavaFX applications in pure Java using the imperative or builder style, or you can take advantage of your favorite JVM language. Who knows, you may even become a convert to one of the languages discussed in this topic based on its usage for JavaFX alone.
To give you an idea of the power and expressiveness of using different JVM languages, we start out by taking a simple example and showing it in six different representations. The example is an extension of the Colorful Circles application designed by Jasper Potts from the JavaFX team. It is a great example of shapes, animation, and effects in a very small amount of code, and we have adapted it to show binding and interactivity as well.
The running Vanishing Circles application is shown in Figure 10-1.
Figure 10-1. The Vanishing Circles application demonstrating JavaFX effects, animation, and interaction
Vanishing Circles in Java
To start with, let’s show the code in standard Java imperative style. This is the most verbose way of writing JavaFX code, but it is also the most straightforward for anyone familiar with the Java programming language and earlier UI toolkits such as Swing. The full code listing for writing this example is shown in Listing 10-1.
Listing 10-1. Vanishing Circles Application Written in Imperative Java Style
Although the code is fairly easy to understand, it is also quite verbose at 40 lines and 1,299 characters, excluding imports. The basic functionality can be summarized as follows.
• Fifty circles of varying colors are overlaid with a transparent fill.
• Those circles are animated in a semirandom pattern around the window.
• When the mouse hovers over a circle, the circle gets surrounded by a white border.
• Upon clicking a circle, it slowly shrinks and vanishes.
In a very short amount of code this lets us demonstrate many different JavaFX features, including shapes, effects, animation, binding, and event listeners. In the next few examples we convert this exact application to several different languages and representations, letting you see how these features vary in each of the choices available to you.
First, let’s convert this code to use the JavaFX builders. This allows for a more fluent API, but also comes with its own boilerplate that is required to do this pattern in Java. As a result, it can sometimes take more code to produce the same result; however, you gain some additional expressiveness in the process. This is also a great segue into other languages, such as Groovy, where we can take advantage of the same builder pattern without the boilerplate required to do this in Java.
The builder version of the Vanishing Circles application is shown in Listing 10-2.
Listing 10-2. Vanishing Circles Application Written in JavaFX Builder Style
At 51 lines and 1,285 characters, the character count for the builder pattern is slightly less than that of the earlier imperative style, whereas the line count is actually higher. The main advantage of using the builder pattern is that it allows you to nest the UI elements in a hierarchy matching the UI scene graph, which at a quick glance makes it much easier to understand what the code will produce.
In practice, you will probably find a mix of the imperative and builder styles to be the best choice. Notice that we did not bother using builders for the Color or BlurEffect, because the constructors were much more concise and the number of arguments was reasonable. Also, due to the present lack of closures in Java, it is difficult to construct nested iterating structures, which forced a certain style of construction. Similarly, it was not possible to create the binding in the builder clause; however, most other JVM languages have closures and other advanced language features that get around these limitations in the builder syntax.
Vanishing Circles in Alternative JVM Languages
Now we move on to different JVM languages and show what is possible by using Groovy, Scala, and Visage. For the first two languages we make use of an inner domain-specific language (DSL) written on top of the JavaFX APIs. Visage requires no DSL, because it is a language specifically designed for writing UIs, so it has built-in features that mirror what you would want a DSL to show.
Groovy is a great choice for those getting started with JVM languages, because its syntax most closely matches the Java language. In fact, with a few minor changes all Java programs are also valid Groovy programs! However, to get the full advantage of the language features in Groovy you need to make use of a DSL written for your target use case, such as GroovyFX. GroovyFX is an open source project that lets you write JavaFX code in the Groovy language that looks like the code in Listing 10-3.
Listing 10-3. Vanishing Circles Application Written in Groovy Using the GroovyFX DSL
This GroovyFX code has the same functionality as the earlier JavaFX examples, but is significantly shorter and more expressive. The GroovyFX version of the Vanishing Circles application is only 29 lines and 671 characters, which saves you 639 keystrokes from the initial Java version. Also, as your application grows you will get even more benefit from using a DSL such as this, allowing you to write more complex and feature-rich applications with less code.
Some of the Groovy language features that this code takes advantage of include:
• Groovy Builder Pattern: Groovy makes it particularly easy to build powerful and concise builder code, as demonstrated with the GroovyFX SceneGraphBuilder.
• Name Parameters: Remembering the order of arguments to methods and constructors with long argument lists is hard, but named parameters allow you to be explicit and change the order for your convenience.
• Class Extension: Groovy allows you to add new methods and functionality to existing classes, as demonstrated by the creation of duration objects with syntax 40.s where "s" is a method on integers.
• Closures: The event handlers are greatly simplified by creating anonymous single method interface extensions via closures.
All of this contributes to a very concise and readable syntax with very little boilerplate code. We dig into the features of how each of the JavaFX features translates to Groovy syntax in the later section entitled, "Making Your JavaFX Groovy."
The second JVM language we cover is Scala. It provides a lot of the same benefits as Groovy, but has the additional benefit of being fully type safe. This means that the compiler will catch bugs and type errors before you even run your application, which can be a huge boon to productivity, and shorten your development and testing cycle.
Again, we take advantage of an inner DSL written in the Scala language called ScalaFX, which is another open-source project that provides a full wrapper library for the JavaFX 2.0 APIs. The code listing for the Vanishing Circles application written using ScalaFX is shown in Listing 10-4.
Listing 10-4. Vanishing Circles Application Written in Scala Using the ScalaFX DSL
The ScalaFX code above is four lines longer than the Groovy code at 33 lines; it is only 591 characters, saving you an additional 76 keystrokes.
The Scala example makes use of an object literal pattern for constructing the scene graph, which gives the same benefits as the Java and Groovy builders. It also benefits from the powerful binding support that is built into the ScalaFX libraries. Some of the Scala language features that this code takes advantage of include:
• Operator Overloading: Scala lets you overload the existing operators and create entirely new ones. This is used in several places, including the bind and animation syntax.
• Implicits: Scala’s answer to class extension is via the implicit conversions. This makes it possible to extend the JavaFX API classes with convenience methods for object literal construction, giving you all the power of builders with the core classes.
• Closures: Scala also supports closures, which makes event handlers much more concise, and allows powerful looping constructs such as the for…yield syntax.
• DSL-Friendly Syntax: The usual code punctuation, such as dots and parentheses, is optional in most situations, making it possible to build fluent APIs that read like language keywords.
Although the code ends up being fairly short and easy to understand, there is quite a bit of depth to the Scala language. We show how you can take advantage of some of the built-in features of Scala to further improve your applications in the section entitled, "Scala and JavaFX."
The final language we explore is called Visage. It is the successor to JavaFX Script, which was the language in which all JavaFX applications were written prior to version 2. As a result, its syntax is ideal for expressing UI applications and it integrates seamlessly with many of the JavaFX 2 platform features, such as binding, observable sequences, and animation. The code for the Vanishing Circles application written in the Visage language is shown in Listing 10-5.
Listing 10-5. Vanishing Circles Application Written in the Visage UI Language
At 35 lines and 487 characters, this is the shortest of all the DSLs available to write your JavaFX application, which should not be a surprise inasmuch as this was a language written specifically for JavaFX. Also, Visage comes with direct support for accessing the JavaFX APIs as well as a very efficient compiled bind capability, giving you the best performance possible from a JVM language. Some of the Visage language features that we are taking advantage of include the following.
• Object Literal Syntax: Visage has a native syntax for creating hierarchical user interfaces, including auto-flattening sequences and built-in for comprehensions that make it easy to build complicated UI elements inline.
• Compile Bind Support: Binding is an API feature in JavaFX 2.0, however, Visage retains the elegance and performance of bind support built into the language.
• Closures: As do Groovy and Scala, Visage also supports closures, which lets you simplify your event listeners.
• Animation Syntax: Visage has a custom animation syntax that makes it easy to create timeline-based animations, but sits on top of the JavaFX animation subsystem.
As you have seen, using a domain-specific language to write your JavaFX code can produce significant benefits over what you would have to write in Java using either the imperative or builder styles. Also, because all of these languages sit on top of the same underlying JavaFX APIs, they have the same functionality as applications written in pure Java. Therefore, the choice is yours as to which language you want to use to write your JavaFX applications.
In the next few sections we go into each of these three languages in more detail to help you get started with developing your JavaFX applications using them. Also, it is possible to use virtually any JVM language to write JavaFX applications with, so if you have a favorite language that is not listed here, it is worth a try!
