Flex DataGrid中加入checkbox，button的方法

表格是我们经常用到的一种组件，但是在实际生活中我们经常要用到表格和复选框、按钮组合应用的要求，因此要往DataGrid中添加checkbox和button组件。

 

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;
            import mx.events.FlexEvent;
            
            [Bindable]
            private var foodArr:ArrayList = new ArrayList([{food:"咖啡"},{food:"苹果"},{food:"火腿"},{food:"米饭"}]);
            
        ]]> 
    </fx:Script>
     <mx:DataGrid id="MyGrid" rowCount="4" dataProvider="{foodArr}" top="20" left="20">
        <mx:columns>
            <mx:DataGridColumn dataField="food" headerText="食物名称"/>
            <mx:DataGridColumn headerText="查看热量">
                <mx:itemRenderer>
                    <fx:Component>
                        <mx:Button label="查看热量"/>
                    </fx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
            <mx:DataGridColumn headerText="加入列表">
                <mx:itemRenderer>
                    <fx:Component>
                        <mx:HBox paddingLeft="10">
                            <mx:CheckBox selected="false"/>
                            <mx:Label text="加入列表"/>
                        </mx:HBox>
                    </fx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>
</s:WindowedApplication>

在Flash Builder4.6里面，以上的标签除了<fx:Component>之外，其他的一律要用<mx>而不能用<s>，我也不知道为什么，如果修改就会就会报错。

运行结果如下：