[英]How to set alternate row color in flex datagrid?
What is the method to set different colors for alternate rows in a flex datagrid? 为flex数据网格中的备用行设置不同颜色的方法是什么? So that two adjacent rows are identified easily?
那么容易识别出两个相邻的行?
Use alternatingItemColors
style. 使用
alternatingItemColors
样式。 You can specify as many colors as you want in the array. 您可以在数组中指定任意数量的颜色。
<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>
This style takes effect only if no backgroundColor
is specified. 仅当未指定
backgroundColor
此样式才会生效。
I used itemRenderer into DataGridColumn 我将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();
}
}
An alternative method is to use the DataItemBound(Object, DataGridItemEventArgs)
event handler. 另一种方法是使用
DataItemBound(Object, DataGridItemEventArgs)
事件处理程序。
The Object in this event signature is the DataGrid control, so recast it and use .DataGrid.Items.Count
modulo 2 to obtain a reference for when .DataGridItemEventArgs.Item
is an alternate row. 此事件签名中的Object是DataGrid控件,因此重新
.DataGrid.Items.Count
它并使用.DataGrid.Items.Count
模2来获取何时.DataGridItemEventArgs.Item
是备用行的引用。 I then created a css style for the alternate and changed .DataGridItemEventArgs.Item.CssClass
to that newly created style. 然后我为备用创建了一个css样式,并将
.DataGridItemEventArgs.Item.CssClass
更改为新创建的样式。
The advantage with this method is that other row color manipulation can be done after this for highlighting; 这种方法的优点是可以在此之后进行其他行颜色操作以突出显示; the
alternateItemColor
solution from above will always be the last css change before rendering, potentially overwriting any other highlighting. 上面的
alternateItemColor
解决方案将始终是渲染前的最后一次css更改,可能会覆盖任何其他突出显示。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.