禁止在选中的TabItem上改变边框和背景。

Question

在我的WPF文档中，我有这个。

<Window.Resources>
    <Style x:Key="SidebarTab" TargetType="TabItem">

        <Setter Property="Foreground"  Value="#303030"></Setter>
        <Setter Property="BorderBrush"  Value="Transparent"></Setter>
        <Setter Property="BorderThickness"  Value="0"></Setter>
        <Setter Property="Background"  Value="#151515"></Setter>

        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Foreground" Value="{StaticResource PrimaryHueMidBrush}"></Setter>
                <Setter Property="BorderBrush"  Value="Transparent"></Setter>
                <Setter Property="BorderThickness"  Value="0"></Setter>
                <Setter Property="Background"  Value="#151515"></Setter>
            </Trigger>
        </Style.Triggers>

    </Style>
</Window.Resources>

<Border Background="#151515" CornerRadius="20">
    <Grid Margin="23,47,0,0">
        <TabControl TabStripPlacement="Left" Style="{DynamicResource SidebarTabControl}">
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
            <TabItem Style="{DynamicResource SidebarTab}">
                <TabItem.Header>
                    <materialDesign:PackIcon Kind="EmoticonLol" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                </TabItem.Header>
            </TabItem>
        </TabControl>
    </Grid>
</Border>

而它看起来像这样。

我得到了我想要的效果，图标的颜色会改变。TabItem但是 Background 和 BorderBrush (以及 BorderThickness)还是被改成了一种 "链接 "到头里面的内容，这是我想去掉的。

我把这些东西加到了样式里面，就像这样。

 <Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
        <Setter Property="Foreground" Value="{StaticResource PrimaryHueMidBrush}"></Setter>
        <Setter Property="BorderBrush"  Value="Transparent"></Setter>
        <Setter Property="BorderThickness"  Value="0"></Setter>
        <Setter Property="Background"  Value="#151515"></Setter>
    </Trigger>
</Style.Triggers>

但还是不行 有人有什么建议吗？

Answer 1

我用你的样式试了一下，也能得到边框。原因是TabItem的默认模板有边框的颜色和厚度，而你定义颜色的时候，你的属性仍然没有应用到它们。

所以你需要做的其实是重新定义你的tab项的控件模板。

我通过覆盖TabItem的Template属性进行了基本的修改，并添加了一些东西，绑定了BorderThickness、BorderBrush和Background。

<Style x:Key="SidebarTab" TargetType="TabItem">

        <Setter Property="Foreground"  Value="#303030"></Setter>
        <Setter Property="BorderBrush"  Value="Red"></Setter>
        <Setter Property="BorderThickness"  Value="1"></Setter>
        <Setter Property="Background"  Value="White"></Setter>

        <!--I have added this START-->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TabItem">
                    <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"
                            Background="{TemplateBinding Background}">
                        <ContentPresenter ContentSource="Header" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
       <!--I have added this END-->

        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Foreground" Value="Blue"></Setter>
                <Setter Property="BorderBrush"  Value="Transparent"></Setter>
                <Setter Property="BorderThickness"  Value="0"></Setter>
                <Setter Property="Background"  Value="Yellow"></Setter>
            </Trigger>
        </Style.Triggers>

    </Style>

注意：- 在上面的代码中，我改变了前景，背景，边框厚度的属性值，用于测试，因为我找不到静态资源。你必须改回你的键。

我希望我已经为你做了一个点，让你进一步进行。试一试，如果发现有什么问题请告诉我。