如何处理自定义GridItemRenderer中的变化

Question

我在我的一个项目中使用DataGrid，其中一列的自定义ItemRenderer表示布尔值为CheckBox

<s:DataGrid id="clients" resizableColumns="false">
    <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="fullName" headerText="Client name" />
            <s:GridColumn dataField="active" headerText="Active?" width="90"
                          itemRenderer="CheckBoxGridItemRenderer"/>
        </s:ArrayList>
    </s:columns>
</s:DataGrid>

下面是CheckBoxGridItemRenderer的代码:

<?xml version="1.0" encoding="utf-8"?>
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                    xmlns:s="library://ns.adobe.com/flex/spark" 
                    xmlns:mx="library://ns.adobe.com/flex/mx"
                    clipAndEnableScrolling="true">
    <fx:Script>
        <![CDATA[
            override public function prepare(hasBeenRecycled:Boolean):void {
                checkBox.selected = Boolean(data[column.dataField]);
            }
        ]]>
    </fx:Script>
    <s:CheckBox id="checkBox" horizontalCenter="0" />
</s:GridItemRenderer>

现在我的问题是:处理我声明的DataGrid类的数据变化的最佳方法是什么?

我试图改变数据值从我的自定义项目渲染器类:

private function valueChange():void
{
    data.active = checkBox.selected;
}
[...]
<s:CheckBox id="checkBox" change="valueChange()" />

，然后在DataGrid的数据提供程序上监听CollectionEvent.COLLECTION_CHANGE事件，但我从不处理任何更改。有什么想法或建议吗?

Answer 1

在哪里更改数据?当数据收集的一个元素发生变化时，除非调度CollectionEvent，否则DataGrid什么也检测不到。COLLECTION_CHANGE用于数据收集。此外，数据收集应该类似于ArrayCollection，而不是Array。

Answer 2

当我找到我的问题的解决方案时，我会把它贴在这里，但我把这个问题留一段时间，以防有人想出更好的解决方案。

首先，我创建了一个CustomEvent(我可以使用CollectionEvent类，但这样我确信我不会搞砸DataGrid的内部逻辑)

package
{
    import flash.events.Event;
    public class CustomEvent extends Event
    {
        public static const CHANGE:String = "change";
        public var column:String;
        public var data:Object;
        public function CustomEvent(column:String, data:Object)
        {
            super(CHANGE, true);
            this.column = column;
            this.data = data;
        }
    }
}

注意bubbles设置为true时对super()的调用。这实际上需要在这里处理事件。

然后我修改了我的CheckBoxGridItemRenderer，当复选框被选中/取消选中时调度这个事件:

<?xml version="1.0" encoding="utf-8"?>
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                    xmlns:s="library://ns.adobe.com/flex/spark" 
                    xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true">
    <fx:Script>
        <![CDATA[
            import CustomEvent;
            override public function prepare(hasBeenRecycled:Boolean):void {
                if (data)
                {
                    checkBox.selected = Boolean(data[column.dataField]);
                }
            }
            private function valueChange():void
            {
                data[column.dataField] = checkBox.selected;
                dispatchEvent(new CustomEvent(column.dataField, data));
            }
        ]]>
    </fx:Script>
    <s:CheckBox id="checkBox" horizontalCenter="0" change="valueChange()" />
</s:GridItemRenderer>

最后，我只需要听由DataGrid实例调度的自定义事件:

clients.addEventListener(CustomEvent.CHANGE, handleCustomEvent);