自定义DataGrid显示的办法

来源:互联网 发布:魅影坐骑进阶数据 编辑:程序博客网 时间:2024/05/18 00:23

 代码代码,依然是代码,下面这个是一个自定义了特定列,和特定列的单元格的DataGrid(当然,这两个不再在一列上):

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    
<mx:Script>
        
<![CDATA[
          import mx.collections.ArrayCollection;
        
          [Bindable]
          private var initDG:ArrayCollection = new ArrayCollection([
            {Artist:'Pavement', Album:'Slanted and Enchanted', 
                Price:11.99, SalePrice: true },
            {Artist:'Pavement', Album:'Brighten the Corners', 
                Price:11.99, SalePrice: false }
          ]);   
        
]]>
    
</mx:Script>

    
<mx:DataGrid id="myGrid" 
        dataProvider
="{initDG}" 
        variableRowHeight
="true"> 
        
<mx:columns>
            
<mx:DataGridColumn dataField="Artist" itemRenderer="item.RendererDGHeader"/>
            
<mx:DataGridColumn dataField="Album"/>
            
<mx:DataGridColumn dataField="Price"/>
            
<mx:DataGridColumn width="150" dataField="SalePrice" 
                headerRenderer
="item.RendererDGHeader"/>
        
</mx:columns>       
    
</mx:DataGrid>  

</mx:Application>

大家可以看出,columns这个标签的设置确定了他是采用什么ItemRender,而columns是什么呢?他是一个属性,类型是一个以DataGridColumn为元素的Array,这个DataGridColumn有两个属性我们注意一下,那是我们这篇文章的核心,那就是itemRender和headerRender,顾名思义,分别是定义单元格和列标题头的对应属性名,我写了一个自定义的itemRender,代码如下:

 

<?xml version="1.0"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">
    
<mx:Script>
        
<![CDATA[

            [Embed(source="/xtal_03.png")]
            [Bindable]
            public var sale:Class;            
        
]]>
    
</mx:Script>

    
<mx:Label text="Sale Price!"/>
    
<mx:Image height="20" width="20" source="{sale}"/>

</mx:HBox>
测试一下,你就看到效果了
原创粉丝点击