Flex dataGrid botón Agregar en columna de cuadrícula de datos utilizando ItemRenderer?

Question

Tengo este código. Quiero agregar botones en la segunda columna de los datos de Grird.

<mx:DataGrid width="100%" height="95%" id="id_variableRefList" > 
    <mx:columns> 
    <mx:DataGridColumn id="id_name" dataField=""/> 
    <mx:DataGridColumn id="id_strip" dataField=""> 
    </mx:DataGridColumn> 
    </mx:columns> 
</mx:DataGrid> 

¿Cómo puedo agregar botones en la segunda columna usando un ItemRenderer?

Answer 1

Hay muchas formas de hacerlo.

Se podría utilizar un inline itemRenderer así:

<fx:Script> 
    public function myButton_clickHandler(event:Event):void 
    { 
    Alert.show("My button was clicked!"); 
    } 
</fx:Script> 

<mx:DataGrid width="100%" height="95%" id="id_variableRefList" > 
    <mx:columns> 
    <mx:DataGridColumn id="id_name" dataField=""/> 
    <mx:DataGridColumn id="id_strip" dataField=""> 
     <mx:itemRenderer> 
     <fx:Component> 
     <mx:VBox> 
     <mx:Button label="My Button" click="outerDocument.myButton_clickHandler(event);" /> 
     </mx:VBox> 
     </fx:Component> 
     </mx:itemRenderer> 
    </mx:DataGridColumn> 
    </mx:columns> 
</mx:DataGrid> 

O bien, podría crear un custom component and set the itemRenderer property del DataGridColumn.

<mx:DataGrid width="100%" height="95%" id="id_variableRefList" > 
    <mx:columns> 
    <mx:DataGridColumn id="id_name" dataField=""/> 
    <mx:DataGridColumn id="id_strip" dataField="" itemRenderer="MyCustomItemRenderer"/> 
    </mx:columns> 
</mx:DataGrid> 

ACTUALIZACIÓN: para obtener el ID del botón que se ha hecho clic, se puede utilizar la propiedad currentTarget del event que se pasa a su eventListener.

public function myButton_clickHandler(event:Event):void 
    { 
    Alert.show("Button " + Button(event.currentTarget).id + " was clicked!"); 
    }