PDA

View Full Version : how to fit column width to header length in DataGrid?


ivan_sh
01-08-2009, 10:57 AM
Hi

Who can help me with the following task, please?
I have some DataGrid.
Headers of columns can have different length, and I need to implement columns resizing depends of header length.

how must I implement my renderer?
from what component it's better to inherit my renderer component?
how can I get header lentgh in pixels?
and then how can I set column width?

can I create renderer as following?

<mx:Label xmlns:mx="http://www.adobe.com/2006/mxml" >

<mx:Script>
<![CDATA[

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

override public function set data(value:Object):void
{

if(value != null)
{

// so I can get text length:
var myListData:DataGridListData = DataGridListData(listData);
var textLength:int = myListData.label.length;

// i can change text of header:
text = "bla-bla";

// but how can I get text width in pixels and how can i set width of the column??
// ....
}

}

</mx:Script>

</mx:Label>

best Regards,
Ivan.

wvxvw
01-08-2009, 07:32 PM
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:Model id="model0">
<grid>
<column0>some data</column0>
<column1>some more data</column1>
</grid>
</mx:Model>

<mx:Script>
<![CDATA[
import flash.events.Event;
import mx.controls.dataGridClasses.DataGridColumn;

public function clickHandler(event:Event):void
{
(DG1.columns[0] as DataGridColumn).headerText = columnName.text;
}
]]>
</mx:Script>

<mx:DataGrid dataProvider="{model0}" width="500" id="DG1">
<mx:columns>
<mx:DataGridColumn dataField="column0">

<mx:headerRenderer>
<mx:Component>
<mx:Label truncateToFit="false">
<mx:Script>
<![CDATA[
import flash.events.Event;
import mx.controls.DataGrid;
import mx.controls.dataGridClasses.DataGridColumn;

override public function set text(value:String):void
{
super.text = value;
if (parent)
{
((parent.parent as DataGrid).columns[0] as
DataGridColumn).width = measuredWidth;
}
}
]]>
</mx:Script>
</mx:Label>
</mx:Component>
</mx:headerRenderer>

</mx:DataGridColumn>

<mx:DataGridColumn dataField="column1" />

</mx:columns>
</mx:DataGrid>

<mx:Button click="clickHandler(event)" label="Reset first column width"/>

<mx:TextInput id="columnName" text="Type new column name here"/>

</mx:Application>

But this doesn't seem to be a good way to do it... I just can't figure out how to refer the DataGridColumn relatively to it's headerRenderer...

ivan_sh
01-09-2009, 11:25 AM
But this doesn't seem to be a good way to do it... I just can't figure out how to refer the DataGridColumn relatively to it's headerRenderer...

Great, thanks!

It working ok and at the moment I will use this way.
The main disadvantage is that I need to call this renderer for every column.. I am afraid, that this application will be slow because of it.

I've tried to create renderer for whole DataGrid: to process every column in the "for" loop.. but, as You've notice, I can't get access to the column object and to the column header at the same time..

Could anyone advise something else?

and thank You, wvxvw.