0 Comments

声明可绑定数据源--[Bindable]解析

发布于:2012-12-07  |   作者:广州网站建设  |   已聚集:人围观

          数据绑定的数据源可以是属性变量、方法及ActionScript类对象实例。Flex通过元数据标签[Bindable]进行标识。标识为绑定数据源意味着当数据源变化时,能够调度事件,通知Flex更新目标数据。

Bindable元数据标签的签名如下:

[Bindable] 
或者 
[Bindable(event="eventName")]

开发者一般忽略事件(event)名称,只使用[Bindable]标识可绑定数据源。这种情况下,Flex会默认地创建mx.events.PropertyChangeEvent类型事件,事件名为propertyChange。当数据绑定的数据源发生变化时,数据源会自动调度propertyChange事件,通知Flex将新值复制给目标数据。

如果在标识绑定时说明了事件,也就是说采用了[Bindable (event="eventName")]方式,开发者须要自己定义和调度事件。

我们依次说明如何声明属性、ActionScript类和方法作为可绑定的数据源。

声明可绑定属性

在属性变量定义之前,使用元数据标签[Bindable]声明属性可绑定。属性可以是公共属性、私有属性或被保护属性。声明如下:

[Bindable]
public var employee:Employee=new Employee();
[Bindable]
private var acEmployees:ArrayCollection=new ArrayCollection();

如上声明后,employee和acEmployees变量可作为绑定数据源。

对于使用getter和setter方法定义的属性变量,需要在get或set方法前声明[Bindable]。如代码13-3所示。

代码13-3:getter和setter的属性绑定声明

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
verticalAlign="middle" backgroundColor="white" creationComplete="init();">
<mx:Script>
<![CDATA[
private var _prop:String;
private function init():void{
prop='bind was triggerd';
}
[Bindable]
private function set prop(value:String ):void{
//自定义代码
_prop=value;
}
private function get prop():String{
//自定义代码
return _prop;
}
]]>
</mx:Script>
<mx:Text id="txtDest" text="{prop}"/>
<mx:Button label="修改" click="prop='bind was triggerd Again!'"/>
</mx:Application>

声明可绑定ActionScript类

在公共类定义前,使用[Bindable]声明该类是可绑定的。

声明ActionScript类可绑定意味着告诉Flex,这个类的所有公共属性都是可绑定的。因此,代码13-4、代码13-5具有相同的意义。

代码13-4:可绑定ActionScript类一

package com.longfei.bookLabs.bookStore.model
{
[Bindable]
public class Employee
{
public var name:String;
public var title:String;
public function Employee(){
}
}
}
代码13-5:可绑定ActionScript类二
package com.longfei.bookLabs.bookStore.model
{
public class Employee
{
[Bindable]
public var name:String;
[Bindable]
public var title:String;
public function Employee(){
}
}
}

声明可绑定方法

在Flex中,方法也可以作为数据绑定的数据源,前提条件是方法的参数必须声明为可绑定的属性变量。当属性变量发生变化时,方法就会被调用,并把结果传递给目标数据,如代码13-6所示。

代码13-6:可绑定ActionScript方法

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
verticalAlign="middle"  backgroundColor="white">
<mx:Script>
<![CDATA[
private var strDest:String;
private function functionSrc(value:Object):String{
strDest="新数据是: " + value;
return strDest;
}
]]>
</mx:Script>
<mx:Form>
<mx:FormItem label="数据源:">
<mx:TextInput id="txtSrc" />
</mx:FormItem>
<mx:FormItem label="目标数据:">
<mx:TextInput id="txtDest" text="{functionSrc(txtSrc.text)}"/>
</mx:FormItem>
</mx:Form>
</mx:Application>
标签:
飞机