注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

让一切都逝去吧

排骨炖泥菜/猪肝炒苹果/鱼籽狗肉汤/狗头薏米汤

 
 
 

日志

 
 

Flex DataGrid内容自动换行相关  

2011-04-28 19:18:59|  分类: Flex |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
      好久没写flex了,已经忘得七七八八了。记录下使用DataGrid的过程。
      1. 使用itemRenderer
<mx:DataGridColumn headerText="网站简介">
       <mx:itemRenderer>
               <mx:Component>
                     <mx:Label text="{data.desc}"/>
               </mx:Component>
       </mx:itemRenderer>
 </mx:DataGridColumn>
这里有个内置的data属性,可以用它访问外部DataGrid绑定的数据源。
      2. 列自动换行
<mx:DataGridColumn headerText="网站简介" dataField="desc" wordWrap="true"/>
这样可以达到自动换行的目的,但是DataGrid默认每行的高度是相等的,于是某单个单元格内容过多,就会把所有行的高度撑大。
      3. 内容自动截取
使用内嵌label组件,然后内容自动截取的方式可以解决上述问题。
            <mx:DataGridColumn headerText="网站简介">
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:Label text="{data.desc}" truncateToFit="true"/>
                    </mx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
      4. 行高不一
如果一定要显示所有内容,这就存在问题了。有人说itemRenderer中使用VBox来解决,确定这个方法不可行。可以使用DataGrid 的 variableRowHeight="true" ,默认variableRowHeight="false",表示所有的行高相等。
---------------------
DataGrid和TileList都是基于list的组件(直接或间接基类是ListBase)。出于性能考虑(List每次滚动都要重新度量呈现区域 的高度,确保不会出现某行被边框遮掩掉部分而造成显示不全),Adobe在设计List组件时将其设计成了等高行列表。

rowHeight:Number  [读写](ListBase)
行高(以像素为单位)。只有在 variableRowHeight 属性设置为 true 时,所有的行高才相等。如果未指定此属性,则行高基于字体大小和渲染器的其它属性而定。

variableRowHeight:Boolean  [读写](ListBase)
一个标志,指示各行是否可以采用不同的高度。TileList 和 HorizontalList 将忽略此属性。如果设置为 true,则各行可以具有不同的高度值。
默认值为 false.

    上面两个描述有冲突,经测试variableRowHeight为true时,行高可以不同。
<mx:DataGrid x="10" y="10" dataProvider="{employees}" fontSize="14" width="1154" height="430" variableRowHeight="true">
        <mx:columns>
            ...
            <mx:DataGridColumn headerText="网站简介" dataField="desc" wordWrap="true"/>
            ...
        </mx:columns>
    </mx:DataGrid>
  评论这张
 
阅读(7955)| 评论(4)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017