I would like to publicly extend my thanks and appreciation to the talented and diligent JavaFX Script Compiler team for achieving what I consider to be a tipping point in the project. In the last two days lots of compiled JavaFX Script features became functional, including many of the UI components, and much of the graphics functionality. It's just like Tom Ball (the JavaFX Script compiler project leader) predicted in his Elephants and the JavaFX Script Compiler blog post:
An elephant analogy came to me when I was recently grilled about exactly when the JavaFX Script compiler team will deliver our first milestone release. "I can't give you an accurate date," I said. "It's like pushing an elephant through a door*; until a critical mass makes it past the threshold you just don't know when you'll be finished. Once you pass that threshold, though, the rest happens quickly and in a manner that can be more accurately predicted."
From my perspective the elephant has made it past the threshold, so in honor of this I've developed a silly "elephant" example that demonstrates some of the features that have become functional in the past couple of days. Here's a screenshot, followed by the code. Please compile and run this example (see the Obtaining the JavaFX Compiler post), and I'll finish up this post by pointing out the differences from interpreted JavaFX Script.
/*
* ElephantInTheDoor.fx - A Compiled JavaFX Script example to congratulate
* the JavaFX Script compiler team for their talented
* and tireless efforts in "pushing the elephant through the door"
*
* Developed 2007 by James L. Weaver (jim.weaver at lat-inc dot com)
* to serve as a JavaFX Script example.
*/
import javafx.ui.*;
import javafx.ui.canvas.*;
class ElephantModel {
attribute color:Color = Color.LIGHTGREY;
}
var model =
ElephantModel {
};
Frame {
title: "The Elephant is Through the Door"
width: 400
height: 300
background: Color.WHITE
visible: true
menubar:
MenuBar {
menus: [
Menu {
text: "View"
items: [
MenuItem {
text: "Message..."
action:
function() {
MessageDialog {
title: "Message to JavaFX Compiler Team"
message: "Congratulations from the OpenJFX Community for
pushing the Elephant Through The Door!"
visible:true
};
}
}
]
},
Menu {
text: "Help"
items: [
MenuItem {
text: "About..."
action:
function() {
MessageDialog {
title: "About this Silly Elephant Example"
message: "Developed 2007 by James L. Weaver
(jim.weaver at lat-inc dot com)
to serve as a JavaFX Script example.
Elephant graphic by Deb Harper."
visible:true
};
}
}
]
}
]
}
content:
BorderPanel {
right:
Box {
orientation: Orientation.VERTICAL
content: [
Button {
text: "Grey"
action:
function() {
model.color = Color.LIGHTGREY
}
},
Button {
text: "Pink"
action:
function() {
model.color = Color.PINK
}
}
]
}
center:
Canvas {
content: [
Group {
content: [
Circle {
cx: 180
cy: 80
radius: 40
fill: bind model.color;
stroke: Color.GREY
strokeWidth: 10
},
Circle {
cx: 60
cy: 80
radius: 40
fill: bind model.color;
stroke: Color.GREY
strokeWidth: 10
},
Circle {
cx: 120
cy: 80
radius: 50
fill: bind model.color;
stroke: bind model.color;
strokeWidth: 2
},
Circle {
cx: 100
cy: 70
radius: 8
fill: Color.GREY
stroke: bind model.color;
strokeWidth: 2
},
Circle {
cx: 140
cy: 70
radius: 8
fill: Color.GREY
stroke: bind model.color;
strokeWidth: 2
},
Line {
x1: 105
y1: 90
x2: 105
y2: 128
stroke: Color.GREY
strokeWidth: 5
},
Line {
x1: 135
y1: 90
x2: 135
y2: 128
stroke: Color.GREY
strokeWidth: 5
},
Arc {
x: 15
y: 65
height: 120
width: 120
startAngle: 270
length: 90
closure: ArcClosure.PIE
stroke: Color.GREY
fill: bind model.color;
strokeWidth: 5
},
Arc {
x: 45
y: 95
height: 60
width: 60
startAngle: 270
length: 90
closure: ArcClosure.PIE
stroke: Color.GREY
fill: Color.WHITE
strokeWidth: 5
},
Line {
x1: 75
y1: 130
x2: 75
y2: 150
stroke: Color.WHITE
strokeWidth: 5
},
Line {
x1: 110
y1: 125
x2: 130
y2: 125
stroke: bind model.color;
//fill: bind model.color;
strokeWidth: 5
},
Line {
x1: 75
y1: 125
x2: 100
y2: 125
stroke: Color.WHITE
strokeWidth: 5
}
]
}
]
}
}
}
Differences from Interpreted JavaFX Script
There are very few differences between this compiled JavaFX Script example and how it would be written in interpreted JavaFX Script. They are:
- Compiled JavaFX Script uses static (class) variables to represent constants (e.g. Color.RED).
- Compiled JavaFX Script allows attribute initialization in the same statement as the attribute's declaration (e.g. attribute color:Color = Color.LIGHTGREY;).
- Operations and functions have been combined in compiled JavaFX Script, so each action attribute of the menu items and buttons are assigned an anonymous function, not an anonymous operation.
- The compiled version is stricter about not using an object where a sequence is required. For example, it is now necessary to use square brackets to enclose the body of the content attribute of the Canvas instance This is because the content attribute expects a sequence of Node objects (or a subclass like the Group object in this example).
As always, if you have any questions, please post a comment.
Regards,
Jim Weaver
JavaFX Script: Dynamic Java Scripting for Rich Internet/Client-side Applications
Immediate eBook (PDF) download available at the book's Apress site
rabinovic,
That problem must have crept into the compiler, as I'm experiencing the same thing. I'll file an issue.
Thanks,
Jim Weaver
Posted by: Jim Weaver | January 17, 2008 at 05:25 PM
why does strokeWidth still remain 1? I have used all compiler build and still doesn't work??
Posted by: rabinovic | January 17, 2008 at 04:06 PM
Excellent, Alex! Compiled JavaFX Script capabilities are getting exciting now!
Posted by: Jim Weaver | December 06, 2007 at 08:09 PM
Thanks, Jim
It works now!!!(with yr linked new build)
Posted by: AlexChang | December 06, 2007 at 08:05 PM