Flex 3: DataGrid Column width on resize

[srilatha_reddy]

Hello experts,

I am facing an issue with width of DataGrid columns. We are using Flex 3.2.

I am setting the widths for columns in creationComplete handler of DataGrid. When the browser window is resized, say restore down and then maximize,

the column widths are changing. Please find the code below:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" height="100%" width="100%">
<mx:Script>
    <![CDATA[
        import mx.core.ScrollPolicy;
        [Bindable]
        private var isVisible:Boolean = true;
   
        private function creationCompleteHandler():void{
            dataGrid.horizontalScrollPolicy = ScrollPolicy.ON;
            artist.width = dataGrid.width * 0.40;
            album.width = dataGrid.width * 0.50;
            Price.width = dataGrid.width * 0.10;
            dataGrid.horizontalScrollPolicy = ScrollPolicy.OFF;
        }
       
       
    ]]>
</mx:Script>

<mx:DataGrid id="dataGrid" width="80%" height="100%" creationComplete="creationCompleteHandler()">
      <mx:ArrayCollection>
         <mx:Object Artist="Pavement" Price="11.99"
            Album="Slanted and Enchanted" />
         <mx:Object Artist="Pavement"
            Album="Brighten the Corners" Price="11.99" />
      </mx:ArrayCollection>
      <mx:columns>
          <mx:DataGridColumn id="artist" dataField="Artist"/>
         <mx:DataGridColumn id="album" dataField="Album" visible="{isVisible}"/>
         <mx:DataGridColumn id="Price" dataField="Price" />
        
      </mx:columns>
   </mx:DataGrid>

</mx:Application>

Is there anything wrong i am doing here? Please help me in resolving this.

Thanks,

Srilatha

[kprmca]

Hi Srilatha,

DataGrid width is 100% and the main application width also 100%, So the

DataGrid will try to occupy the whole window, when you do "restore down" &

"maximize" Application width will change.. and it will effect DataGrid and

its columns also. Try to give some fixed width for dataGrid and you can

expect the result.

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"

height="100%" width="100%">

<mx:Script>

<![CDATA[

import mx.core.ScrollPolicy;

private var isVisible:Boolean = true;

private function creationCompleteHandler():void

{

dataGrid.horizontalScrollPolicy = ScrollPolicy.ON;

artist.width = dataGrid.width * 0.40;

album.width = dataGrid.width * 0.50;

Price.width = dataGrid.width * 0.10;

dataGrid.horizontalScrollPolicy = ScrollPolicy.OFF;

}

]]>

</mx:Script>

<mx:DataGrid id="dataGrid" width="500" height="100%"

creationComplete="creationCompleteHandler()">

<mx:ArrayCollection>

<mx:Object Artist="Pavement" Price="11.99"

Album="Slanted and Enchanted" />

<mx:Object Artist="Pavement"

Album="Brighten the Corners" Price="11.99" />

</mx:ArrayCollection>

<mx:columns>

<mx:DataGridColumn id="artist" dataField="Artist"/>

<mx:DataGridColumn id="album" dataField="Album"

visible=""/>

<mx:DataGridColumn id="Price" dataField="Price" />

</mx:columns>

</mx:DataGrid>

</mx:Application>

Thanks

Pradeep Reddy

[Alex J Harui]

That's expected behavior. With ScrollPolicy.OFF, the datagrid will shrink

down all column until they fit, then when you expand, they may expand

differently because they lost their proportions during the shrinking. You

may want to call your columns sizing code when the app resizes.

[srilatha_reddy]

Thanks for your quick responses.

@Pradeep:

I cannot fix the width of DataGrid as i want it to occupy 100% of the Flex application size.

@Flex harUI:

I understand what you said. Could you please give me the event which gets dispatched on application resize?

And if the user has manually dragged the columns, i shouldnt reset the widths of the columns again right. Is there a way to find out if the user has changed the size of the columns?

Thanks,

Srilatha

[Alex J Harui]

There should be RESIZE event from the application. I'd probably store the

column widths somewhere else on maybe UPDATE_COMPLETE and use that

information during the RESIZE.

[kprmca]

Srilatha,

Then Don't make the DataGrid Columns depend on DataGrid width.

artist.width = dataGrid.width * 0.40;

album.width = dataGrid.width * 0.50;

Price.width = dataGrid.width * 0.10;

Thanks

Pradeep