DataGrid fit into a panel question

[cpthk]

Hi:
Here is my code.

</mx:Panel>
<mx:DataGrid dataProvider="{totalDataGrid}" rowCount="6" textAlign="center">
<mx:columns>
<mx:DataGridColumn dataField="name" headerText="Name" width="65" fontSize="10"/>
<mx:DataGridColumn dataField="split" headerText="Split" width="65" fontSize="10"/>
<mx:DataGridColumn dataField="paid" headerText="Paid" width="65" fontSize="10"/>
<mx:DataGridColumn dataField="total" headerText="Total" width="65" fontSize="10"/>
</mx:columns>
</mx:DataGrid>

</mx:Panel>


I have a datagrid inside a panel. All the values of this datagrid is dynamically provided after this flex application initiated. The datagrid is always 6 rows, and I want the datagrid fits the panel exactly. I found this problem. Whenever there is no data in the datagrid, the panel expand exactly the size to fit this datagrid, which mean I don't see any scroll bar in the datagrid. Whenever I trigger a event to insert data into this datagrid with 6 rows, the datagrid seems like expand a little and no longer fits in the panel. I tried all possible properties like font size, row height. I can't fix the problem. Anyone know which property makes the datagrid expand a little?

http://www.actionscript.org/forums/attachment.php3?attachmentid=32280&stc=1&d=1252929290

[Peter Cowling]

The data and the scrollbar is the only difference:

When you add data a vertical scroller is being added. This takes up space you have not provided, and therefore causes a horizontal scrollbar to also be required/added. You need to allow space for the vertical scrollbar, or provider an alternate scroll mechanism - or have one page's worth of data.

It is either that or your data does not fit in the columns.

[pradeepptp]

<mx:DataGrid dataProvider="{totalDataGrid}" rowCount="6" textAlign="center">

Instead of this use this code

<mx:DataGrid dataProvider="{totalDataGrid}"
rowCount="{totalDataGrid.length}"
textAlign="center">

[cpthk]

My datagrid is always 6 rows, so I don't need any binding to the length.
After several hours of testing, I found that the problem is due to the font. The default font works fine, but if I use some other font, then the problem came out.
Please use this code instead:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<mx:Style>
@font-face
{
fontFamily: Verdana;
src: local("Verdana");
}
</mx:Style>
<mx:DataGrid rowCount="3">
<mx:dataProvider>
<mx:Object name="World of Warcraft" creator="Blizzard" publisher="Blizzard" />
<mx:Object name="Halo" creator="Bungie" publisher="Microsoft" />
<mx:Object name="Gears of War" creator="Epic" publisher="Microsoft" />
</mx:dataProvider>
<mx:columns>
<mx:DataGridColumn headerText="Game Name" dataField="name"/>
<mx:DataGridColumn headerText="Creator" dataField="creator"/>
<mx:DataGridColumn headerText="Publisher" dataField="publisher"/>
</mx:columns>
</mx:DataGrid>

</mx:Application>



This code should reproduce the problem. If you remove the style block, then it works fine.
Is that a bug?

[Peter Cowling]

No it is not a bug. font sizes are not literal. A size of 12 means the 12th size for that font. Verdana is different than say times new roman.

[cpthk]

do you mean Verdana is higher than normal size, which flex calculate the normal size?