Flex dataGrid 使用 ItemRenderer 在 datagridcolumn 中添加按钮？

Question

我有这个代码。我想在数据网格的第二列中添加按钮。

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

如何使用 ItemRenderer 在第二列中添加按钮？

Answer 1

有很多方法可以做到这一点。

您可以像这样使用 内联 itemRenderer ：

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

或者您可以创建一个 < a href="http://www.switchonthecode.com/tutorials/flex-using-item-renderers" rel="noreferrer">自定义组件并设置 itemRenderer 属性 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>

更新：
要获取所单击按钮的 ID，您可以使用传递给 eventListener 的 event 的 currentTarget 属性。

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