Hi Dana,
A real easy way to do this would be to use a headerRenderer for the
DataGrid columns.
Inline:
<mx:DataGrid id="dg" height="300" width="300" headerHeight="60"
dataProvider="{ myDataProvider }">
<mx:columns>
<mx:Array>
<mx:DataGridColumn width="160" headerText="City"
dataField="city">
<mx:headerRenderer>
<mx:Component>
<mx:VBox horizontalAlign="center">
<mx:Text
text="{ this.data.headerText }"
rotation="90"
styleName="myEmbeddedFontStyleName"/>
</mx:VBox>
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
</mx:Array>
</mx:columns>
</mx:DataGrid>
Or, if you want to reuse the headerRenderer, create a component:
<mx:DataGrid id="dg" height="300" width="300" headerHeight="60"
dataProvider="{ myDataProvider }">
<mx:columns>
<mx:Array>
<mx:DataGridColumn width="160"
headerRenderer="RotatedHeaderRenderer"
headerText="City"
dataField="city"/>
<mx:DataGridColumn width="160"
headerRenderer="RotatedHeaderRenderer"
headerText="State"
dataField="state"/>
</mx:Array>
</mx:columns>
</mx:DataGrid>
RotatedHeaderRenderer.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml
<http://www.adobe.com/2006/mxml> " horizontalAlign="center">
<mx:Text
text="{ this.data.headerText }"
rotation="90"
styleName="myEmbeddedFontStyleName"/>
</mx:VBox>
-TH
__________________________________
Tim Hoff
Cynergy Systems, Inc.
http://www.cynergysystems.com
Office <http://www.cynergysystems.comoffice/> : 866-CYNERGY
--- In [email protected], "Dana Gutride" <[EMAIL PROTECTED]> wrote:
>
> Hi,
>
> After much searching, I haven't found a satisfactory answer to this
> question. I'm trying to rotate the headers of my datagrid so they are
> completely vertical. I've embedded the font successfully and can
rotate any
> other piece of text in my app, but when I attempt to rotate the text
in the
> datagrid header, it keeps disappearing. I've used both the rotation
> property and created a rotate effect, but to no avail. I think it
might
> have to do with the x and y of the text. Any ideas?
>
> Thanks,
> Dana
>
