Monday, May 19, 2008

Overview of JavaFX Script - TS-5152

These are the tidied up notes I took from the session at the JavaOne 2008 conference in San Francisco, California. There may well be mistakes and ommissions. I will come back and correct them once the conference has completed. However my first priority is to get the information published before the backlog gets too large and swamps me. All comments welcome. Enjoy!

Christopher Oliver, Sun Microsystems

F3 - express GUI's

Learn the lessons from natural language - make JavaFX Script expressive:
- There are rules but also irregularities
- There are function words
- Have both imperative (e.g. java) and declarative (express propositions about the world - functional) moods

... and from existing programming languages:
- Be concise - hit a mark somewhere between verbose (COBOL) and obscure (APL)
- Performance - Mediate between the needs of us and of the machine.
- Be imperative (the C family has won the familiar syntax war - play with the winner)
- But also borrow from declarative languages as well - both functional and niche languages (such as SQL, HTML, XPath/XQuery)
- Finally there is no pre processor so there can be no DSLs and no operator overloading. This means I can read the code no matter who wrote it. This avoids the "Tower of Babel" problem

The Compiler:
- It's OSS -
- It's built on javac
- It has similar command line tools - javafxc, javafx, javafxdoc - These are analagous to Java CLI tools

FX Script Features:
- It is integrated with java (so all your java APIs are available to you)
- It is Object Oriented - this allows you to look at the world from the point of view of specific objects - from the 1st person perspective. Otherwise code is from a third person perspective
- It also provides closures & first class functions - borrowed from ECMA script
- There is also multiple inheritance - I may inherit from 1 java class & multiple Java interfaces OR multiple JavaFXScript classes (but no Java classes)
- It has both an imperative and declarative syntax
- It is statically typed (which will provide obvious IDE benefits)
- The concept of time is a first class type with memes provided to manage changes over time such as key frame animation (but without a dependency on graphics - this is used to manage state changes over time)

Declarative Syntax:
- It is an expression language - all constructs are expressions (like Ruby)
- Object literals - this is similar to javascript object literals but FXScript is statically typed. Therefore I can do things like: rectangle { x:10 y:10 }
- This allows me to specify an object graph / document tree declaratively and also in the proper place in the conceptual framework rather than a sequence of instructions out of line (as happens with Java)
- It also has a block expression - {} - delimited with sub expressions seperated by semi colons. It can contain any number of expressions within it. The last expression is the return value of the block. Blocks can be nested.

- There are no arrays but FXScript has a construct called a sequence (which contains obejcts but sequences are not objects themselves). They are mutable. sequence comprehension (c.f. set comprehension) allows them to be generated from other sequences. The chosen syntax is like a 'for' loop
- The 'slice' function allows me to obtain a sub range of a sequence
- There are also range expression like in Ruby ([1..4])
- Also literals are declared in [] and seperated with ','

NOTE: Strings can add curly brace contained expressions which are evaluated into the string result (c.f. Ruby). You can do this to tag things to be internationalised / localised - no resource bundle / formatting pain...

- Now we have a declarative language to express a language graph (a scene is comprised of a set of GUI elements) how do we express dynamic elements? Bindings allow you to attach a dynamic expression to change values references in an expression and update object properties. Whenever something is modified, the bound values will be updated automatically
- Bound Function - can be used to create reusable code
- An unbound function is just a procedure like in Java - you can still use them in functions but variable changes dont trigger re evaluation
- A bound function - the return value of the return function, all variables in the closure will trigger it to be re evaluated. No void expressions, no loops, etc.

- We have a conceptual line, with bound functions which extrapolate values from the features of the line (e.g. length, centrepoint). Some of these depend on other bound functions
- We firstly create the line, and then create the visual properties which depend upon the line. If we change one of the attributes of the line the visual elements will be automatically be updated
- NOTE: a group is a non visual scene graph node which creates a co ordinate space for the elements contained

Imperative Syntax:
- This is like java - if statements, while loops etc.
- There are also unbound functions
- And void expressions - which allow you to express procedural code
- NOTE: JavaFX Script objects are mutable, NOT immutable
- What about sequence modification? - the 'insert' and 'delete' keywords borrowed from SQL for insertion and deletion. Lesson from natural languages
- There are also triggers - Remember your program is about handling cause and effect; your program must handle change. There are already declarative bindings to link one object to another (like the Observer pattern). We can also respond in a procedural way, so if something happens (a trigger) 'on replace' then fires off some procedural function. The body of triggers are void block expressions. There was a change and this is executed to make a further change based on this triggering change

Key Frame Animation:
- This is another mechanism to manage state changes.
- Just to do with object state.
- element: timeline, element: keyframe
- set of states represented as variables 9at a certain time the variable had a certain value. when I run the timeline, at the instance of the keyframes the variables will be assigned the specified values.
Time literatls ('s' is seconds, 'ms' is millis)
[Keyframe {
values: [angle => 0, ...
[Keyframe {
values: [angle => 2, ...

- The tween operator - will animate the gaps in the timeline

- Do you support generics? No, there is no support yet in JavaFX Script

No comments: