Chris Oliver's Weblog
- All
- F3
- JavaFX
- Programming
- Research
Data binding in Silverlight and Flex compared to JavaFX 1.0...
Don't be fooled by the naysayers and the hype.
Although JavaFX 1.0 is only a few days old, when it comes to data binding: functionality-wise, usability-wise, and performance-wise it appears to me it's already "no contest".
I invite you to judge for yourselves.
For those who've never actually tried JavaFX script, let me just say this: any JavaFX script variable may be bound to any expression of any complexity (including function calls, Java method calls, loops, conditional expressions, block expressions, etc).
In case you haven't seen one, below is a very simple JavaFX 1.0 example. Here, the degrees variable is (bidirectionally) bound to a slider and simultaneously to the content of a text node. Meanwhile, the x and y variables are bound to expressions that compute the coordinates of the point corresponding to such an angle on a circle of the given radius. Besides the slider and the text, the stage contains two circles, a red one with the given radius, and a small blue one whose center is bound to the above point. As a result, moving the slider animates the blue circle around the red one.
import javafx.stage.*;
import javafx.scene.*;
import javafx.scene.shape.*;
import javafx.scene.text.*;
import javafx.scene.text.TextOrigin.*;
import javafx.scene.paint.Color.*;
import javafx.scene.layout.*;
import javafx.ext.swing.*;
import java.lang.Math.*;
def radius = 50.0;
var degrees = 0;
var radians = bind toRadians(degrees);
var x = bind cos(radians) * radius;
var y = bind sin(radians) * radius;
Stage {
title: "Binding"
scene : Scene {
width: 400
height: 260
content:
VBox {
translateX: 100
translateY: 80
spacing: 10
content:
[SwingSlider {
minimum: 0
maximum: 360
value: bind degrees with inverse
},
Text {
textOrigin: TOP
content: bind "{degrees} degrees"
},
Group {
translateX: radius
translateY: radius
content:
[Circle {
fill: RED
radius: radius
},
Circle {
radius: 10
fill: BLUE
centerX: bind x
centerY: bind y
}]
}]
}
}
}
Posted at 06:29PM Dec 28, 2008 by Christopher Oliver in JavaFX | Comments[26]
I agree JavaFX data binding is awesome, but did you try to write a real application ? How do you draw a table with JavaFX ?
Posted by naysayer on December 28, 2008 at 11:37 PM PST #
I have to agree with the previous comment. JavaFX is great speaking from a technical viewpoint. At this moment, it's also great for creating "fun" applications that look awesome, do some animations and so on.
For "boring" applications that require a lot of data entry and displaying data it lacks support for decent standard components however.
Posted by Paul Bakker on December 29, 2008 at 12:06 AM PST #
another usefull example of binding
http://translate.google.ru/translate?hl=ru&ie=UTF-8&u=http%3A%2F%2Fsergeysurikov.blogspot.com%2F2008%2F12%2Fbinding.html&sl=ru&tl=en&history_state0=
my old example of boring office application
http://java.dzone.com/tips/javafx-and-jdbc
updated for new SDK version coming soon
Posted by surikov on December 29, 2008 at 02:26 AM PST #
Just one question: What's so cool with your app? A _picture_ of a slider and two coloured circles? If it at least was interactive so one could move the blue circle around...
Posted by Thommy M. on December 29, 2008 at 03:02 AM PST #
surikov, your example is very nice, sincerely.
is crudFX home made ? I'm impressed because it sizes 5Mb !
Posted by naysayer on December 29, 2008 at 05:31 AM PST #
crudfx is a old version for JavaFX interpreter. Look to article date.
It incledes application + runtime for old JavaFX. New version coming soon
Posted by surikov on December 29, 2008 at 06:39 AM PST #
See the JFXtras open-source project that helps fill in some of the gaps of the JavaFX 1.0 Release (to help with the "boring projects"). It includes support for Dialogs, Grid Layouts, Unit Testing, and an Asynchronous Worker class:
http://code.google.com/p/jfxtras/
Regarding how to draw a table with JavaFX, see:
http://learnjavafx.typepad.com/weblog/2008/08/tablenode-creat.html
That is part of a series (written using JavaFX 1.0 Preview) that is currently being converted to JavaFX SDK 1.0 and is part of a series that teaches how to build custom UI elements in JavaFX:
http://learnjavafx.typepad.com/weblog/jfx_custom_nodes/
Things are beginning to move fast for the support of "boring" application, which by the way, don't have to be boring if we use the rich 2D capabilities of JavaFX. On a related note, I think that we as software developers/graphic designers should define a set of style guidelines for Enterprise RIAs (analogous to the Web 2.0 guidelines that have evolved). Please feel free to read and respond to the following article that I posted on JavaLobby a few days ago, on December 23, 2008:
http://java.dzone.com/articles/should-there-be-enterprise-ria
HTH,
Jim Weaver
JavaFXpert.com
Posted by Jim Weaver on December 29, 2008 at 09:09 AM PST #
Uh, I assumed it was clear the above was intended to demonstrate a point about programming that is intelligible to a casual reader - not to demonstrate how to build an application - whether "boring" or "cool"
Posted by Chris Oliver on December 29, 2008 at 11:24 AM PST #
I'm not clear on how this is better than Silverlight, where you can bind to any Property. Since Properties can act like variables or functions and include aribtrary code, where is the edge that JavaFX has?
Posted by Chase Saunders on December 29, 2008 at 11:44 AM PST #
I just wanted to say that I too believe that the technology behind JavaFX is superior to Flex and Silverlight at many points. It's just too bad that, even with the great technology there, it's still not usable for all types of applications that it could be usable for. It will just be a matter of time of course. And projects like JFXtras will help a lot in that process :-)
Posted by Paul Bakker on December 29, 2008 at 12:48 PM PST #
@Chase Saunders
Hmm, I thought it was pretty clear....
Well, here's the tip of the iceberg for you:
In JavaFX script any variable of any type can be bound by any expression. The
binding expression language in Silverlight is degenerate compared to this.
Silverlight relies on DataContexts, which must have a structural relationship
to the visual scene graph - which is completely wrong. By contrast, in JavaFX
script the mapping from a non-visual data model to visual elements is
unrestricted.
Finally, would you rather write:
public
static readonly DependencyProperty FillProperty;
public
Brush Fill
{
get { return (Brush) this.GetValue(FillProperty); }
set { base.SetValue(FillProperty, (DependencyObject) value); }
}
or simply:
public var fill: Paint;
Posted by Christopher Oliver on December 29, 2008 at 02:14 PM PST #
Simple if you know/took Trig! :)
A little googling and I was able to catch up. Honestly, it being pretty simple helped
Posted by Mark on December 29, 2008 at 02:42 PM PST #
You should embed these examples as JavaFX applets.
Posted by KPI on December 29, 2008 at 04:39 PM PST #
Simple and Nice example !
Posted by Vaibhav Choudhary on December 29, 2008 at 09:09 PM PST #
Tool
Posted by Anthony Rogers on December 30, 2008 at 03:56 AM PST #
Thanks for the follow up. I'm still not sure you can do anything with JavaFX that you can't do in Silverlight, but the Silverlight syntax sure is ugly. I haven't looked at Silverlight binding in detail, but when looking at other MS data binding solutions I'm usually impressed by their capabilities but scared off by the PITA abstractions. So this would be par for the course. It seems like one could easily write a Silverlight wrapper using lambda expressions that offers roughly equivalent ease and syntax; I wonder why MS didn't do this?
Posted by Chase Saunders on December 30, 2008 at 07:51 AM PST #
Hi Chris,
10x for blogging again ...
It will be interesting to consider to create (and advertise) some JavaFX counterparts for more interesting examples already developed to compare (& vote for) Silverlight & Flex that you can find here:
Shine Draw
http://www.shinedraw.com/ +
Shine Draw gallery/examples
http://www.shinedraw.com/flash-vs-silverlight-gallery/
Posted by El Cy on January 04, 2009 at 01:42 PM PST #
How do you unbind or rebind in JavaFX ?
Posted by Josselin Lebret on January 05, 2009 at 04:06 AM PST #
A common scenario with Flex or JSR295 is to have a a two way binding to an attribute of an attribute of an object. Expressions like {$certainTable.selectedItem.name} allow for quick creation of CRUD interfaces - and quick CRUDs are what made FLEX and Ruby on Rails so popular and loved.
As far as I understand (and I really hope to be proven wrong) JavaFX does not support such scenario. If I try and bind like this:
SwingTextField {
text: bind currentlySelectedPerson.name with inverse
}
the text will get the reference to the object that was held in currentlySelectedPerson at the time of the binding creation (quite logical, but also quite useless). I was hoping that the effect I had required could be achieved by placing currentlySelectedPerson.name in a block, like so:
text: bind {currentlySelectedPerson.name} with inverse
but it turns out that inverse binding is not possible for blocks. Which is also logical, but frustrating.
Currently it seems to me that there is no way to change the source reference in a binding with an inverse in an elegant way. If this is really the case, JavaFX binding is, sadly, less usable than Flex and JSR295.
Realizing the above made me quite depressed a couple of days ago (I'm always too emotionally invested on technology) - but maybe there is some sound workaround? What is the javafxish way to deal with scenarios like "an edit form bound to the selected element of a grid"?
Posted by Filip Dreger on January 06, 2009 at 01:51 PM PST #
Filip,
If that doesn't work, it's a compiler bug. Please report it.
F3 didn't have such bugs or limitations, and (in time) JavaFX script won't either.
At a minimum any bijective expression should be bindable.
http://blogs.sun.com/chrisoliver/entry/bidirectional_binding
Posted by Chris Oliver on January 06, 2009 at 09:28 PM PST #
Thanks for the blog, Oliver.
Yes, what you show is sweetness.
I do wonder about how to incorporate the concept of commit or at least rollback of the binding?
Say I have a value in a TextField that was created by binding it to a variable. Say I change the value in the TextField in the GUI, but then want to roll back to the original variable value. As in an undo feature.
Is this currently do-able or am I missing something?
Or, are we already to far down the current binding path to make that viable?
Steve
Posted by Steve G. on January 29, 2009 at 10:27 AM PST #
depressed a couple of days ago (I'm always too emotionally invested on technology) - but maybe there is some sound workaround? What is the javafxish way to deal with scenarios like
Posted by توبيكات on May 02, 2009 at 04:46 AM PDT #
Simple and Nice example !
Posted by SGK Prim on May 12, 2009 at 07:43 AM PDT #
http://www.Sohbetizm.Net
thank you very Much. very good Page.
Posted by çet on May 18, 2009 at 04:19 AM PDT #
http://www.smsmatbaa.com
Posted by matbaa on June 22, 2009 at 09:59 AM PDT #
http://www.ms-ms.net
http://www.ms-ms.net/vb
http://www.ms-ms.net/dalel
http://www.ms-ms.net/up
http://www.ms-ms.net/games
http://www.ms-ms.net/video
http://www.ms-ms.net/topics
Posted by دردشه on July 03, 2009 at 06:28 PM PDT #