在 Flex 中更改高级数据网格控件的行颜色

Question

我正在使用 Flash Builder 4.6。在 flex 应用程序中创建一个 AdvancedDataGrid。我想更改 AdvancedDataGrid 控件第 5 行的 rowColor。

这是我的代码。

<?xml version="1.0"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"  
           xmlns:mx="library://ns.adobe.com/flex/mx"  
           xmlns:s="library://ns.adobe.com/flex/spark"> 
<fx:Script> 
    <![CDATA[ 
        import mx.collections.ArrayCollection; 

        [Bindable] 
        private var dpADG:ArrayCollection = new ArrayCollection([ 
            {Row:1, Artist:'Pavement', Album:'Slanted and Enchanted', Price:11.99}, 
            {Row:2, Artist:'Pavement', Album:'Brighten the Corners', Price:11.99}, 
            {Row:3, Artist:'Saner', Album:'A Child Once', Price:11.99}, 
            {Row:4, Artist:'Saner', Album:'Helium Wings', Price:12.99}, 
            {Row:5, Artist:'The Doors', Album:'The Doors', Price:10.99}, 
            {Row:6, Artist:'The Doors', Album:'Morrison Hotel', Price:12.99}, 
            {Row:7, Artist:'Grateful Dead', Album:'American Beauty', Price:11.99}, 
            {Row:8, Artist:'Grateful Dead', Album:'In the Dark', Price:11.99}, 
            {Row:9, Artist:'Grateful Dead', Album:'Shakedown Street', Price:11.99}, 
            {Row:10, Artist:'The Doors', Album:'Strange Days', Price:12.99}, 
            {Row:11, Artist:'The Doors', Album:'The Best of the Doors', Price:10.99} 
        ]);                    
    ]]> 
</fx:Script> 
<mx:AdvancedDataGrid width="100%" height="100%" dataProvider="{dpADG}" editable="true"
                     selectionMode="none" sortExpertMode="true"> 
    <mx:columns> 
        <mx:AdvancedDataGridColumn dataField="Row" />
        <mx:AdvancedDataGridColumn dataField="Artist" /> 
        <mx:AdvancedDataGridColumn dataField="Album" /> 
        <mx:AdvancedDataGridColumn dataField="Price" /> 
    </mx:columns> 
</mx:AdvancedDataGrid>         
</s:Application>

Answer 1

我没有尝试使用AdvancedDataGrid，但是当我尝试设置DataGrid 的行颜色时。我通过创建自定义 DataGrid (mxml) 然后使用以下方法来做到这一点：

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 as ArrayCollection).length )
        {
            var item:Object = (this.dataProvider as ArrayCollection).getItemAt(dataIndex);
            color = this.rowColorFunction.call(this, item, dataIndex, color);
        }
    }

    super.drawRowBackground(s, rowIndex, y, height, color, dataIndex);
}


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

public function get rowColorFunction():Function
{
    return this._rowColorFunction;
}

例子：

myGrid.rowColorFunction = function(item:Object, dataIndex:int, color:uint):uint
{
    //conditions then return your color here
}