PropertyChangeEvent事件

1.简介
       继承关系：PropertyChangeEvent
       如果对象的属性值发生变化，可以派发PropertyChangeEvent事件来表示。
       Flex 数据绑定机制也使用此事件。
       例子请参考《mx.events.PropertyChangeEvent》

2.常见属性和方法
2.1 属性PROPERTY_CHANGE
PROPERTY_CHANGE : String = "propertyChange"
[静态] PropertyChangeEvent.PROPERTY_CHANGE 常量可为 PropertyChange 事件定义事件对象的 type 属性的值。

2.2 属性kind
指定更改的类型。String类型
可能的值为 PropertyChangeEventKind.UPDATE、PropertyChangeEventKind.DELETE 和 null

2.3 属性newValue
更改后的属性的值。Object类型

2.4 属性oldValue
更改前的属性的值。Object类型

2.5 属性property
需要更改的属性。Object类型

2.6 属性source
发生更改属性的对象。Object类型

2.7 属性currentTarget
用于定义处理该事件的事件侦听器的 Object。Object类型
例如，如果您使用myButton.addEventListener() 注册某个事件侦听器，则 myButton 为 currentTarget 的值。

2.8 属性target
事件目标。Object类型
派发事件的 Object；它不一定是侦听该事件的 Object。使用 currentTarget 属性始终可以访问侦听事件的 Object。

3.PropertyChangeEvent 类举例
3.1SolidColor类派发PropertyChangeEvent事件
详见代码《mx.graphics.SolidColor》

public class SolidColor extends EventDispatcher implements IFill{
    ......
    public function set color(value:uint):void {
        var oldValue:uint = _color;
        if (value != oldValue)
        {
            _color = value;
            dispatchFillChangedEvent("color", oldValue, value);
        }
    }
   
private function dispatchFillChangedEvent(prop:String, oldValue:*, value:*):void {
        if (hasEventListener("propertyChange"))
            dispatchEvent(PropertyChangeEvent.createUpdateEvent(this, prop,oldValue, value));
    }
}

3.2 派发PropertyChangeEvent事件
       用户可以自己派发该事件，具体代码如下

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx=""
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               xmlns:exam="myskin.*"
               creationComplete="application1_creationCompleteHandler(event)"
               minWidth="955" minHeight="600">

    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;
            import mx.events.PropertyChangeEvent;
            protected function button1_clickHandler(event:MouseEvent):void
            {
                dispatchEvent(PropertyChangeEvent.createUpdateEvent(this, "name","name4", this.txtipt.text));
            }

            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                this.addEventListener(PropertyChangeEvent.PROPERTY_CHANGE,handlerme);
            }

            protected function handlerme(event:PropertyChangeEvent):void
            {
                result.text="kind: "+event.kind+"\n"+"oldValue: "+event.oldValue+"\n"+"newValue: "+event.newValue;

            }
        ]]>
    </fx:Script>

    <fx:Declarations>
        <!-- 将非可视元素（例如服务、值对象）放在此处 -->
    </fx:Declarations>
    <s:TextInput id="txtipt" x="231" y="55"/>
    <s:Label x="186" y="61" text="姓名"/>
    <s:TextArea id="result" x="187" y="79" width="146" height="64" text="结果为："/>
    <s:Button x="367" y="56" label="发送" click="button1_clickHandler(event)"/>

</s:Application>

运行结果如下



3.3：利用ObjectProxy对对象进行监控，如果对象发生变化，触发PropertyChangeEvent事件
PropertyChangeExam1.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx=""
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               creationComplete="init();"
               minWidth="955" minHeight="600">
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>
    <fx:Declarations>
        <mx:ArrayCollection id="arrColl" />
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            import mx.events.PropertyChangeEvent;
            import mx.utils.ObjectProxy;

            //实例化一个空对象，没有任何属性
            private var object:Object = {};
            private var objectProxy:ObjectProxy;

            private function init():void {
                objectProxy = new ObjectProxy(object);
                objectProxy.addEventListener(PropertyChangeEvent.PROPERTY_CHANGE, updateChange);
                objectProxy.name = "My Object";
                objectProxy.id = 31;

                //这二个赋值语句不会引发PropertyChangeEvent事件
                object.isDebug = false;
                object.id = 33;

                //将id从33改成45，并引发PropertyChangeEvent事件
                objectProxy.id = 45;
            }

            private function updateChange(evt:PropertyChangeEvent):void {
                arrColl.addItem(evt);
            }
        ]]>
    </fx:Script>
    <mx:DataGrid dataProvider="{arrColl}"
                 sortableColumns="false"
                 draggableColumns="false"
                 width="100%"
                 height="100%">
        <mx:columns>
            <mx:DataGridColumn dataField="type" />
            <mx:DataGridColumn dataField="property" />
            <mx:DataGridColumn dataField="newValue" />
            <mx:DataGridColumn dataField="oldValue" />
            <mx:DataGridColumn dataField="source" />
        </mx:columns>
    </mx:DataGrid>
</s:Application>

运行结果




参考文献
1. PropertyChangeEvent类参考.
/PropertyChangeEvent.html
2.Detecting changes to an Object using the Flex ObjectProxy class. http://blog.flexexamples.com/2007/09/27/detecting-changes-to-an-object-using-the-flex-objectproxy-class/
3.ActionScript 类中属性的 PropertyChangeEvent.http://flex4jiaocheng.com/blog/289