Search code examples
actionscript-3apache-flexdatagriditemrenderer

DataGrid ItemRenderer


Here's the thing: I've this DataGrid that holds a column with the purpose of handle some actions. So, this DataGrid have several data columns and, at the end there is this special column. At this special column named "operations" there are two icons; one of 'em shows an alarm icon (like a little bell). So, what I've to accomplish is that, initially the alarm icon shows invisible; when the user sets an alarm (through another interface) the alarm icon shows up (with default style color) and when it's time to fire the alarm the alarm icon is supposed to take another style color (like yellow).

So, I've this next definition:

<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>

And definition for OperationItemRenderer is like this:

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);
        }
    }
}

The function "upgradeIcon" it's supposed to be called from another section in the application where a rowFunction it's called everytime the DataGrid's datasource is refreshed. At this rowFunction I want to find a way to access DataGrid ItemRenderer so that way I'll be able to call this upgradeIcon function.

The question is, how can I access DataGrid's ItemRenderer programatically? What I already tried is something like this:

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);
}

But this approach does not work. Any help would be greatfully appreciated.

Thanks in advance!


Solution

  • try to dispatch an event when user set alarm...and add a listener of this event in your renderer, so when a new alarm is set, an event will be dispatched from your alarm interface, and be captured in your renderer which will update your icon style.