`

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" ></...>

分享到:
评论

相关推荐

    设置datagrid行背景色示例

    在本示例中,我们关注的是如何设置 `Datagrid` 的行背景色,以增强视觉效果,帮助用户更好地理解和区分不同的数据。 首先,让我们了解 `Datagrid` 的基本概念。`Datagrid` 是一个控件,通常由多个行和列组成,每一...

    flex DataGrid改变指定行的背景颜色

    // 设置默认背景色 } } } ``` 2. **应用自定义ItemRenderer** 创建好自定义ItemRenderer后,我们需要将其应用到DataGrid的列上。假设我们有一个名为`myColumn`的列,可以这样设置: ```actionscript myColumn....

    datagrid行的背景色

    本文将深入探讨如何在Flex中实现对datagrid行背景色的自定义。 首先,了解Flex Datagrid的基本结构是关键。Datagrid由一系列的DataGridItems组成,每一项对应于数据源中的一个记录。为了改变行的背景色,我们需要...

    Flex DataGrid 改变某一行的背景颜色

    另一个方法是监听DataGrid的`itemRendered`事件,当某一行渲染完成后,检查数据并设置背景色。但这种方法可能会有性能问题,因为每次渲染都会触发事件。 ```actionscript dataGrid.addEventListener(DataGridEvent....

    flex 中datagrid 动态攺变行颜色

    // 根据数据源的rowColor属性设置背景色 } else { backgroundColor = null; // 没有数据时恢复默认背景色 } invalidateProperties(); } // ... } ``` 3. **应用自定义ItemRenderer**:在Datagrid中指定使用...

    flex as actionscript datagrid 背景色 flash itemRenderer script iframe overrider 跳转到别的页面

    你可以为整个DataGrid设置背景色,也可以为特定行或列设置不同的颜色,以达到视觉效果或强调特定数据的目的。 5. **Flash集成**: 虽然Flex和Flash在某些方面有交集,但它们在技术上是独立的。在描述中提到的"flash ...

    FLASH中DataGrid改为交替背景色,一行白色,一行灰色

    在本篇文章中,我们将探讨如何在Flash中对DataGrid组件进行自定义,使其显示交替的行背景颜色(即一行白色,一行灰色)。这种方法类似于Flex框架中的DataGrid样式,并且能够提高用户界面的可读性和美观度。下面将...

    Flex中如何根据每行内容设置不同底色

    在Flex开发中,我们经常需要对数据展示进行定制化,比如根据每行数据的不同来设置不同的背景色。这种需求在数据网格(DataGrid)中尤为常见,可以增强数据的可读性和视觉效果。本篇文章将深入讲解如何在Flex中实现这...

    Flex DataGrid 内嵌AutoCompleteDataGrid

    6. **样式和外观**:为了提供良好的用户体验,可以自定义CellEditor的样式,如背景色、字体、边框等,以及提示列表的显示效果,如高度、动画效果等。 在实际开发中,`src`文件夹可能包含了实现这一功能的源代码,...

    Flex 自定义DataGrid实现根据条目某一属性值改变背景颜色

    通过上述步骤,我们可以在Flex DataGrid中实现根据数据项属性值动态改变行背景色的功能。这不仅增强了界面的视觉效果,还提高了用户体验,因为它允许开发者对信息的重要性和状态进行更直观的表达。 文档最后还提到...

    DataGrid控件

    使用DefaultCellStyle、HeaderStyle、AlternatingRowStyle等属性可以调整单元格的字体、颜色、背景色等。 7. **事件处理** DataGrid控件有丰富的事件,如CellClick、CellFormatting、RowValidating等,开发者可以...

    flex实现DataGrid高亮显示数据功能的解决方案

    这样,特定行就会显示不同的背景色,从而实现高亮显示效果。 需要注意的是,虽然这种方法能够实现高亮显示数据的功能,但对原有的DataGrid组件进行改写和扩展可能会使代码变得更加复杂,维护起来可能也会更加困难。...

    10多个FLex 3 的源码(整理)

    源码中提到的“DataGrid弹出框添加数据”可能展示了如何通过弹出对话框来动态添加新的行或列到DataGrid中。这通常涉及到事件监听、数据绑定以及自定义UI组件的创建,以实现更丰富的用户交互。 “弹出框样式”这部分...

    datagrid.rar_Windows编程_Flex_

    例如,如果某个数据项的值表示状态,你可以用条件语句判断状态并设置相应的背景色。 ```actionscript public class CustomItemRenderer extends ListBaseItemRenderer { override public function set data(value:...

    flex 3 所有可视控件实例

    2. Colorpicker:Colorpicker 控件允许用户选择颜色,常用于颜色配置或设置背景色等场景。 3. Combobox:Combobox 是一个组合了下拉列表的文本输入框,用户可以选择列表中的选项或者自定义输入。 4. Datagrid:...

    flex 页面增删改以及柱形数据变化

    例如,可以通过修改CSS类或使用states来改变数据项在选中或未选中时的背景色。 对于**柱形数据变化**,Flex的Charts组件提供了一种直观的方式来展示数据。我们可以通过改变ArrayCollection中的数据来动态更新柱形图...

    flex中渲染器简介

    例如,如果你试图改变列表中第五行的第四列背景色,你需要注意,一旦用户滚动列表,这个渲染器可能会被用来显示其他数据,因为它会被复用。因此,正确的做法是让渲染器根据所显示的数据动态地改变其自身状态。 内联...

    flex4.5httpservice实现搜狐焦点图新闻和特效按钮皮肤制作

    开发者可以通过创建 CSS 样式或使用 MXML 来定义按钮的外观,包括不同状态(如正常、鼠标悬停、按下)下的背景色、边框、文字样式等。同时,可以利用 Flex 的动画库,如 TweenLite 或 AnimateCC,为按钮添加过渡效果...

    理解_Flex_itemRenderer.pdf

    这种方法大幅提高了应用的性能,但同时也带来了挑战,尤其是在需要根据数据动态更改UI元素时,比如更改特定单元格的背景色。 针对动态更改UI元素的需求,itemRenderer需要具备根据数据自动更新其内容和样式的功能。...

Global site tag (gtag.js) - Google Analytics