Flex4 - DataGrid使用typicalItem来设置列宽
Flex4里，Spark库的DataGrid表格组件，除了使用width给GridColumn设置列宽外，还可以使用<s:typicalItem>标签来设置列宽。
在没有给GridColumn设置固定宽度的情况下，DataGrid默认是会根据结果集内容字数来自动设置宽度。如果使用了typicalItem，则会根据typicalItem里面配置的字段字数来设置宽度。
下面是一个样例：
（1）上面两个表格未设置表格宽度，下面两个表格是固定宽度width=250。
（2）所以表格都未设置GridColumn列宽，右边两个表格使用了typicalItem。
测试代码如下：
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>
<s:ArrayCollection id="dgData">
<fx:Object name="张三" sex="男男男男男男男"/>
<fx:Object name="小红" sex="女"/>
<fx:Object name="小丽" sex="女"/>
<fx:Object name="小美" sex="女"/>
</s:ArrayCollection>
</fx:Declarations>
<s:layout>
<s:VerticalLayout gap="20" paddingLeft="20" paddingTop="20"/>
</s:layout>
<s:HGroup gap="121">
<s:DataGrid dataProvider="{dgData}">
<s:columns>
<s:ArrayList>
<s:GridColumn headerText="姓名" dataField="name"/>
<s:GridColumn headerText="性别" dataField="sex"/>
</s:ArrayList>
</s:columns>
</s:DataGrid>
<s:DataGrid dataProvider="{dgData}">
<s:columns>
<s:ArrayList>
<s:GridColumn headerText="姓名" dataField="name"/>
<s:GridColumn headerText="性别" dataField="sex"/>
</s:ArrayList>
</s:columns>
<s:typicalItem>
<fx:Object name="航航航" sex="航航航"/>
</s:typicalItem>
</s:DataGrid>
</s:HGroup>
<s:HGroup gap="25">
<s:DataGrid dataProvider="{dgData}" width="250">
<s:columns>
<s:ArrayList>
<s:GridColumn headerText="姓名" dataField="name"/>
<s:GridColumn headerText="性别" dataField="sex"/>
</s:ArrayList>
</s:columns>
</s:DataGrid>
<s:DataGrid dataProvider="{dgData}" width="250">
<s:columns>
<s:ArrayList>
<s:GridColumn headerText="姓名" dataField="name"/>
<s:GridColumn headerText="性别" dataField="sex" />
</s:ArrayList>
</s:columns>
<s:typicalItem>
<fx:Object name="航航航航航航航航航航" sex="航"/>
</s:typicalItem>
</s:DataGrid>
</s:HGroup>
</s:Application>
