如何在flex datagrid中設置備用行顏色？

Question

為flex數據網格中的備用行設置不同顏色的方法是什么？ 那么容易識別出兩個相鄰的行？

Answer 1

使用alternatingItemColors樣式。 您可以在數組中指定任意數量的顏色。

<mx:DataGrid id="dg" alternatingItemColors="[#449933, #994433]"
    dataProvider="{[{d:'ASD', c:'$#'},{d:'WER', c:'^@'},{d:'VCB', c:'*!'}]}">
    <mx:columns>
        <mx:DataGridColumn dataField="d"/>
        <mx:DataGridColumn dataField="c"/>
    </mx:columns>
</mx:DataGrid>

僅當未指定backgroundColor此樣式才會生效。

Answer 2

我將itemRenderer用於DataGridColumn

<mx:DataGrid>
   <mx:columns>
      <mx:DataGridColumn dataField="A" itemRenderer="com.shels.table.MarkObject"/>
      <mx:DataGridColumn dataField="B" />
   </mx:columns>
</mx:DataGrid>

package com.shels.table {

import flash.display.Graphics;
import flash.geom.Matrix;

import mx.controls.Label;
import mx.controls.dataGridClasses.*;

public class MarkObject extends Label {

    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
        super.updateDisplayList(unscaledWidth, unscaledHeight);

        var g:Graphics = graphics;
        g.clear();

        var dField:String = DataGridListData(listData).dataField;
        var f:int = DataGridListData(listData).columnIndex;

        var c:int = 0xFFFFFF; 

        // c = parseInt( data[ "color"]);
        // You can to use field values from record.

        g.beginFill( c);
        g.drawRect(0, 0, unscaledWidth, unscaledHeight);

        g.endFill();
    }
}

Answer 3

另一種方法是使用DataItemBound(Object, DataGridItemEventArgs)事件處理程序。

此事件簽名中的Object是DataGrid控件，因此重新.DataGrid.Items.Count它並使用.DataGrid.Items.Count模2來獲取何時.DataGridItemEventArgs.Item是備用行的引用。 然后我為備用創建了一個css樣式，並將.DataGridItemEventArgs.Item.CssClass更改為新創建的樣式。

這種方法的優點是可以在此之后進行其他行顏色操作以突出顯示; 上面的alternateItemColor解決方案將始終是渲染前的最后一次css更改，可能會覆蓋任何其他突出顯示。