Flex DataGrid渲染图片

初学flex，遇到一个问题‘在datagrid的一列中利用它的值转换显示不同的图片’，在网上搜了搜问了问，解决了哎,解决办法贴出来，希望对其他人有帮助，

利用datagrid的labelFunction解决的，如下：

在datagrid的

<mx:DataGridColumn  dataField="level"  labelFunction="formatiImg"/>

 private var itemRenderImg:PerfStutsIFactory = new PerfStutsIFactory();

     private function formatiImg(item:Object,column:DataGridColumn):void{

         itemRenderImg.data=item;

         column.itemRenderer=itemRenderImg; 

     }

需要转换datagrid里面就做这些，其中PerfStutsIFactory 为一个实现了IFactory接口的类，代码如下：

PerfStutsIFactory.as

package  com.vv.shop.fx

{

 import mx.core.IFactory;

 public class PerfStutsIFactory implements IFactory  

    {  

     public var data:Object;

        public function PerfStutsIFactory(){  

            super();  

        }  

        public function newInstance():*{  

            //实例化渲染器，实现具体功能  

          var  imgRenderer:ImgPerfRenderer =  new ImgPerfRenderer();  

               imgRenderer.data=data;

             return imgRenderer;

        }  

    }  

} 

然后就看具体的实现类了，ImgPerfRenderer.mxml,在这个里面进行数据到不同图片的转换吧，代码如下：

ImgPerfRenderer.mxml：

<?xml version="1.0" encoding="utf-8"?>

<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" backgroundAlpha="0.0" width="100%"   

     horizontalAlign="center">    

 <mx:Script>

  <![CDATA[

   import mx.controls.Alert;

    [Bindable]

    private var url:String;

  [Embed(source="/com/vv/shop/fx/style/image/perfRed.png")]   //红

        private var perfRedIcon:Class;  

        [Embed(source="/com/vv/shop/fx/style/image/perfOrange.png")]   //橙

        private static const OrangeIcon:Class;  

        [Embed(source="/com/vv/shop/fx/style/image/perfPrimary.png")]   //黄

        private static const PrimaryIcon:Class;  

        [Embed(source='/com/vv/shop/fx/style/image/perfBlue.png')]//蓝

  private static const  BlueIcon:Class;

        [Embed(source="/com/vv/shop/fx/style/image/perfGreen.png")]   //绿

        private static const GreenIcon:Class;  

   public function gifUrl(data:Object):Object

   {

    //data 是从父页面datagarid里面穿过来的级别。根据级别进行图片选择呈现。

    // if(data==null) return null;            

            if(data.perf_level!=null&&"1"==data.level){return GreenIcon;}

            if(data.perf_level!=null&&"2"==data.level){return BlueIcon;}

            if(data.perf_level!=null&&"3"==data.level){return PrimaryIcon;}

            if(data.perf_level!=null&&"4"==data.level){return OrangeIcon;}

            if(data.perf_level!=null&&"5"==data.level){return RedIcon;}

            return GreenIcon;            

   }   

  ]]>

 </mx:Script>

 <mx:Image id="Readleve" source="{gifUrl(this.data)}"/>

</mx:HBox> 

可能是复杂了点走了弯路，但做出来了也高兴一下！