如何在WPF中构建垂直选项卡集？

Question

如何在WPF中构建垂直选项卡集？这些选项卡将从上到下堆叠起来，就像 Visual Studio 中显示的项目的“属性”一样。

Answer 1

您尝试过

TabControl.TabStripPlacement

属性吗？

以下示例创建一个选项卡控件，将选项卡放置在左侧。

<TabControl TabStripPlacement="Left" Margin="0, 0, 0, 10">
  <TabItem Name="fontweight" Header="FontWeight">
    <TabItem.Content>
      <TextBlock TextWrapping="WrapWithOverflow">
        FontWeight property information goes here.
      </TextBlock>
    </TabItem.Content>
  </TabItem>

  <TabItem Name="fontsize" Header="FontSize">
    <TabItem.Content>
      <TextBlock TextWrapping="WrapWithOverflow">
        FontSize property information goes here.
      </TextBlock>
    </TabItem.Content>
  </TabItem>
</TabControl>

Answer 2

你应该尝试这个代码：

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

        <Setter Property="Padding" Value="3"/>
    </Style>
</TabControl.Resources>

Answer 3

基于上面rkirac的回答。如果您不想创建全局样式，则可以将相同的内容放入

TabControl.ItemContainerStyle

中，这只会影响相关的

TabControl

。以下是一个简单的例子：

<TabControl TabStripPlacement="Left">
  <TabControl.ItemContainerStyle>
    <Style TargetType="TabItem">
      <Setter Property="LayoutTransform">
        <Setter.Value>
          <RotateTransform Angle="270" />
        </Setter.Value>
      </Setter>
    </Style>
  </TabControl.ItemContainerStyle>
</TabControl>