Home > Uncategorized > Different ways of Data Binding in Flex / Air / Action Script / Flash

Different ways of Data Binding in Flex / Air / Action Script / Flash


Data Binding in Flex is very easy to use and highly code optimized for binding class. Binding means reflecting one or more output/object properties instantly from the source, when the source is changing.

Data binding can be done in many ways:
  1. {} in mxml
  2. <mx:Binding> tag in mxml
  3. BindingUtils class
  4. ChangeWatcher class
  5. good old event listene

Types of Data Binding

using mxml tag in flex

< mx: Bindable Source=”SourceAsObject.SourcePropertyNameAsString” target=”TargetAsObject.TargetPropertyNameAsString” / >

Using bindable utils class in action script , flex or flash

bindProperty(site:Object, prop:String, host:Object, chain:Object, commitOnly:Boolean = false, useWeakReference:Boolean = false):ChangeWatcher
[static] Binds a public property, prop on the site Object, to a bindable property or property chain.

BindingUtils.bindProperty(SiteAsObject, “PropertyAsString”, HostAsObject, “ChainAsString”); //SiteAsObject is source object //HostAsObject is target Object // ChainAsString is target object property

Parameters

site:Object — The Object defining the property to be bound to chain.
prop:String — The name of the public property defined in the site Object to be bound. The property will receive the current value of chain, when the value of chain changes.
host:Object — The object that hosts the property or property chain to be watched.
chain:Object — A value specifying the property or chain to be watched. Legal values are:

  • String containing the name of a public bindable property of the host object.
  • An Object in the form: { name: property name, getter: function(host) { return host[property name] } }. This Object must contain the name of, and a getter function for, a public bindable property of the host object.
  • A non-empty Array containing a combination of the first two options that represents a chain of bindable properties accessible from the host. For example, to bind the property host.a.b.c, call the method as: bindProperty(site, prop, host, ["a","b","c"]).

Note: The property or properties named in the chain argument must be public, because the describeType() method suppresses all information about non-public properties, including the bindability metadata that ChangeWatcher scans to find the change events that are exposed for a given property. However, the getter function supplied when using the { name, getter } argument form described above can be used to associate an arbitrary computed value with the named (public) property.

commitOnly:Boolean (default = false) — Set to true if the handler should be called only on committing change events; set to false if the handler should be called on both committing and non-committing change events. Note: the presence of non-committing change events for a property is indicated by the [NonCommittingChangeEvent(<event-name>)] metadata tag. Typically these tags are used to indicate fine-grained value changes, such as modifications in a text field prior to confirmation.
useWeakReference:Boolean (default = false) — (default = false) Determines whether the reference to the host is strong or weak. A strong reference (the default) prevents the host from being garbage-collected. A weak reference does not.

Returns

ChangeWatcher — A ChangeWatcher instance, if at least one property name has been specified to the chain argument; null otherwise.
bindSetter(setter:Function, host:Object, chain:Object, commitOnly:Boolean = false, useWeakReference:Boolean = false):ChangeWatcher
[static] Binds a setter function, setter, to a bindable property or property chain.
BindingUtils.bindSetter();

Parameters

setter:Function — Setter method to invoke with an argument of the current value of chain when that value changes.
host:Object — The host of the property. See the bindProperty() method for more information.
chain:Object — The name of the property, or property chain. See the bindProperty() method for more information.
commitOnly:Boolean (default = false) — Set to true if the handler should be called only on committing change events. See the bindProperty() method for more information.
useWeakReference:Boolean (default = false) — (default = false) Determines whether the reference to the host is strong or weak. A strong reference (the default) prevents the host from being garbage-collected. A weak reference does not.

Returns

ChangeWatcher — A ChangeWatcher instance, if at least one property name has been specified to the chain argument; null otherwise.

Inline Data Binding

By using { } we can bind to properties, value to that property or method or action script statements. this { } when used in mxml file at component tag

< ObjectName Property=”{ TargetObject.TargetProperty }” / >

Bindable Mata Keyword

Bindable  is keyword in action script language which is used to set a property that this variable has more than once target and should be instantly to be changed.
[Bindable] private var name:type;

For more information about data binding pitfalls looking here

https://thulasiramsoft.wordpress.com/2010/11/09/flex-data-binding-pitfalls/

  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: