DataGrid Headerrenderer - Header Tooltip
package mypackage
{
import mx.controls.Text;
public class DGHeaderRenderer extends Text
{
public function DGHeaderRenderer()
{
height = 20;
}
override public function set data(value:Object):void {
super.data = value;
this.toolTip = "Click to sort by this column or reverse sort order.";
super.invalidateDisplayList();
}
}
}
and use the above as
<mx:DataGridColumn id="mycol" headerText="Col" dataField="col1" headerRenderer="mypackage.DGHeaderRenderer"/>
http://www.cflex.net/showFileDetails.cfm?ObjectID=443&Object=File&ChannelID=1
View Demo
3 comments:
hi, your post is very useful. How can I pass a parameter to be displayed in the tooltip?
this.toolTip = "Click to sort by this column or reverse sort order." + myParameter;
Thank You
To pass different tooltips for different columns, I got trick here (it might not be the best way but works) that I am passing both headerText and tooltip into headerText by concatenating both texts by some delimiter. Here in this example I have used ::: as delimiter just by guessing least expected. And then parsing it in to render to split them assign to text and tooltip.
public class dataGridHeaderRenderer extends Label
{
public function vhaDataGridHeaderRenderer()
{
super();
}
override public function set data(value:Object):void {
if(value is DataGridColumn)
{
var column:DataGridColumn = value as DataGridColumn
var tmpString:String = column.headerText;
var arr:Array = tmpString.split(":::");
if(arr.length > 0)
{
this.text = arr[0] as String;
super.data = column;
}
if(arr.length > 1)
{
this.toolTip = arr[1] as String;
}
}
super.invalidateDisplayList();
}
}
}
Thanks for your comment, i've used ClassFactory "properties" property hope it helps:
var arr:Array = new Array();
var dgc:AdvancedDataGridColumn = new AdvancedDataGridColumn("mycol");
dgc.headerText = "MyColHeader";
var colRendererFactoryTT:ClassFactory = new ClassFactory(DGTooltipRenderer);
colRendererFactoryTT.properties = {key1:"value1",key2:"value2"};
dgc.headerRenderer = colRendererFactoryTT;
arr.push(dgc);
this.myAdvancedDatagrid.columns = arr;
[DGTooltipRenderer.as]
package mypack {
import mx.controls.Text;
import mx.managers.ToolTipManager;
public class DGTooltipRenderer extends Text {
ToolTipManager.showDelay = 0; //for instant tooltip presentation on mouse over
public var key1:String;
public var key2:String;
override public function set data(value:Object):void {
super.data = value;
this.toolTip = "Key1: "+this.key1+" - Key2: "+this.key2;
super.invalidateDisplayList();
}
}
}
Post a Comment