Flex AdvancedDataGrid 设置每一行的背景色

一、DataGrid

继承DataGrid添加

 

      /**用于设置每行的颜色
       * uint表示返回的颜色值
       * @param item 对应每列的数据
       * @param color 对应原始的颜色值
       * @param dataIndex 数据索引
       * @return uint 表示返回的颜色值
       *
       */	
		public var rowColorFunction:Function;
        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,dataIndex);
                  }
            }           
            super.drawRowBackground(s, rowIndex, y, height, color, dataIndex);
        }

 

 

 

二、AdvancedDataGrid

 

继承 AdvancedDataGrid 添加

 

      /**用于设置每行的颜色
       * uint表示返回的颜色值
       * @param item 对应每列的数据
       * @param color 对应原始的颜色值
       * @param dataIndex 数据索引
       * @return uint 表示返回的颜色值
       *
       */		
		public var rowColorFunction:Function;
        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 )
                  {
                       color = this.rowColorFunction.call(this, listItems[rowIndex][0].data,color,dataIndex);
                  }
            }           
            super.drawRowBackground(s, rowIndex, y, height, color, dataIndex);
        }	

 与dataGrid为何不同呢，因为AdvancedDataGrid 是一种支持层级数据源的高级表格。通过查看AdvancedDataGrid 的源代码，会发现其在调用drawRowBackground 时传递的rowIndex:int实际上就是从listItems中获取的长度，这样就可获取他们的data。 也就是数据源item

 

三、使用

 

 

            /**
            * 设置表格颜色隔行渐变
            */    
            private function setCustomColor(item:Object, color:uint,dataIndex:int):uint 
            { 
                if( dataIndex % 2 == 1 ) 
                { 
                    return 0xFEF3D1; 
                } 

                return color;
            }

 

   效果：

    /**

            * 某行Territory_Rep列  == "T.R. Smith"时变色
            */              
           private function setCustomColor2(item:Object, color:uint,dataIndex:int):uint 
            { 
                if( item.Territory_Rep  == "T.R. Smith" ) 
                { 
                    return 0xFEF3D1; 
                } 

                return color;
            } 

    效果：

评论

1 楼 q87691116 2016-07-25  

rowColorFunction 和setCustomColor2 怎么关联调用的呢 新学 flex