170656529.png

1.新建一个扩展组件 DataGridFieldFont.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Label xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">
    <mx:Script>
        <![CDATA[
                                                      
            [Bindable]
            public var fildName:String="";
                                                      
            override public function set data(value:Object) : void
            {
                super.data = value; //得到DataGrid的集合对象
                var s:Number=value[fildName] as Number; //获取对象的属性值
                if(Number(value[fildName])>0){
                    this.htmlText = '<font color="#FF0000">+' + s + '%</font>'; //通过Label的htmlText属性写html代码
                }else if(Number(value[fildName])<0){
                    this.htmlText = '<font color="#008000">' + s + '%</font>';
                }else{
                    this.htmlText=s+"%";
                }
            }
        ]]>
    </mx:Script>
</mx:Label>

2.在DataGrid使用扩展


<mx:DataGrid id="dataGrid"
             width="100%"
             height="100%">
    <mx:columns>
        <mx:DataGridColumn headerText="测试颜色" width="100" dataField="hehe">
            <mx:itemRenderer>
                <mx:Component>
                   <fx:DataGridFieldFont fildName="hehe"/>
                 </mx:Component>
             </mx:itemRenderer>
          </mx:DataGridColumn>
    </mx:columns>
</mx:DataGrid>