TabItems displayed vertically

Hi all,

I want to display my TabItems vertically, like this (bottom pic):

Image

I've tried to get this effect by using RotateTransform, but that doesn't do the trick. It only rotates the content, not the TabItem-header itself.

Thanks in advance for the help,

Frances



Answer this question

TabItems displayed vertically

  • RaghavendraPrasad

    Unni Ravindranathan has been created an XPGadget which shows how to do this kinda stuff, you can download the source from this blog.

    Sheva


  • Bumper

    I think you're looking for TabStripPlacement.

    <TabControl TabStripPlacement="Left">
      <TabItem>
        <TabItem.Header>
          <TextBlock>
            <TextBlock.LayoutTransform>
              <RotateTransform Angle="90" />
            </TextBlock.LayoutTransform>
            Something
          </TextBlock>
        </TabItem.Header>
      </TabItem>
    </TabControl>

    - Doug


  • praveench2k

    Doug,

    that's exactly what I was looking for . Thank you all for your help.

    Frances

    Code:

         <Style TargetType="{x:Type TabItem}">
            <Setter Property="HeaderTemplate">
              <Setter.Value>
                <DataTemplate>
                  <ContentPresenter Content="{TemplateBinding Property=ContentControl.Content}">
                    <ContentPresenter.LayoutTransform>
                      <RotateTransform Angle="-90" />
                    </ContentPresenter.LayoutTransform>
                  </ContentPresenter>
                </DataTemplate>
              </Setter.Value>
            </Setter>
          </Style>

  • TabItems displayed vertically