`

flex datagrid 动态设置行背景色

阅读更多

在实际的项目需求中,如果要求,某一列的背景色统一,并且其他列的背景色呈规律颜色(奇偶)出现,并且替换datagrid行交替颜色,这时,我们可以通过重写datagrid的方法并结合datagridColumn的backgroundColor来实现。不管tr行背景颜色如何,datagridcolumn的backgroundColor始终会覆盖其颜色。

 

实现类:

private var _rowColorFunction:Function;

public function set rowColorFunction(f:Function):void
  {
   this._rowColorFunction = f;
  }
  
  public function get rowColorFunction():Function
  {
   return this._rowColorFunction;
  }

 

override protected function drawRowBackground(s:Sprite,rowIndex:int,y:Number, height:Number, color:uint, dataIndex:int):void
  {   
   if(this.rowColorFunction != null)
   {
    if(dataIndex < this.dataProvider.length)
    {
     var item:Object = this.dataProvider.getItemAt(dataIndex);
     color = this.rowColorFunction.call(this,item,color);
    }
   }           
   super.drawRowBackground(s, rowIndex, y, height, color, dataIndex);
  }

 


mxml : 

   1、<mx:Application ... xmlns:BaseUI="render.*" ></...>

   2、//改变颜色方法   
   private function rowColorFunction(item:Object, color:uint):uint
   {     
    if(item.id=="0"){color=0xFFA500;}
    else if(item.id=="1"){color=0xF10026;}
    else if(item.id=="2"){color=0x9370DB;}
    else if(item.id=="3"){color=0x26972d;}
    else if(item.id=="4"){color=0xFFDF00;}
    return color;
   }  

  3、 <BaseUI:CustomerDataGrid  ....  rowColorFunction="rowColorFunction" ></...>

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics