选项卡项样式触发器在应用程序启动时不更新

Question

我试图为TabItem创建一个简单的样式，方法是转到Properties窗口，将模板转换为新资源，并将其封装在样式中(相当标准的东西(。

目标是基于IsSelected属性设置BorderBrush颜色的动画。实际上，我已经相对轻松地完成了这项工作，使用原始生成的代码作为基础。

问题是：在设计器中，当应用程序启动时，所有TabItems都显示为选中，直到我单击任何不是第一个选项卡的选项卡(索引0，因为默认情况下是选中的(。

屏幕记录演示了发生的事情：https://i.gyazo.com/17e2f3c484029d4f5cd3021612b0f882.mp4

如何补救？我尝试过使用各种触发器类型，但似乎没有一种能解决问题。样式代码：

<Style TargetType="{x:Type TabItem}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Padding" Value="8,0"/>
<Setter Property="Height" Value="30"/>
<Setter Property="Margin" Value="0,0,1,0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TabItem}">
<Border x:Name="ElementBorder" Height="30" Width="Auto" Background="#FF1F1F1F" BorderBrush="#FF00FF96" BorderThickness="0,0,0,2" CornerRadius="2,2,0,0" SnapsToDevicePixels="True">
<ContentPresenter TextBlock.Foreground="Silver"
ContentTemplate="{TemplateBinding HeaderTemplate}"
Content="{TemplateBinding Header}"
ContentStringFormat="{TemplateBinding HeaderStringFormat}"
ContentSource="Header"
HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}"
Margin="{TemplateBinding Padding}"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}"/>
</Border>
<ControlTemplate.Triggers>
<MultiTrigger>

<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
</MultiTrigger.Conditions>

<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation 
Storyboard.TargetName="ElementBorder"
Storyboard.TargetProperty="(Control.BorderBrush).(SolidColorBrush.Color)"
To="#FF00FF96"
Duration="0:0:0.1"/>
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>

<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation 
Storyboard.TargetName="ElementBorder"
Storyboard.TargetProperty="(Control.BorderBrush).(SolidColorBrush.Color)"
To="#FF1F1F1F"
Duration="0:0:0.1"/>
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>

</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Answer 1

问题是您将默认的BorderBrush设置为所选颜色。将其更改为未选择的颜色，如下所示：

<Border x:Name="ElementBorder"
Width="Auto"
Height="30"
Background="#FF1F1F1F"
BorderBrush="#FF1F1F1F"
BorderThickness="0,0,0,2"
CornerRadius="2,2,0,0"
SnapsToDevicePixels="True">

此外，您可以简化触发器：

<Trigger Property="IsSelected" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetName="ElementBorder"
Storyboard.TargetProperty="(Control.BorderBrush).(SolidColorBrush.Color)"
To="#FF00FF96"
Duration="0:0:0.1" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetName="ElementBorder"
Storyboard.TargetProperty="(Control.BorderBrush).(SolidColorBrush.Color)"
To="#FF1F1F1F"
Duration="0:0:0.1" />
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>