flex数据绑定的几个方式

1.

<?xml version="1.0"?>
<!-- binding/BasicBinding.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:TextInput id="myTI" text="Enter text here"/>
    <mx:Text id="myText" text="{myTI.text}"/>
</mx:Application>

 

2.

  

<?xml version="1.0"?>
<!-- binding/BasicBindingMXML.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:TextInput id="myTI"/>
    <mx:Text id="myText"/>   

    <mx:Binding source="myTI.text" destination="myText.text"/>
</mx:Application>

 

3.

  

<?xml version="1.0"?>
<!-- binding/BasicBindingAS.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    
    <mx:Script>
      <![CDATA[
        import mx.binding.utils.*;

        // Define data binding.
        public function initBindingHandler():void {
            BindingUtils.bindProperty(myText, "text", myTI, "text");
        }
      ]]>    
    </mx:Script>

    <mx:TextInput id="myTI"/>
    <mx:Text id="myText" preinitialize="initBindingHandler();"/>
</mx:Application>

 

4.

  

<?xml version="1.0"?>
<!-- binding/FontPropertyBinding.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    
    <mx:Script>
        <![CDATA[
            // Define public vars for tracking font size.
            [Bindable]
            public var maxFontSize:Number = 15;

            [Bindable]
            public var minFontSize:Number = 5;
        ]]>    
    </mx:Script>
    
    <mx:Text text="{maxFontSize}"/>
    <mx:Text text="{minFontSize}"/>

    <mx:Button click="maxFontSize=20; minFontSize=10;"/>
</mx:Application>

 

这里使用  [Bindable]标签，flex会自动创建一个propertyChange的事件，每当这个属性值变化的时候会触发这个时间去更新被绑定的源。

评论

1 楼 bence 2010-04-03  

总结的不错。