[Bindable] usage in flex

Source: Internet
Author: User

In Flex programming, bindble uses the most metadata. This label can be applied to variables, classes, or methods. Use the variable "{}" in mxml to reference the variable set to Bindable, so as to automatically synchronize the value assignment of the variable with the interface element.

The implementation of Bindable adopts the gof observer mode., Or publisher/subscriber mode. This implementation allows a class (or variable) to automatically notify interested objects of its own changes.

Corresponding to the observer mode, the gof statement is:

Defines a one-to-many dependency between objects. When the State of an object changes, all objects dependent on it are notified and automatically updated. This kind of interaction also becomes publishing-subscription. The target is the publisher of the notification. He doesn't need to know who is his subscriber (observer) to publish a notification ). You can view the subscription and receive notifications for any number of objects.

In ActionScript, the compiler adds an event Association for the label to the change of a specific attribute, class, or method.

For a simple example, if a variable and a component are defined:

<span><span>[Bindable] var displayName :String;</span><span>&lt;mx:TextInput id= "textA" text="{dispayName}"/&gt;,</span></span>

The pseudo code corresponding to the event automatically added by the compiler in the background is as follows:

<Span> function set dispayname (newvar: string): void {displayname = newvar; this. dispatchevent (new event ("_ dispaynamechanged");} // function mxmlinit () {</span>
<span>    textA.addEventListener("_dispayNameChanged")) , UpdateDisplay);} function UpdateDisplay(){    textA.text = displayName;}</span>

It can be seen that the compiler has done a lot of work behind the scenes, saving us a lot of repetitive work to establish this observation relationship.

For beginners of FLEX, the misunderstanding of Bindable is that Bindable is a two-way numerical link. In fact, one element of the observer mode is that the observer knows nothing about the observer.

For example, in the preceding example, the value of the modified texta is not automatically reflected in displayname. Bindable only establishes the relationship between individual observers, which is crucial.

In the corresponding MVC Architecture, the observer often corresponds to the model (Data Model ?) The observer corresponds to the view role. In fact, many MVC architectures depend heavily on the Bindable tool.

So under what circumstances should Bindable be applied? Leaf's personal experience and understanding are as follows:

  • The observer mode is required only when you do not know which observers are there or you need to dynamically add observers!
  • When the observer does not need knowledge between them.
  • When the observer does not care about the observer's information.
  • It is only a simple interface value ing relationship.

Note:Bindable has additional overhead.Don't forget the code automatically generated by the compiler. Do not use Bindable if you need a complex logic (not a simple value assignment.

This is also because,In ActionScript, even if Bindable is specified, if the logic in the corresponding set or get is complex, the Bindable label is ignored instead of the event Association operation.

You can use Bindable [event name] to establish an association.Adobe provides the following example:

<span>private var _maxFontSize:Number = 15;[Bindable(event="maxFontSizeChanged")]// Define public getter method.public function get maxFontSize():Number{    return _maxFontSize;} // Define public setter method.public function set maxFontSize(value:Number):void{    if (value &lt;= 30) {        _maxFontSize = value;    }    else    {         _maxFontSize = 30;    }    // Create event object.    var eventObj:Event = new Event("maxFontSizeChanged");    dispatchEvent(eventObj);}</span>

Note that in this example, complicated logic is implemented in setter, rather than getter. Why? Because the number of setter calls is always less than that of getter under normal circumstances. In principle,
Complex logic is usually completed when values are assigned, and the space is used for time instead of computing each value.

Special information:

In flex4, the observation of expressions is added!For example:

&lt;mx:Button enabled="{state == 'ready'}"/&gt;

The same Code is invalid in flex3.

Appendix: The livedoc link of flex3.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.