dataGrid控件的showHeaders和headerHeight属性。
示例:
代码:
<?
xml version="1.0" encoding="utf-8"
?>
<!--
http://blog.flexexamples.com/2008/06/16/setting-the-header-height-on-a-datagrid-control-in-flex/
-->
<
mx:Application
xmlns:mx
="http://www.adobe.com/2006/mxml"
layout
="vertical"
verticalAlign
="middle"
backgroundColor
="white"
>
<
mx:Script
>
<![CDATA[
private function init():void {
slider.value = dataGrid.headerHeight;
}
]]>
</
mx:Script
>
<
mx:Array
id
="arr"
>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
</
mx:Array
>
<
mx:ApplicationControlBar
dock
="true"
>
<
mx:Form
styleName
="plain"
>
<
mx:FormItem
label
="headerHeight:"
>
<
mx:HSlider
id
="slider"
minimum
="0"
maximum
="40"
snapInterval
="1"
liveDragging
="true"
/>
</
mx:FormItem
>
<
mx:FormItem
label
="showHeaders:"
>
<
mx:CheckBox
id
="checkBox"
selected
="true"
/>
</
mx:FormItem
>
</
mx:Form
>
</
mx:ApplicationControlBar
>
<
mx:DataGrid
id
="dataGrid"
dataProvider
="
{arr}
"
headerHeight
="
{slider.value}
"
showHeaders
="
{checkBox.selected}
"
initialize
="init();"
>
<
mx:columns
>
<
mx:DataGridColumn
dataField
="col1"
/>
<
mx:DataGridColumn
dataField
="col2"
/>
</
mx:columns
>
</
mx:DataGrid
>
</
mx:Application
>
也可以通过AS实现:
<?
xml version="1.0" encoding="utf-8"
?>
<!--
http://blog.flexexamples.com/2008/06/16/setting-the-header-height-on-a-datagrid-control-in-flex/
-->
<
mx:Application
xmlns:mx
="http://www.adobe.com/2006/mxml"
layout
="vertical"
verticalAlign
="middle"
backgroundColor
="white"
>
<
mx:Script
>
<![CDATA[
import mx.events.SliderEvent;
private function init():void {
slider.value = dataGrid.headerHeight;
}
private function slider_change(evt:SliderEvent):void {
dataGrid.headerHeight = evt.value;
}
]]>
</
mx:Script
>
<
mx:Array
id
="arr"
>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
<
mx:Object
col1
="1.One"
col2
="1.Two"
/>
</
mx:Array
>
<
mx:ApplicationControlBar
dock
="true"
>
<
mx:Form
styleName
="plain"
>
<
mx:FormItem
label
="headerHeight:"
>
<
mx:HSlider
id
="slider"
minimum
="0"
maximum
="40"
snapInterval
="1"
liveDragging
="true"
change
="slider_change(event);"
/>
</
mx:FormItem
>
<
mx:FormItem
label
="showHeaders:"
>
<
mx:CheckBox
id
="checkBox"
selected
="true"
/>
</
mx:FormItem
>
</
mx:Form
>
</
mx:ApplicationControlBar
>
<
mx:DataGrid
id
="dataGrid"
dataProvider
="
{arr}
"
showHeaders
="
{checkBox.selected}
"
initialize
="init();"
>
<
mx:columns
>
<
mx:DataGridColumn
dataField
="col1"
/>
<
mx:DataGridColumn
dataField
="col2"
/>
</
mx:columns
>
</
mx:DataGrid
>
</
mx:Application
>