【转自FEIY】Flex：Label组件自动截断文本的妙用

Flex：Label组件自动截断文本的妙用

从 eshangrao 作者： feiy

mx.controls.Label组 件有一个很有用的特性，那就是如果其要显示的文本长度大于组件的宽度时候，会自动截断文本，并在文本后面添加上...表示文本还有未显示部分，而且还会显 示一个包括完整文本内容的ToolTip，所以将Label设置为DataGrid的Renderer，可将该特性用于在DataGrid里面截断过宽的 Header文本或用于截断显示不下的单元格内容...

mx.controls.Label组 件有一个很有用的特性，那就是如果其要显示的文本长度大于组件的宽度时候，会自动截断文本，并在文本后面添加上...表示文本还有未显示部分，而且还会显 示一个包括完整文本内容的ToolTip，所以将Label设置为DataGrid的Renderer，可将该特性用于在DataGrid里面截断过宽的 Header文本或用于截断显示不下的单元格内容，而当用户鼠标移到列上的时候不需要调整列宽，又可以通过Tooltip查看到单元格实际内容，是不是很 方便啊？！

以下是个示例代码：

[xml]
<? xmlversion = " 1.0 " encoding = " utf-8 " ?>
< mx:Applicationxmlns:mx = " http://www.adobe.com/2006/mxml "
layout = " vertical "
verticalAlign = " middle "
backgroundColor = " white " >

< mx:XMLid = " xmlDP " >
< nodescol1 = " root " >
< nodecol1 = " mx.controls.Label:用于显示文本 " col2 = " Label组件 " />
< nodecol1 = " mx.core.Application：mx应用核心 " col2 = " 核心组件 " />
< nodecol1 = " 测试 " col2 = " 测试 " />
</ nodes >
</ mx:XML >
< mx:DataGridid = " dataGrid "
dataProvider = " {xmlDP.node} "
width = " 250 "
height = " 200 " >
< mx:columns >
< mx:DataGridColumndataField = " @col1 "
headerText = " Flex组件名称 "
itemRenderer = " mx.controls.Label "
headerRenderer = " mx.controls.Label " />
< mx:DataGridColumndataField = " @col2 "
headerText = " Flex组件详细说明，包括用法等 "
itemRenderer = " mx.controls.Label "
headerRenderer = " mx.controls.Label " />
</ mx:columns >
</ mx:DataGrid >
</ mx:Application >