We are currently working on making some changes in DIF. Soon we'll have candy for you all! Check back for news!

Flex Bindings in AS3 Projects

Posted: July 29th, 2008 | Author: Tiago Bilou | Filed under: Actionscript3, Tutorial |

Since 99.9% of the work we do is Flash, we pretty much use flex builder to develop Actionscript Projects. One of the things I really wanted to have was bindings. Here's how to use Flex Bindings in Actionscript only projects.

Remember that the Flash framework (textfields, movieclips, sprites, etc) doesn't dispatch the data-binding event. This means that pretty much the only things you can bind are variables.

Make sure you add the flex framework.swc to your project Library Path to have access to the mx.binding.util class.

ChangeWatcher:

Acts like the watch on AS2. It watches a variable for changes and when something happens fires an event. Make sure you call the canWatch to ensure that you can watch it!

There are 3 ways to specify the second parameter, the chain.

  1. A String containing the name of a public bindable property of the host object.

    ChangeWatcher.watch(this, "myvar", handler)

  2. An Object in the form: { name: property name, access: function(host) { return host[name] } }. The Object contains the name of a public bindable property, and a function which serves as a getter for that property.

    ChangeWatcher.watch(this, { name:"myvar", getter: function():String { return "something" }}, handler);

  3. A non-empty Array containing any combination of the first two options. This represents a chain of bindable properties accessible from the host. For example, to watch the property host.a.b.c, call the method as: watch(host, ["a","b","c"]

BindingUtils.bindProperty

Works pretty much the same way as the watch, but instead of having to handle and event it allows you to immediately bind two properties one-way.
The first two parameters are for the the target, the second parameters are the triggers.

BindingUtils.bindProperty( this, "va1", this, "var2");

you can also use the same syntax for the chain.

References:

Language References
Another Tutorial

12 Comments on “Flex Bindings in AS3 Projects”

  1. 1 smith said at 12:07 pm on July 29th, 2008:

    Can you please give some example code to demo?

    Cheers

  2. 2 Steve said at 1:22 pm on July 29th, 2008:

    Seconding the request to look at some working example code. Cheers!

  3. 3 Scott said at 2:03 pm on July 29th, 2008:

    Very interesting. I was wondering if there was a way to do this. Thanks for posting. Could you post an example using this code?

  4. 4 Tiago Bilou said at 3:23 pm on July 29th, 2008:

    I needed to have an application that would change it’s language dynamically at runtime. This meant replacing all the textfields texts.
    I developed a class that binds the strings (tokens) to the textfields. When the user switches the language button the binded variable points to another array of tokens and all the textfields change.

  5. 5 Shinchi said at 4:00 pm on July 29th, 2008:

    Will that add to the SWF size? Just wondering

  6. 6 Tiago Bilou said at 5:38 pm on July 29th, 2008:

    I would say yes, because you are including a couple of function from the flex framework. It shouldn’t be much though

  7. 7 Pod sosnami said at 8:56 pm on August 19th, 2008:

    Great job, interesting interview. Thank you.

  8. 8 James said at 9:50 am on September 18th, 2008:

    Hi, I found your blog on this new directory of WordPress Blogs at blackhatbootcamp.com/listofwordpressblogs. I dont know how your blog came up, must have been a typo, i duno. Anyways, I just clicked it and here I am. Your blog looks good. Have a nice day. James.

  9. 9 Idoru said at 11:30 am on September 23rd, 2008:

    Thx james :)

  10. 10 Billigflug said at 12:16 pm on December 16th, 2008:

    It ´s very interesting and like Scott I was wondering if there was a way to do that.
    I have to accept that I have many problems with applications and such a things. But it’s really nice to find any response to any problem we have in internet. These kind of blogs schould stay forever!!!
    Thanks for the post!

  11. 11 Garten said at 7:57 pm on February 20th, 2009:

    This is great! I encourage you to check out bumpslide, David Knape’s AS3 framework which includes a bindable model for pure AS3 projects…

  12. 12 Gummistiefel said at 10:24 pm on June 4th, 2009:

    I would also like to say that I am quite interested in the code you’ve described here, as it may be relevant to a project I’m working on myself. As such, if it’s not too much trouble, I’d also like to be informed and/or see it in action myself whenever you get the chance to make it available.
    Thanks in advance.

Leave a Reply