XAML 触发器 WPF 选项卡选择的变化多于选项卡标题

Question

我有一个触发器，当选择一个选项卡时，我将选项卡颜色设置为蓝色，将文本颜色设置为白色，但问题是，由于某种原因，该触发器还将选项卡标题正文中的文本颜色以及组框中的文本颜色更改为白色。似乎任何有标题的东西都会变成白色。

如何才能做到只有选项卡本身的标题

<TabItem Header="Query Editor" <-- This text only

在选择时才会更改为白色，而表单上没有其他文本？

下面是我正在使用的代码。

谢谢。

<Style TargetType="{x:Type TabItem}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TabItem}">
                <Grid>
                    <Border Name="Border"
                        Background="WhiteSmoke"
                        BorderBrush="Black"
                        BorderThickness="1,1,1,1"
                        CornerRadius="6,6,0,0">

                        <ContentPresenter x:Name="ContentSite"
                            VerticalAlignment="Center"
                            HorizontalAlignment="Center"
                            ContentSource="Header"
                            Margin="12,2,12,2"/>
                    </Border>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="#00396a" />
                        <Setter Property="Foreground" Value="White" />
                    </Trigger>
                    <Trigger Property="IsSelected" Value="False">
                        <Setter TargetName="Border" Property="Background" Value="WhiteSmoke" />
                        <Setter Property="Foreground" Value="Black" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

也许 TabItem.HeaderTemplate 适合您。

        <TabControl>
            <TabControl.Resources>
                 <DataTemplate x:Key="headerText">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <TextBlock x:Name="content" Text="{Binding}" Grid.Column="1"/>
                </Grid>
                <DataTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Trigger.Setters>
                            <Setter TargetName="content" Property="Foreground" Value="white" />
                        </Trigger.Setters>
                    </Trigger>
                </DataTemplate.Triggers>
            </DataTemplate>
            <Style TargetType="TabItem">
                <Style.Setters>
                    <Setter Property="HeaderTemplate" Value="{StaticResource headerText}" />
                </Style.Setters>
            </Style>
            </TabControl.Resources>



            <TabItem Header="fsdf" >
                <TextBlock Text="lkajsldkjaskl" />
            </TabItem>
            <TabItem Header="ghj">
                <TextBlock Text="ghj" />
            </TabItem>
            <TabItem Header="fs556df">
                <TextBlock Text="jjj" />
            </TabItem>
        </TabControl>

    </TabItem>
</TabControl>

你可以有 2headerstyle，选择一个普通的。在 tabitem 样式触发器中，您可以将 headertemplate 设置为右侧的“IsSelected”模板。

Answer 2

解决方案！

谢谢大家的帮助。

我所做的更改是删除了 ContentPresenter 并将其替换为仅影响选项卡标题本身的文本块。

<TabControl.Resources>
    <Style TargetType="{x:Type TabControl}">
        <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush>
                    <GradientStop Offset="0" Color="WhiteSmoke"/>
                    <GradientStop Offset="4" Color="GhostWhite"/>
                 </LinearGradientBrush>
             </Setter.Value>
         </Setter>
         <Setter Property="Foreground" Value="Black" />
     </Style>

     <Style TargetType="{x:Type TabItem}">
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type TabItem}">
                     <Grid>
                         <Border Name="Border"
                             Background="WhiteSmoke"
                             BorderBrush="Black"
                             BorderThickness="1,1,1,1"
                             CornerRadius="6,6,0,0">

                             <TextBlock 
                                 x:Name="TabItemContent" 
                                 VerticalAlignment="Center"
                                 HorizontalAlignment="Center"
                                 Text="{TemplateBinding Header}"
                                 Margin="12,2,12,2" />
                         </Border>
                     </Grid>
                     <ControlTemplate.Triggers>
                         <Trigger Property="IsSelected" Value="True">
                             <Setter TargetName="Border" Property="Background" Value="#00396a" />
                             <Setter Property="Foreground" TargetName="TabItemContent" Value="White"/>
                         </Trigger>
                         <Trigger Property="IsSelected" Value="False">
                            <Setter TargetName="Border" Property="Background" Value="WhiteSmoke" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TabControl.Resources>