I have managed to color the rows of a data grid object separately, however giving them a nice tween effect is proving to be more tricky. I wish to make it so that when a row is edited it turns gray and then fades back to white.
When I edit a single row this works fine. But when I edit a second row the tween shows up on both of them. The sprite sent to gridColor is indeed the same independently of which line I am editing (weird imo).
(Each element in my dataprovider has two extra values color and color_to so that it knows when to tween. )
package Controls
{
import flash.display.Sprite;
import gs.TweenLite;
import mx.controls.DataGrid;
public class ExtendedDataGrid extends DataGrid
{
public var rowColorFunction:Function;
private var colorTween:TweenLite;
override protected function drawRowBackground(s:Sprite,
rowIndex:int, y:Number, height:Number, color:uint, dataIndex:int):void{
if(rowColorFunction != null && dataProvider != null){
var item:Object;
if(dataIndex < dataProvider.length){
item = dataProvider[dataIndex];
}
if(item){
color = rowColorFunction(s, item, rowIndex, dataIndex, color);
}
}
super.drawRowBackground(s, rowIndex, y, height, color, dataIndex);
}
public function gridColor(s:Sprite, item:Object, rowIndex:int, dataIndex:int, color:uint):uint{
if(item.color != item.color_to){
if(colorTween)
TweenLite.removeTween(colorTween);
colorTween = TweenLite.to(s, 0, {removeTint:true});
colorTween = TweenLite.to(s, 1, {tint:item.color_to});
}
item.color_to = item.color;
return item.color;
}
}
}
Any ideas ?