为了指示错误,我想暂时更改按钮的背景颜色。我是 WPF 动画的新手,找不到一个简单的示例来继续。更复杂的是,我正在使用触发器来处理错误通知。
所以这是我的 XAML,我想知道如何用动画替换背景设置器(例如,在五秒内闪烁三次红色或类似的东西)。
<UserControl>
<UserControl.Resources>
<Style x:Key="ErrorStyle" TargetType="Button">
<!--Clear the default error template (a red border)-->
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<AdornedElementPlaceholder />
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="True">
<Setter Property="ToolTip"
Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}" />
<!--TODO: Replace with animation-->
<Setter Property="Background" Value="Orange"/>
</Trigger>
</Style.Triggers>
</Style>
</UserControl.Resources>
<Grid>
<Button Command="{Binding ProgramCommand, ValidatesOnExceptions=True, ValidatesOnDataErrors=True}"
Style="{StaticResource ErrorStyle}">
_Program
</Button>
</Grid>
</UserControl>
我也愿意接受更好(简单)错误通知的建议。
你可以使用Trigger.EnterActions
。
<Trigger Property="Validation.HasError" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" Duration="0:0:0.3"
From="White" To="Red" RepeatBehavior="3x" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
(假设背景是SolidColorBrush
,因为Storyboard.TargetProperty
指向其Color
属性)
对于渐变,您还可以对特定色标的颜色进行动画处理,例如
<TextBox Text="{Binding TestInt}">
<TextBox.Background>
<LinearGradientBrush>
<GradientStop Color="White" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</TextBox.Background>
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color" Duration="0:0:0.3"
From="White" To="Red" RepeatBehavior="3x" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
感谢@H.B.的回答,这是我的最终代码。您会注意到,我没有将按钮的背景设置为纯色,而是在默认按钮画笔的每个渐变处进行了颜色更改。这将创建一种效果,将整个按钮变为红色,但允许它恢复到正常的渐变外观。
<UserControl>
<UserControl.Resources>
<Style Key="ErrorStyle" TargetType="Button">
<!--Clear the default error template (a red border)-->
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<AdornedElementPlaceholder />
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="True">
<Setter Property="ToolTip"
Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}" />
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color" To="Red" Duration="0:0:0.5" AutoReverse="True" RepeatBehavior="3x" />
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color" To="Red" Duration="0:0:0.5" AutoReverse="True" RepeatBehavior="3x" />
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[2].Color" To="Red" Duration="0:0:0.5" AutoReverse="True" RepeatBehavior="3x" />
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[3].Color" To="Red" Duration="0:0:0.5" AutoReverse="True" RepeatBehavior="3x" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
</Style.Triggers>
</Style>
</UserControl.Resources>
<Grid>
<Button Command="{Binding ProgramCommand, ValidatesOnExceptions=True, ValidatesOnDataErrors=True}"
Style="{StaticResource ErrorStyle}">
_Program
</Button>
</Grid>
</UserControl>
<Trigger Property="Validation.HasError" Value="True">
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background" From="White"
To="Red" Duration="0:0:1" AutoReverse="True" RepeatBehavior="3x"/>
</Storyboard>
</BeginStoryboard>
</Trigger>