Flex datagrid行数据颜色设置

摘要

Flex Datagird行颜色设置问题,在datagird是flex中非常重要的一个数据组件,也是最常用的一个组件,下面就2中场景给予实现。

Flex Datagird行颜色设置问题,在datagird是flex中非常重要的一个数据组件,也是最常用的一个组件,下面就2中场景给予实现。

  1. datagird其中一个单元格数据颜色设置,如下:

  

head1head2head3
AAAABBBCCCDDDEEE

现在要求第一行第三列数据中的DDD显示红色

实现方式:直接上源码:

<mx:DataGrid width="100%" height="100" dataProvider="{arryInfo}" verticalAlign="middle"  verticalScrollPolicy="on" variableRowHeight="true" headerHeight="20">
    <mx:columns>
         <mx:DataGridColumn headerText="head1"    dataField="f1" textAlign="center" width="100"  editable="false" />
         <mx:DataGridColumn headerText="head2"dataField="f2" editable="false" width="100" textAlign="center"/>  
         <mx:DataGridColumn headerText="head3"dataField="f3"    editable="false"  textAlign="left" wordWrap="true">
            <mx:itemRenderer>
               <mx:Component>
                  <itemRenderers:DataGirdFontItemRenderer />
               </mx:Component>
           </mx:itemRenderer>
         </mx:DataGridColumn>
     </mx:columns>
 </mx:DataGrid>

自定义一个列DataGirdFontItemRenderer,处理该列颜色问题,DataGirdFontItemRenderer源码:

<?xml version="1.0" encoding="utf-8"?>
<mx:Label xmlns:mx="http://www.adobe.com/2006/mxml" truncateToFit="true">
<mx:Script>
<![CDATA[
public override function set data(value:Object):void{
super.data = value;
var str:String = value.f3+"";//获取列的数据
if(-1!= str.indexOf("*")){//给每列数据一个标致,
  //this.height=50;
  this.htmlText='CCC<font color="#FF0000">DDD</font>EEE';
}
}
]]>
</mx:Script>
</mx:Label>

这样就可以设置datagird一个单元格里面的内容显示不同颜色,如果所有的列数据都需要设置颜色,就不要

if(-1!= str.indexOf("*"))条件


IT家园
IT家园

网友最新评论 (0)