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 flexcoders@yahoogroups.com, "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
>


Reply via email to