您好,登錄后才能下訂單哦!
這篇文章給大家介紹Adobe Flex提供哪些方法指定Flex數據綁定,內容非常詳細,感興趣的小伙伴們可以參考借鑒,希望對大家能有所幫助。
和大家重點學習一下Flex數據綁定,Adobe Flex 提供三種方法用于指定Flex數據綁定:MXML 中的大括號({})語法,MXML 中的<mx:Binding>標記,以及ActionScript 中的BindingUtils 的系列方法。
關于Flex數據綁定
Flex數據綁定是將一個對象中的數據同另一個對象中的數據聯系在一起的過程。Flex數據綁定為在應用的不同層之間傳遞數據提供了便捷方法。Flex數據綁定需要一個源屬性,一個目的屬性,以及用于表明何時將數據從源屬性拷貝到目的屬性的觸發事件。當源屬性變化時,對象發出觸發事件。
Adobe Flex 提供三種方法用于指定Flex數據綁定:MXML 中的大括號({})語法,MXML 中的<mx:Binding>標記,以及ActionScript 中的BindingUtils 的系列方法。
(1)下面的例子使用大括號({})語法來展示一個Text 控件,該控件的數據來自于TextInput 控件Text 屬性:
<?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>
Flex數據綁定表達式中可以將ActionScript 代碼以及E4X 表達式作為一部分包含進來,如下例所示:
<?xml version="1.0"?> <!-- binding/BasicBindingWithAS.mxml --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:TextInput id="myTI"/> <mx:Text id="myText" text="{myTI.text.toUpperCase()}"/> </mx:Application>
(2)用<mx:Binding>標記作為大括號語法的替代方法。
在使用<mx:Binding>時,要為<mx:Binding>標記提供一個源屬性作為標記的source 屬性以及提供一個目的屬性作為標記的destination 屬性。下面的例子使用<mx:Binding>標記定義了一個從TextInput 控件到Text 控件的Flex數據綁定:
<?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>
同大括號語法相比,用<mx:Binding>標記能夠將視圖(用戶界面)同模型完全分離。
<mx:Binding>標記也能實現將多個源屬性綁定到一個相同的目的屬性,這是因為能夠定義多個具有相同的destination 屬性的<mx:Binding>標記.
大括號語法和<mx:Binding>標記都能在編譯期定義Flex數據綁定,而使用ActionScript 代碼則可以在運行期定義Flex數據綁定,如下例所示:
<?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>
(3)創建用作Flex數據綁定源的屬性
當創建一個用于綁定表達式源的屬性,那么在源屬性值發生變化時Flex 就能自動將值拷貝到所有的目的屬性。為了讓Flex 執行拷貝,必須使用[Bindable]標記來向Flex 注冊這個屬性。
The [Bindable] 元數據標記有以下語法:
[Bindable] [Bindable(event="eventname")]
如果忽略了事件名稱,Flex 自動地創建一個名為propertyChange 的事件,并且在屬性發生變化時,由Flex 發出這個事件以觸發所有以這個屬性作為源的Flex數據綁定。
下面的例子作了一個maxFontSize 屬性和一個minFontSize 屬性變量可用于Flex數據綁定表達式的源:
<?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>
關于Adobe Flex提供哪些方法指定Flex數據綁定就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。