Data BindIng 什么時候發生:
1.在綁定源屬性值發生改變時發生。
2.在綁定源發出initialize事件時綁定發生一次。
讓屬性具有可綁定功能:
一般的,只要在屬性前加上
[Bindable] 或
[Bindable(event="eventname")]
元標記即可
注意:
如果沒有標出觸發綁定的事件,正如[Bindable],Flex會自動為綁定加上propertyChange事件,當源數據發生變化時,Flex將自動派發該事件,觸發數據綁定。如果修改后數據和源數據“===”也就是全等,那么Flex將不會觸發數據綁定。
如果標出的觸發綁定的事件,正如[Bindable(event="eventname")],那么在源數據發生改變的時候,必須dispatch出該事件才能觸發數據綁定。不論修改后數據和源數據是否全等,Flex都將會觸發數據綁定,需要自己編程控制,例如:
<mx:Script>
<![CDATA[
[Bindable(event="hhhh")]
private var ss:String="aaa";
private function doTest():void
{
ss="bbb";
if(ss!=="aaa") / /判斷和源數據是否相等,不相等則觸發綁定
this.dispatchEvent(new Event("hhhh"));
}
]]>
</mx:Script>
<mx:Text text="{ss}"/>
<mx:Button click="doTest()"/>
如果沒有this.dispatchEvent(new Event("hhhh"))這句,那么你點擊按鈕是沒有設么作用的。 另外當申明自定義觸發事件時,用ChangeWatcher來監控其變化,發現雖然目的源值變了,但是ChangeWatcher卻監控不到變化,同樣ChangeWatcher也監控不到非共有變量的變化。關于ChangeWatcher,下面會提到。
綁定函數――Functions,對象――Object,數組――Arrays
函數:
你可以在{}中直接使用函數。例如:<mx:Text text="{Matn.random()*ss}"/>
上面這個沒有什么好講的,關于函數綁定下面這個比較重要:
<mx:Script>
<![CDATA[
public var ss:String="aaa";
[Bindable(event="hhhh")]
private function gg():String
{
return ss;
}
private function doTest():void
{
ss=Math.random().toString();
this.dispatchEvent(new Event("hhhh"));
}
]]>
</mx:Script>
<mx:Text text="{gg()}"/>
<mx:Button click="doTest()"/>
這樣給函數加一個[bindable],便使函數具有綁定功能,但是如果不申明自定義觸發事件,只能在組件初始化時綁定一次,點擊以上按鈕是沒有什么作用的。大家可以自己試試。
還有getter和setter函數,比較重要,給getter或setter函數加上[bindable],用不著兩個都加,加一個就可以了,例如:
<mx:Script>
<![CDATA[
public var ss:String="aaa";
[Bindable]
public function get gg():String
{
return ss;
}
public function set gg(value:String):void
{
ss=value;
}
private function doTest():void
{
gg=Math.random().toString();
this.dispatchEvent(new Event("hhhh"));
}
]]>
</mx:Script>
<mx:Text text="{gg}"/>
<mx:Button click="doTest()"/>
同樣能達到綁定效果,如果只有一個getter方法,那么要想實現數據綁定,就需要申明自定義觸發事件了,大家可以自己試試。
對象:
對象綁定最重要的是搞清楚怎么申明才能使其屬性具有綁定功能,例如:
申明對象 NonBindableObject
//[bindable] 先注釋掉這行,測試
public class NonBindableObject extends Object
{
public function NonBindableObject() {
super();
}
public var stringProp:String = "String property";
public var intProp:int = 52;
}
綁定
<mx:Script>
<![CDATA[
[Bindable]
public var myObj:NonBindableObject = new NonBindableObject();
[Bindable]
public var anotherObj:NonBindableObject =
new NonBindableObject();
public function initObj():void {
anotherObj.stringProp = 'anotherObject';
anotherObj.intProp = 8;
}
]]>
</mx:Script>
<mx:Text id="text1" text="{myObj.stringProp}"/>
<mx:Text id="text2" text="{myObj.intProp}"/>
<mx:Button label="改變 myObj.stringProp"
click="myObj.stringProp = 'new string';"/>
<mx:Button label="改變 myObj.intProp"
click="myObj.intProp = 10;"/>
<mx:Button label="Change myObj"
click="myObj = anotherObj;"/>
如果在申明對象時沒有在類前加上[bindable]標簽,那么該對象的所有屬性是不能被綁定的,也就是說當對象屬性發生變化時,不會觸發綁定,所以點擊前兩個按鈕都是沒有用的,只有當該對象本身發生變化時,才能夠觸發綁定,正如第三個按鈕的操作。
現在取消第一行的注釋,使對象屬性可綁定,那么再點前兩個按鈕試試。只要給對象加上[Bindable]元標記,那么會使該對象的所有公有屬性――public和擁有getter和setter方法的屬性具有綁定功能。
數組:
如果把數組作為綁定對象,那么最好使用ArrayCollection對象,因為當使用ArrayCollection對象的一些API來操作數組會觸發數據綁定,如:ArrayCollection.addItem(), ArrayCollection.addItemAt(), ArrayCollection.removeItem(), and ArrayCollection.removeItemAt()方法 ,不然要直接使用Array的話,只用當Array本身發生變化時才觸發數據綁定,當數組中某一屬性發生變化時是不會觸發數據綁定的。例如:
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
public var myAC:Array =["One", "Two", "Three", "Four"];
[Bindable]
public var myAC2:Array =["One1", "Two1", "Three1", "Four1"];
]]>
</mx:Script>
<mx:Text id="text1" text="{myAC[0]}"/>
<mx:Text id="text2" text="{myAC.getItemAt(0)}"/>
<mx:Button id="button1"
label="改變某一屬性"
click="myAC[0]='new One'"/>
<mx:Button id="button2"
label="改變對象"
click="myAC=myAC2"/>
當使用[]形式來申明數組時,必須使用ArrayCollection的API方法來實現數據綁定,所以當你點擊第一個按鈕時,text2發生了改變,而text1沒有。
數據綁定除了用[Bindable]標簽來申明以外,也可以用<mx:Binding/>組件和ActionScript實現。
用<mx:Binding/>,例如:
<mx:binding source="text1.text" destination="text2.text"/>
<mx:binging source="text2.text" destination="text1.text"/>
<mx:TextInput id="text1"/>
<mx:TextInput id="text2"/>
source為綁定源,destination為目的源,按上面的寫法,不論是text1還是text2發生變化,都會引起對方的變化。細心的你也許會想這不會引起死循環嗎?答案是否定的,不會引起死循環。我想應該是Flex內部的機制已經優化了這種情況,讓其只觸發一次。
用ActionScript來綁定:
1.使用bindProperty()。
bindProperty(site:Object, prop:String,host:Object, chain:Object,commitOnly:Boolean = false):ChangeWatcher,例如:
var myc:ChangeWatcher=BindingUtils.bindProperty(text2,"text",text1,"text");
即當text1的值發生變化時text2也跟著變,site為目的對象,prop為目的屬性,host為綁定源,china為綁定源屬性鏈――關于屬性鏈下面再講,commitOnly默認為False,即不管是確認事件還是未確認事件都將觸發綁定,而為True時,只有確認事件才能觸發綁定,這個一般用不到,和Flex自身的事件機制有關,如果為false的話,當數據改變時將觸發兩次綁定事件,當為True時,只觸發一次,自己可以用bindSetter方法來做測試。當不想綁定時可以用myc.unwatch()方法來解除綁定。
2.使用bindSetter()。
bindSetter(setter:Function, host:Object, chain:Object,commitOnly:Boolean = false):ChangeWatcher,例如:
var myc:ChangeWatcher=BindingUtils.bindSetter(change,text1,"text",true);
private function change(str:String):void
{
text2.text=str;
}
change就是當綁定源發生變化時所觸發的函數,其他參數都一樣。
3.使用ChangeWatcher.watch()。
同樣可以用ChangeWatcher.watch方法來監控對象屬性的變化,非常有用。
watch(host:Object, chain:Object,handler:Function,commitOnly:Boolean = false):ChangeWatcher,例如:
var myc:ChangeWatcher=ChangeWatcher.watch(text1,"text",change);
private function change(e:Event):void
{
text2.text=text1.text;
}
這里的Event和綁定數據所定義的觸發事件有關,你可以用所有事件的父類Event來表示。
注意:
as主要是通過mx.binding.utils.BindingUtils 這個類來實現數據綁定,用MXML和as實現數據綁定有以下幾點不同:
1.當使用AS做數據綁定時,bindProperty()或 bindSetter()方法中不能使用AS代碼,這和MXML是不同的, 可以用bindSetter() 方法來申明一個綁定處理函數。
2.當使用AS做數據綁定時,同樣不能使用EX4語法,也就是說不能直接使用XML解析語法了。
3.當使用AS做數據綁定時,在屬性鏈中不能使用任何函數和數組。
4.MXML具有更好的錯誤提示和警告功能。
最后來講講屬性鏈。
屬性鏈就是bindProperty()和 bindSettet()等方法中的chain參數所表示的對象, 有時也許綁定源并不只是text1.text這樣的簡單形式,也可以是類似于user.name.text1.text,那么就存在一個關系鏈的問題,如果這條鏈中的某一項發生了改變,會不會觸發綁定呢?答案是如果你想讓其改變其中的某一項都能觸發數據綁定,那么這條鏈的每個元素必須是可綁定的。對于上面的這種形式,可以這樣使用bindProperty方法:
bindProperty(text2, "text", this, ["user", "name","text1","text"])。