如何更改 WPF TabControl 的 ItemTemplate 的样式以便设置选项卡标题的背景颜色？

我使用 WPF TabControl 的 ItemTemplate 属性来绑定每个 TabItem 标头的内容。我还使用 ItemContainerStyle 属性将 TabItem 的内容设置为动态选择的用户控件。此方法 100% 按预期工作，但我现在在设置 TabControl 标题的样式时遇到问题。

我将 TabControl 的背景属性设置为黑色：

<TabControl
        ItemsSource="{Binding Tabs.Tabs}"
        SelectedItem="{Binding Tabs.SelectedTab, Mode=TwoWay}"
        IsEnabled="{Binding ReadyForInput}"
        Background="Black"
        x:Name="MainTab">
        <TabControl.ItemTemplate>
            <DataTemplate>
                <StackPanel
                    Orientation="Horizontal">                      
                    <TextBlock
                        Text="{Binding TabHeader}"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center" />
                </StackPanel>
            </DataTemplate>
        </TabControl.ItemTemplate>
        <TabControl.ItemContainerStyle>
            <Style
                TargetType="TabItem">
                <Setter
                    Property="Content"
                    Value="{Binding TabContentControl}" />
            </Style>
        </TabControl.ItemContainerStyle>
    </TabControl>

这导致：TabItem 具有黑色背景，但标题保持不变。 https://i.stack.imgur.com/pXNIA.png

如果我在 ItemTemplate 中设置 StackPanel 的背景颜色，我会留下this. https://i.stack.imgur.com/J1kGl.png

当 TabControl 被绑定时，如何更改 TabItems 标题的背景颜色（样式）？

谢谢你！

在 ItemContainerStyle 中设置背景属性：

<TabControl.ItemContainerStyle>
    <Style TargetType="TabItem">
        <Setter Property="Background" Value="Black" />
        <Setter Property="Content" Value="{Binding TabContentControl}" />
    </Style>
</TabControl.ItemContainerStyle>

更改所选选项卡的背景颜色需要更多努力。您需要覆盖 TabItem 的 ControlTemplate。您可以通过在 Visual Studio 或 Blend 的设计模式下右键单击 TabItem，然后选择“编辑模板”->“编辑副本”，然后根据您的要求进行编辑，将默认模板复制到 XAML 标记中：

<TabControl ItemsSource="{Binding Tabs.Tabs}" Background="Black" x:Name="MainTab">
    <TabControl.Resources>
        <Style x:Key="FocusVisual">
            <Setter Property="Control.Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <LinearGradientBrush x:Key="TabItem.Static.Background" EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#F0F0F0" Offset="0.0"/>
            <GradientStop Color="#E5E5E5" Offset="1.0"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="TabItem.Static.Border" Color="#ACACAC"/>
        <LinearGradientBrush x:Key="TabItem.MouseOver.Background" EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#ECF4FC" Offset="0.0"/>
            <GradientStop Color="#DCECFC" Offset="1.0"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="TabItem.MouseOver.Border" Color="#7EB4EA"/>
        <SolidColorBrush x:Key="TabItem.Disabled.Background" Color="#F0F0F0"/>
        <SolidColorBrush x:Key="TabItem.Disabled.Border" Color="#D9D9D9"/>
        <SolidColorBrush x:Key="TabItem.Selected.Border" Color="#ACACAC"/>
        <SolidColorBrush x:Key="TabItem.Selected.Background" Color="Black"/>
    </TabControl.Resources>
    <TabControl.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock
                        Text="header..."
                        VerticalAlignment="Center"
                        HorizontalAlignment="Center" />
            </StackPanel>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ItemContainerStyle>
        <Style TargetType="TabItem">
            <Setter Property="Background" Value="Black" />
            <Setter Property="Content" Value="{Binding TabContentControl}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid x:Name="templateRoot" SnapsToDevicePixels="true">
                            <Border x:Name="mainBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,0" Background="{TemplateBinding Background}" Margin="0">
                                <Border x:Name="innerBorder" BorderBrush="{StaticResource TabItem.Selected.Border}" BorderThickness="1,1,1,0" Background="{StaticResource TabItem.Selected.Background}" Margin="-1" Opacity="0"/>
                            </Border>
                            <ContentPresenter x:Name="contentPresenter" ContentSource="Header" Focusable="False" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                    <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Background}"/>
                                <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Border}"/>
                                <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,1,1,0"/>
                                <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,1,0"/>
                            </MultiDataTrigger>
                            <MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                    <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                                <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                                <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>
                                <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,1,1,0"/>
                                <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,1,0"/>
                            </MultiDataTrigger>
                            <MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                    <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                                </MultiDataTrigger.Conditions>
                                <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,1,1,0"/>
                                <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,1,0"/>
                            </MultiDataTrigger>
                            <MultiDataTrigger>
                                <MultiDataTrigger.Conditions>
                                    <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                    <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                                </MultiDataTrigger.Conditions>
                                <Setter Property="Panel.ZIndex" Value="1"/>
                                <Setter Property="Margin" Value="-2,-2,-2,0"/>
                                <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                                <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,1,1,0"/>
                                <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,1,0"/>
                            </MultiDataTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </TabControl.ItemContainerStyle>
</TabControl>