none
expander with header that is vertical RRS feed

  • Question

  • is it possible to set the expander header to be vertical when we set the expander direction to the right??
    Friday, June 27, 2008 12:44 PM

Answers

  • Btw, the rotate transform can be coded as simple as ...
            <Expander ExpandDirection="Right">
                <Expander.Header>
                    <TextBlock Text="Objetos Relacionados al Caso">
                        <TextBlock.LayoutTransform>
                            <RotateTransform Angle="-90"/>
                        </TextBlock.LayoutTransform>
                    </TextBlock>
                </Expander.Header>
               <!-- Stuff XD -->
            </Expander>

    • Edited by asifsid Sunday, December 4, 2011 10:17 PM
    • Proposed as answer by MIkeTims Tuesday, January 15, 2013 2:39 PM
    • Marked as answer by Yang,Chenfei Thursday, December 18, 2014 9:03 AM
    Sunday, December 4, 2011 10:16 PM
  • Try elaborating with RenderTransform property as follows:

    <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <Expander ExpandDirection="Right">
            <Expander.Header>
                <TextBlock Text="WPF" RenderTransformOrigin="0.5,0.5" Margin="5">
                    <TextBlock.RenderTransform>
                        <TransformGroup>
                            <RotateTransform Angle="-90"/>
                        </TransformGroup>
                    </TextBlock.RenderTransform>
                </TextBlock>
            </Expander.Header>
            <Expander.Content>
                <Button Content="WPF"/>
            </Expander.Content>
        </Expander>
    </Page>

    Hope this helps
    • Marked as answer by marck68 Monday, June 30, 2008 9:32 AM
    • Marked as answer by marck68 Monday, June 30, 2008 9:32 AM
    Monday, June 30, 2008 8:05 AM

All replies

  • Try elaborating with RenderTransform property as follows:

    <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <Expander ExpandDirection="Right">
            <Expander.Header>
                <TextBlock Text="WPF" RenderTransformOrigin="0.5,0.5" Margin="5">
                    <TextBlock.RenderTransform>
                        <TransformGroup>
                            <RotateTransform Angle="-90"/>
                        </TransformGroup>
                    </TextBlock.RenderTransform>
                </TextBlock>
            </Expander.Header>
            <Expander.Content>
                <Button Content="WPF"/>
            </Expander.Content>
        </Expander>
    </Page>

    Hope this helps
    • Marked as answer by marck68 Monday, June 30, 2008 9:32 AM
    • Marked as answer by marck68 Monday, June 30, 2008 9:32 AM
    Monday, June 30, 2008 8:05 AM
  • Hi, i try with your code an was very close to my expectative but i make some changes because the text width doesn't change, so here is what i did to solve the problem, hope it helps:

    <Expander Width="Auto" ExpandDirection="Left" HorizontalAlignment="Right">
        
    <Expander.Header>
            
    <TextBlock Text="Objetos Relacionados al Caso" RenderTransformOrigin="0.5,0.5" Margin="0,0,0,0" Width="Auto">
                <TextBlock.LayoutTransform>
                    
    <TransformGroup>
                        
    <ScaleTransform ScaleX="1" ScaleY="1"/>
                        
    <SkewTransform AngleX="0" AngleY="0"/>
                        
    <RotateTransform Angle="90"/>
                        
    <TranslateTransform X="0" Y="0"/>
                    
    </TransformGroup>
                
    </TextBlock.LayoutTransform>
                
    <TextBlock.RenderTransform>
                    
    <TransformGroup>
                        
    <ScaleTransform ScaleX="1" ScaleY="1"/>
                        
    <SkewTransform AngleX="0" AngleY="0"/>
                        
    <RotateTransform Angle="0"/>
                        
    <TranslateTransform X="0" Y="0"/>
                    
    </TransformGroup>
                
    </TextBlock.RenderTransform> 
            
    </TextBlock>
        </Expander.Header>
        <!-- Stuff XD -->
    </Expander>

    Thursday, March 19, 2009 8:40 AM
  • Thanks WSWFideas, This was just what I was looking for!
    Friday, June 26, 2009 7:20 AM
  • Happy to help :)
    Friday, September 25, 2009 5:15 AM
  • This works only for some cases. Unfortunately when rotating the component,"ContentControl" (header) end up in a poor position in relation to the expander. Does anyone have another solution?

     

    Edit: Sorry, I was using the "RenderTransform" the wrong way ..

    • Edited by johnlvidal Friday, November 18, 2011 6:34 PM
    Friday, November 11, 2011 7:25 PM
  • Btw, the rotate transform can be coded as simple as ...
            <Expander ExpandDirection="Right">
                <Expander.Header>
                    <TextBlock Text="Objetos Relacionados al Caso">
                        <TextBlock.LayoutTransform>
                            <RotateTransform Angle="-90"/>
                        </TextBlock.LayoutTransform>
                    </TextBlock>
                </Expander.Header>
               <!-- Stuff XD -->
            </Expander>

    • Edited by asifsid Sunday, December 4, 2011 10:17 PM
    • Proposed as answer by MIkeTims Tuesday, January 15, 2013 2:39 PM
    • Marked as answer by Yang,Chenfei Thursday, December 18, 2014 9:03 AM
    Sunday, December 4, 2011 10:16 PM
  • This worked. Thank you very much.
    Wednesday, December 17, 2014 12:12 PM