乐天散人

List的宽度是固定的，也不方便出现水平滚动条。这时候，最好就是让一些文字自动换行。这个应用很常见，为什么还要拿出来瞎扯，那还是有原因滴。对于List的自动换行实现，容易第一想到variableRowHeight这个属性（我最早是在Datagrid上面认识的，其实都可以用）。可是并不完全。看下面的例子：

<mx:List id="groupList" width="100%" height="100%"
 dataProvider="{contactLocator.sortedGroups}"
 horizontalScrollPolicy="off" variableRowHeight="true">
 <mx:change>
  <![CDATA[
   selectGroupHandler();
  ]]>
 </mx:change>
 <mx:itemRenderer>
  <mx:Component>
   <mx:HBox width="100%" horizontalScrollPolicy="off">
    <mx:Text text="{data['group_name']}" width="100%"/>
    <!--<mx:Spacer width="100%"/>-->
    <mx:Text text="{data['children'].length}"/>
   </mx:HBox>
  </mx:Component>
 </mx:itemRenderer>
</mx:List>

不要上当了，它是没什么问题的。不过一开始我可没那么写。我一开始只加了variableRowHeight，而没有管内部的width属性。如：

<mx:HBox width="100%" horizontalScrollPolicy="off">
    <mx:Text text="{data['group_name']}"/>
    <mx:Spacer width="100%"/>
    <mx:Text text="{data['children'].length}"/>
   </mx:HBox>

结果还是把List给顶宽了。于是我发现这么几条规律：

• 加上variableRowHeight
• 用Text组件在加载要换行的文字
• 只有一个组件支持文字换行（其它都是固定的）。
• 给上面的那个组件设置100%宽度，它的容器，及容器的容器等等，都要设100%宽度。
• 除了上面的，其它组件都不要有百分比的宽度设置。

仅个人观察，有待验证。