如何更改标签页眉边框颜色？答案

【问题标题】：How to change tab header border color?如何更改标签页眉边框颜色？
【发布时间】：2016-12-19 17:53:09
【问题描述】：

我有TabControl 元素。

我把TabControl的BorderBrush改成了红色，如图。让我抓狂的是标签本身不能有相同的颜色。

我尝试了很多示例，例如 WPF TabItem Header Styling ，但没有任何乐趣。我要更改的边框不是Header 元素的一部分。 Header 元素位于我想要更改的内容中。

我尝试使用来自 https://msdn.microsoft.com/en-us/library/ms754137(v=vs.110).aspx 的完整模板，不高兴，看起来很丑，我什至不知道如何开始让它看起来应该看起来的样子。

我在哪里可以得到原始模板来修改？我只想改变边框颜色，没有别的。我不介意粘贴和编辑一个巨大的模板，但我需要正确的、实际的模板。

（我使用 .NET Framework 4.6.2。）

【问题讨论】：

我认为 Blend 允许您创建原始模板的副本进行修改。

标签： c# wpf

【解决方案1】：

这是 Blend 中的 TabItemStyle。

您想要的行是靠近开头的 mainBorder。您可以看到正在应用您选择的边框画笔，但边框厚度不允许它真正显示。我将其更改为 2,2,2,0，并且我在 tabitem 周围有一个红色边框。

   <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
        <Setter Property="Foreground" Value="Black"/>
        <Setter Property="Background" Value="{StaticResource TabItem.Static.Background}"/>
        <Setter Property="BorderBrush" Value="{StaticResource TabItem.Static.Border}"/>
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Padding" Value="6,2,6,2"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid x:Name="templateRoot" SnapsToDevicePixels="true">
                        <Border x:Name="mainBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="2,2,2,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="Left"/>
                            </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,0,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,0,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </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,0,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,0,1,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </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="0,1,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="0,1,1,1"/>
                        </MultiDataTrigger>
                        <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="Left"/>
                            </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,0,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,0,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </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,0,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,0,1,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </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="0,1,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="0,1,1,1"/>
                        </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="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,1,0,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,0,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Margin" Value="-2,-2,0,-2"/>
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,1,0,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,1,0,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,0,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,0,1,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Margin" Value="-2,0,-2,-2"/>
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="BorderThickness" TargetName="innerBorder" Value="1,0,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="1,0,1,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="BorderThickness" TargetName="innerBorder" Value="0,1,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="0,1,1,1"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Margin" Value="0,-2,-2,-2"/>
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="BorderThickness" TargetName="innerBorder" Value="0,1,1,1"/>
                            <Setter Property="BorderThickness" TargetName="mainBorder" Value="0,1,1,1"/>
                        </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>

【讨论】：

【解决方案2】：

在 XAML 设计模式下，右键单击您的TabControl，然后在上下文菜单中选择编辑模板 | 编辑副本...。这将为您提供真正在那里使用的实际模板（至少就 XAML 设计器在设计时所知道的而言），而不是来自 MSDN 的一些奶酪球示例。

至于在获得模板后对其进行编辑……那些不会杀死你的东西会让你变得更强大。通常。

【讨论】：

谢谢你，陌生人！