Changing Selection Indicator in Datagrid
add Tween, alpha, shape, etc.
Categories: FlexSo I was recently working on a project, and the client wanted to have a different effect on the DataGrid's selection indicator. He said that he wanted the indicator to fade rather than the default "hard" appear. After doing some digging, I found a post about changing the List Selection indicator which was pretty close to what I needed, but this was for a TileList. The good news is that DataGrid inherits from the List base class, and the List Selection indicator methods are in there as well. Sound easy!
The two methods in question are the drawSelectionIndicator() and drawHighlightIndicator() in the ListBase.as class. If you override these two methods, you can create some pretty cool effects. Here is an example of implementing a Tweener fade, and setting the final alpha to 50%:
override protected function drawSelectionIndicator(
indicator:Sprite, x:Number, y:Number, width:Number,
height:Number, color:uint,
itemRenderer:IListItemRenderer):void{
var g:Graphics = Sprite(indicator).graphics;
g.clear();
g.beginFill(color,.25);
g.drawRect(0,0,width,height);
g.endFill();
indicator.x = x;
indicator.y = y;
}
override protected function drawHighlightIndicator(
indicator:Sprite, x:Number, y:Number, width:Number,
height:Number, color:uint,
itemRenderer:IListItemRenderer):void{
var g:Graphics = Sprite(indicator).graphics;
g.clear();
g.beginFill(color,.5);
g.drawRect(0,0,width,height);
g.endFill();
indicator.x = x;
indicator.y = y;
indicator.alpha = 0;
Tweener.addTween(indicator,({alpha:.5, time:1, transition:"easeOutCubic"})); }
package com.swfflex
{
import caurina.transitions.*;
import flash.display.Graphics;
import flash.display.Sprite;
import mx.controls.DataGrid;
import mx.controls.listClasses.IListItemRenderer; public class DataGridEx extends DataGrid
{ override protected function drawSelectionIndicator(
indicator:Sprite, x:Number, y:Number, width:Number,
height:Number, color:uint,
itemRenderer:IListItemRenderer):void{
var g:Graphics = Sprite(indicator).graphics;
g.clear();
g.beginFill(color,.25);
g.drawRect(0,0,width,height);
g.endFill();
indicator.x = x;
indicator.y = y;
}
override protected function drawHighlightIndicator(
indicator:Sprite, x:Number, y:Number, width:Number,
height:Number, color:uint,
itemRenderer:IListItemRenderer):void{
var g:Graphics = Sprite(indicator).graphics;
g.clear();
g.beginFill(color,.5);
g.drawRect(0,0,width,height);
g.endFill();
indicator.x = x;
indicator.y = y;
indicator.alpha = 0;
Tweener.addTween(indicator,({alpha:.5, time:1, transition:"easeOutCubic"})); }
override protected function clearHighlightIndicator(indicator:Sprite, itemRenderer:IListItemRenderer):void{
if(highlightIndicator)
Tweener.addTween(indicator,({alpha:0, time:1, transition:"easeOutCubic", onComplete:function():void{Sprite(highlightIndicator).graphics.clear()}}));
} }
}
360 Flex recap
My recap of the event in San Jose
Categories: 360 FlexSo, here is my recap from the 360|Flex conference in San Jose:
First off, I would like to congratulate Tom & John for putting on such a great event. The venue at eBay was awesome, and the turnout was equally as good. Second, as promised, I have posted my slides from my hands-on presentation here, and my example app with source code (right-click) here. Also, you can watch my session on AMP by following the instructions here. While I haven't yet seen any of the feedback from the survey app, most people said they got a lot out of my session...which is great. I tried to make it as unusual and hands-on as possible, so I think most people were surprised to see the full size chromakey backdrop set and lighting. I was running out of time at the end though, so I did feel a bit rushed when writing the example application with the class which caused some app errors. Also if you watch the session on AMP, since it was a hands-on class, you will not get to see the lighing and camera setups. Sorry about that!
Some of the sessions I saw that I think were great was Ben Stucki's How to Build A Framework, and Ryan Campbell's session on Plexiglass 3D. Another one of note that was totally not expected was Joel Geraci's session on Flex and Acrobat. It's amazing how Flash/Flex and other Adobe products are integrating so well, and how paper media seems to be just so passé now.The event parties were great networking events and most people seemed to be working the room really well. Jeffry Houser had some great live Flex Show interviews, and even Doug McCune showed up un-expectantly at Tuesday's event.If you missed this sold-out event, I would recommend you get on the ball for the next one, as it is the premier conference for anyone interested in Flex.
-Christopher Keeler
