(flex) - 对数据变化的影响 - 自定义 itemrenderer答案

【问题标题】：(flex) - effect play on data change - custom itemrenderer(flex) - 对数据变化的影响 - 自定义 itemrenderer
【发布时间】：2012-08-29 23:33:57
【问题描述】：

我有带有自定义 itemrenderer 的数据网格。我想为更改数据的单元格播放动画颜色效果。我不想对所有单元格都播放这种效果。

这里是itemrenderer的代码：

<?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:Declarations>
    <s:Sequence id      =   "updateEffect">
        <s:AnimateColor colorFrom   ="0xffffff"
                        colorTo     ="0xb9d30d"
                        target  =   "{lblData}"
                        duration    ="5000"/>
        <s:AnimateColor colorFrom   ="0xb9d30d"
                        colorTo     ="0xffffff"
                        target  =   "{lblData}"
                        duration    ="5000"/>
    </s:Sequence>
</fx:Declarations>
<fx:Script>
    <![CDATA[
        import mx.controls.Alert;
        import mx.events.FlexEvent;

        override public function prepare(hasBeenRecycled:Boolean):void {
            if(data)
            {
                lblData.text = data[column.dataField];
                if(data.selected == true)
                {
                    lblData.setStyle("color","#61afda");
                    lblData.setStyle("textAlign","center");
                    lblData.setStyle("fontWeight","bold");
                    lblData.setStyle("fontSize","19");
                    lblData.setStyle("paddingLeft","10");
                    lblData.setStyle("paddingRight","10");
                    lblData.setStyle("paddingBottom","0");
                    lblData.setStyle("paddingTop","2");         
                    containter.setStyle("backgroundAlpha","1.0");
                    containter.setStyle("backgroundColor","0x2f3437");
                }
                else
                {   
                    lblData.setStyle("color","#d4d4d4");
                    lblData.setStyle("textAlign","center");
                    lblData.setStyle("fontWeight","bold");
                    lblData.setStyle("fontSize","12");
                    lblData.setStyle("paddingLeft","10");
                    lblData.setStyle("paddingRight","10");
                    lblData.setStyle("paddingBottom","5");
                    lblData.setStyle("paddingTop","4");
                    containter.setStyle("backgroundAlpha","0.0");
                    updateEffect.play();
                }
            }
        }
    ]]>
</fx:Script>
<s:SkinnableContainer
    id          ="containter"
    width       ="100%"
    height      ="100%">

    <s:HGroup
        width       ="100%"
        height      ="100%">

        <s:Label
            id                  ="lblData"

            width               ="100%"
            height              ="100%"
            maxDisplayedLines   ="1"
            styleName           ="FPlayGcItemRenderStyle"/>


    </s:HGroup>

</s:SkinnableContainer>

有什么建议吗？

【问题讨论】：

标签： apache-flex itemrenderer effect

【解决方案1】：

我不知道这是否是最好的方法，但是当我需要在我的项目渲染器中动态更新属性时，我通常会为我的数据添加一个侦听器。

//This is inside an item renderer
private var _myClass:FunkyClass;
override protected function set data( value:Object ):void
{
    super.data = value;
    if( value != null )
    {
        if( _myClass != null )
        {
            _myClass.removeEventListener( 
                  'MyFunkyClass.DataChange' , updateSomething);
        }
        _myClass = value as FunkyClass;
        _myClass.addEventListener( 
                  'MyFunkyClass.DataChange' , updateSomething);
    }
}

private function updateSomething( event:Event ):void
{
    //change colors, visibility and so forth
}

当然，您的数据类必须扩展 EventDispatcher。我也很想看看社区中的其他人是如何解决这个问题的。

【讨论】：