Attach Movieclip to Datagrid Cell (and detect mouse click on cellRenderer)

Not to certain how many people may need this script, but lo and behold I had need of it for my project. So, here’s my script on how to add a movie clip to a Datagrid Cell via CellRenderer

  1. Create an Actionscript file (*.as) and call it IconCellRenderer

  2. Put the following code inside that file:

package
{
    import fl.controls.listClasses.CellRenderer;
    import flash.utils.getDefinitionByName;
    
    public class IconCellRenderer extends CellRenderer 
    {
        public function IconCellRenderer() 
        {
            // -------------- Attach MovieClip -----------------
            var instance = new (getDefinitionByName("MyMovie")); // Create Instance of "MyMovie"
            this.addChild(instance);    // Add this instance to the CellRenderer
            instance.name = "MyMovieInstance";    // Name this new instance
            
            // Position Movie in Cell
            instance.x += 8;
            instance.y += 3;
        }
    }
}
  1. Now set the cellRender for the cells that you want this to apply to:

MyDataGrid.getColumnAt(MyDataGrid.getColumnIndex(“ColumnName”)).cellRenderer = IconCellRenderer; // load IconCellRenderer

Extra Tid Bid:
Here is a little extra on detecting when someone clicks on a cell utilizing the above cellRenderer: (I’m sure there’s a better way to do it, but here you go)

  1. Add Event Listener to your datagrid to detect a mouse click
    MyDataGrid.addEventListener(MouseEvent.CLICK, onClickCell);

  2. Here’s the function called upon the Mouse Click:

function onClickEvent (E:Event)
{
    // if a record is selected
    if (eventGrid.selectedIndex != -1)
    {
       // Check if user clicked on the Info Icon CellRender of the selected Row
        var Row = eventGrid.selectedIndex; // get selected row
        var Col = eventGrid.getColumnIndex("Info"); // the column of cells with IconCellRenderer
        if (E.target == eventGrid.getCellRendererAt(Row, Col))
            MyFunction (); // function you want called when cellRenderer is clicked
    }
}