从以前的状态返回时,WPF 数据触发器重新启动动画
本文关键字:数据 WPF 触发器 重新启动 动画 状态 返回 | 更新日期: 2023-09-27 18:34:01
我正在开发一个WPF应用程序。 我有一个 ToggleButton,当它被选中时应该会发出绿色光,当与按钮关联的模型中出现错误时,它应该会闪烁红色光。 (它是一个 ObservableCollection<> ItemsControl)。 执行 DataTrigger 时,动画工作正常,但我希望动画在我选择按钮然后取消选择它时恢复。 换句话说,如果存在与按钮模型关联的错误(它闪烁红色)并且我选择它(现在它是绿色的),然后我取消选择它,那么它应该恢复为闪烁的红色。 实际发生的事情是,一旦取消选择按钮,它只会保持其红色状态而不闪烁。 这是我的 xaml。
<!-- This template is for the selection buttons on the left hand side of the application. -->
<ControlTemplate x:Key="SelectionControlTemplate" TargetType="{x:Type ToggleButton}">
<Grid Width="Auto" Height="Auto" Margin="3" >
<Rectangle x:Name="BaseLayer" HorizontalAlignment="Left" Height="50" RadiusY="8" RadiusX="8" Stroke="Black" StrokeThickness="1" VerticalAlignment="Top" Width="50" Fill="{DynamicResource FutureBlueButtonGradient}"/>
<Rectangle x:Name="GlowLayer" HorizontalAlignment="Left" Height="52.25" Width="52.25" RadiusY="6.5" RadiusX="6.5" Stroke="{x:Null}" StrokeThickness="1" VerticalAlignment="Top" Margin="-1.125"/>
<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Grid>
<!-- Animation for blinking. -->
<ControlTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="GlowLayer" RepeatBehavior="Forever">
<EasingColorKeyFrame KeyTime="0" Value="#FFFD0002"/>
<EasingColorKeyFrame KeyTime="0:0:0.5" Value="#3FFD0002"/>
<EasingColorKeyFrame KeyTime="0:0:1" Value="#FFFD0002"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<!-- Style Triggers -->
<ControlTemplate.Triggers>
<!-- ERROR CONDITION TRIGGER: Flashes a selection button glowing red when HasTripOrError property is set to true. -->
<DataTrigger Binding="{Binding HasTripOrError, UpdateSourceTrigger=PropertyChanged}" Value="True">
<Setter Property="Stroke" TargetName="GlowLayer" Value="{StaticResource SolidRedGlowBrush}"/>
<Setter Property="Effect" TargetName="GlowLayer">
<Setter.Value>
<BlurEffect/>
</Setter.Value>
</Setter>
<Setter Property="Fill" TargetName="GlowLayer" Value="{StaticResource RadialGradientRedGlowBrush}"/>
<DataTrigger.EnterActions>
<BeginStoryboard x:Name="ErrorGlowStoryBoard" Storyboard="{StaticResource Storyboard1}"/>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<StopStoryboard BeginStoryboardName="ErrorGlowStoryBoard"/>
</DataTrigger.ExitActions>
</DataTrigger>
<!-- MOUSE OVER TRIGGER: Puts a white outline around the button and increases its brightness a little on mouse over. -->
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Stroke" TargetName="GlowLayer" Value="#FFFDFFFE"/>
<Setter Property="Fill" TargetName="BaseLayer" Value="{StaticResource FutureBlueButtonMouseOverGradient}"/>
</Trigger>
<!-- SELECTED TRIGGER: Makes the selected control glow green. -->
<Trigger Property="IsChecked" Value="True">
<Setter Property="Effect" TargetName="GlowLayer">
<Setter.Value>
<BlurEffect/>
</Setter.Value>
</Setter>
<Setter Property="Fill" TargetName="GlowLayer" Value="{StaticResource RadialGradientGreenGlowBrush}"/>
<Setter Property="Stroke" TargetName="GlowLayer" Value="{StaticResource SolidGreenGlowBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
下面是属性背后的相关代码。 请注意,我试图在动画移动到取消选择状态后提出负责动画的属性。
public bool IsSelected
{
get { return _is_selected; }
set
{
if( _is_selected != value )
{
_is_selected = value;
RaisePropertyChangedEvent("IsSelected");
//We also need to raise the HasTripOrError property here to resume
//The red glow animation if there is an error.
RaisePropertyChangedEvent("HasTripOrError");
}
}
}
public bool HasTripOrError
{
get { return _has_error; }
set
{
if( value != _has_error)
{
_has_error = value;
RaisePropertyChangedEvent("HasTripOrError");
}
}
}
一旦 IsSelected 过渡到 false,如何重新启动动画。
将IsSelected
属性写为:
private bool _is_selected;
public bool IsSelected
{
get { return _is_selected; }
set
{
if (_is_selected != value)
{
_is_selected = value;
UpdateProperty("IsSelected");
//We also need to raise the HasTripOrError property here to resume
//The red glow animation if there is an error.
HasTripOrError = !HasTripOrError;
HasTripOrError = !HasTripOrError;
}
}
}
HasTripOrError
绑定到DataTrigger
.因此,它只会在 HasTripOrError
的值发生变化时执行。
HasTripOrError = !HasTripOrError;
HasTripOrError = !HasTripOrError;
上面的代码确保
HasTripOrError
值将恢复到 最后的原始值和如果有任何Binding
相关联,那将 得到反映。