数据网格项渲染器答案

【问题标题】：DataGrid ItemRenderer数据网格项渲染器
【发布时间】：2015-07-09 11:21:10
【问题描述】：

事情是这样的：我有这个 DataGrid，它包含一个用于处理某些操作的列。所以，这个 DataGrid 有几个数据列，最后有这个特殊的列。在这个名为“操作”的特殊列中，有两个图标；其中一个显示一个警报图标（像一个小铃铛）。所以，我要做的是，最初警报图标显示为不可见；当用户设置警报（通过另一个界面）时，警报图标会显示（使用默认样式颜色），当需要触发警报时，警报图标应该采用另一种样式颜色（如黄色）。

所以，我有下一个定义：

<mx:DataGrid id="dgSomeValues"
   dragEnabled="true"
   draggableColumns="false"
   width="100%" height="100%"
   horizontalScrollPolicy="off"
   resizableColumns="true"
   rowHeight="19">
<components:columns>
    <mx:DataGridColumn id="dgcItem" headerText="{resourceManager.getString('resources','columnItem')}" width="70" resizable="false"/>
    <!--
    Some other dataGridColumns
    -->
    <mx:DataGridColumn id="dgcOperation" headerText=" " width="50" resizable="false">
        <mx:itemRenderer>
            <fx:Component>
                <components:OperationItemRenderer/>
            </fx:Component>
        </mx:itemRenderer>
    </mx:DataGridColumn>
</components:columns>

OperationItemRenderer 的定义是这样的：

import flash.events.MouseEvent;

import com.broker.control.BrokerEvent;
import mx.containers.HBox;

public class OperationItemRenderer extends HBox
{
    //--------------------------------------------------------------------------
    //
    //  Variables
    //
    //--------------------------------------------------------------------------
    /**
     *  Alarm Button --> bell
     **/
    private var btnAlarm:Icon;

    //--------------------------------------------------------------------------
    //
    //  Constructor
    //
    //--------------------------------------------------------------------------
    /**
     *  Constructor
     **/
    public function OperationItemRenderer()
    {
        super();

        this.setStyle("horizontalGap",0);
    }

    //--------------------------------------------------------------------------
    //
    //  Overridden methods
    //
    //--------------------------------------------------------------------------

    /**
     *  @inheritDoc
     **/
    override public function set data(value:Object):void
    {                   
        super.data = value;
    }

    /**
     *  @inheritDoc
     **/
    protected override function createChildren():void
    {
        super.createChildren();

        if (!btnAlarm){
            btnAlarm = new Icon();

            btnAlarm.styleName = "";    // Initially do not shows any icon.

            btnAlarm.enabled = true;
            btnAlarm.addEventListener(MouseEvent.CLICK, btnAlarmClickHandler,false,0,true);

            addChild(btnAlarma);
        }
    }

    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
    {
        super.updateDisplayList(unscaledWidth, unscaledHeight);

        if (btnAlarm){
            btnAlarm.width = unscaledWidth/2;
            btnAlarm.height= unscaledHeight;
        }
    }

    //--------------------------------------------------------------------------
    //
    //  Methods
    //
    //--------------------------------------------------------------------------

    /**
     * If this item has an alarm, then it will show an icon.
     * States for alarm icon are: Default --> icnAlarmOff
     *                            Fired   --> icnAlarm
     */
    public function upgradeIcon(toogle:Boolean):void 
    {
        btnAlarm.styleName = toogle ? "icnAlarm" : "icnAlarmOff";
    }

    //--------------------------------------------------------------------------
    //
    //  Event Handlers
    //
    //--------------------------------------------------------------------------

    protected function btnAlarmaClickHandler(event:MouseEvent):void
    {   
        if (btnAlarm.styleName == "favIcnAlarma") {
            var evt:BrokerEvent;
            evt = new BrokerEvent(BrokerEvent.SETUP_ALARM);

            dispatchEvent(evt);
        }
    }
}

函数“upgradeIcon”应该从应用程序的另一个部分调用，其中每次刷新 DataGrid 的数据源时都会调用它的 rowFunction。在这个 rowFunction，我想找到一种访问 DataGrid ItemRenderer 的方法，这样我就可以调用这个 upgradeIcon 函数。

问题是，如何以编程方式访问 DataGrid 的 ItemRenderer？我已经尝试过的是这样的：

var c:ClassFactory = view.dgcOperation.itemRenderer as ClassFactory;
if (c != null && c.generator != null) { // c never is null at this point
    var f:OperationItemRenderer = c.generator as OperationItemRenderer;
    f.upgradeIcon(change);  // f it's always null
    //(c.generator as OperationItemRenderer).upgradeIcon(change);
}

但是这种方法行不通。任何帮助将不胜感激。

提前致谢！

【问题讨论】：

标签： actionscript-3 apache-flex datagrid itemrenderer

【解决方案1】：

尝试在用户设置警报时调度事件...并在您的渲染器中添加此事件的侦听器，因此当设置新警报时，将从您的警报界面调度一个事件，并在您的渲染器中捕获这将更新您的图标样式。

【讨论】：

谢谢！我会尝试这种方法。

【解决方案2】：

你的数据网格必须有一个值对象的数据提供者（比如Report 是你的类名）。如果您已将Report 类标记为可绑定，则其任何属性的任何更改都将调度PropertyChangeEvent，然后您可以覆盖项目渲染器中的set Data 方法，并根据您应该采取必要的该属性的值行动。

ItemRenderer 被回收并在这种情况下获取它们是一种不好的做法。您不应直接更改 ItemRenderer，而应更改底层对象。

【讨论】：