Data binding in Silverlight and Flex compared to JavaFX 1.0...

Silverlight

Flex

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
                }]
             }]
        }
    }
}
Comments:

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 03: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 28, 2008 at 04:06 PM 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 28, 2008 at 06:26 PM 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 28, 2008 at 07:02 PM PST #

surikov, your example is very nice, sincerely.
is crudFX home made ? I'm impressed because it sizes 5Mb !

Posted by naysayer on December 28, 2008 at 09:31 PM 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 28, 2008 at 10:39 PM 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 01: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 03: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 03: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 04:48 AM 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 06:14 AM 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 06:42 AM PST #

You should embed these examples as JavaFX applets.

Posted by KPI on December 29, 2008 at 08:39 AM PST #

Simple and Nice example !

Posted by Vaibhav Choudhary on December 29, 2008 at 01:09 PM PST #

Tool

Posted by Anthony Rogers on December 29, 2008 at 07:56 PM 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 29, 2008 at 11:51 PM 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 05:42 AM PST #

How do you unbind or rebind in JavaFX ?

Posted by Josselin Lebret on January 04, 2009 at 08:06 PM 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 05:51 AM 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 01: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 02: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 01, 2009 at 09:46 PM PDT #

Simple and Nice example !

Posted by SGK Prim on May 12, 2009 at 12:43 AM PDT #

http://www.Sohbetizm.Net
thank you very Much. very good Page.

Posted by çet on May 17, 2009 at 09:19 PM PDT #

http://www.smsmatbaa.com

Posted by matbaa on June 22, 2009 at 02:59 AM PDT #

Simple and Nice example !

Posted by Key Ödemeleri on October 11, 2010 at 07:58 AM PDT #

Simple and Nice example !

Posted by Key Ödemeleri on October 11, 2010 at 07:59 AM PDT #

Merci >> thanks

Posted by شات مصري on December 04, 2010 at 07:54 PM PST #

Simple and Nice example !

Posted by شات on December 04, 2010 at 07:54 PM PST #

Simple and Nice example !

Posted by دردشة on December 04, 2010 at 07:55 PM PST #

Simple and Nice example !

Posted by دردشة مصرية on December 04, 2010 at 07:55 PM PST #

Hm impressive bro..

Posted by Egitim on December 11, 2010 at 05:12 AM PST #

Simple and Nice example !

Posted by شات on December 15, 2010 at 03:29 AM PST #

aaaqq

Posted by منتدى نسائي on February 03, 2011 at 08:57 AM PST #

Post a Comment:
  • HTML Syntax: NOT allowed
About

user12610627

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today