C# 为什么在XAML TabControl中选项卡的内容区域中显示选项卡标题？

我有一个选项卡控件，它的ItemsSource绑定到一个可观察的视图集合（UserControls），每个视图的根元素都是选项卡项。但是，当显示时，标题文本位于每个选项卡项的内容中，就好像用户控制包装引起冲突：

选项卡控件位于SmartFormView.xaml:

<UserControl x:Class="TestApp.Views.SmartFormView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <StackPanel
        Margin="10">
        <TextBlock Text="{Binding Title}"
            FontSize="18"/>
        <TextBlock Text="{Binding Description}"
            FontSize="12"/>

        <TabControl
            Margin="0 10 0 0"
            ItemsSource="{Binding SmartFormAreaViews}"/>
    </StackPanel>
</UserControl>

<UserControl x:Class="TestApp.Views.SmartFormAreaView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <TabItem Header="This is the header">
        <StackPanel Margin="10">
            <TextBlock Text="this is the content"/>
        </StackPanel>
    </TabItem>
</UserControl>

---

TabControl

仅当您的控件可以转换为

TabItem

、而不是UserControl或SmartFormAreaView等时，才会接受您的控件作为其控件

因此，您可以使用可视化树填充常规的

TabItems

，或者将

TabItems

子类化，或者将

TabControl

子类化以覆盖其方法，接受您的类型作为容器

该方法应如下所示：

protected override bool IsItemItsOwnContainerOverride(object item)
{
    return item is YourControlTypeHere || item is TabItem;
}

---

对于任何ItemsControl，如果添加到其items集合（直接或通过ItemsSource）的项不是该控件的项容器的实例，则每个项都包装在项容器的实例中。项目容器是一个类，如TabItem或ListBoxItem。项目容器通常是ContentControl或HeaderedContentControl，您的实际项目被分配给其内容属性，因此您可以使用模板等来控制内容的显示方式。还可以使用ItemControl的ItemContainerStyle属性设置项目容器本身的样式

在这种情况下，您应该将ItemsSource绑定到SmartFormAreaPresenter列表。然后在选项卡控件中使用类似的内容：

<TabControl ItemsSource="{Binding SmartFormAreaPresenters}">
  <TabControl.ItemContainerStyle>
    <Style TargetType="{x:Type TabItem}">
      <Setter Property="Header" Value="{Binding HeaderText}" />
    </Style>
  </TabControl.ItemContainerStyle>

  <TabControl.ContentTemplate>
    <DataTemplate DataType="{x:Type local:SmartFormAreaPresenter}">
      <local:SmartFormAreaView />
    </DataTemplate>
  </TabControl.ContentTemplate>
</TabControl>

其中HeaderText是SmartFormAreaPresenter上的合适属性。您还应该从SmartFormAreaView定义中删除TabItem。每个视图的DataContext将自动设置为相应的演示者

请参阅Dr.WPF's，以了解有关各种项控件相关主题的精彩讨论

<TabControl ItemsSource="{Binding SmartFormAreaPresenters}">
  <TabControl.ItemContainerStyle>
    <Style TargetType="{x:Type TabItem}">
      <Setter Property="Header" Value="{Binding HeaderText}" />
    </Style>
  </TabControl.ItemContainerStyle>

  <TabControl.ContentTemplate>
    <DataTemplate DataType="{x:Type local:SmartFormAreaPresenter}">
      <local:SmartFormAreaView />
    </DataTemplate>
  </TabControl.ContentTemplate>
</TabControl>