标签值更改时对边框进行动画处理

Question

我有这些边框和标签：

<Border x:Name="PulseBoba" Width="auto" Height="auto" Background="#FFF75959" CornerRadius="2" Margin="0" HorizontalAlignment="Left">
                                    <Label Content="{Binding kolicina}" FontSize="20" DockPanel.Dock="Right"  HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" Width="Auto" Margin="5,0">
                                      <Label.Triggers>        
            <EventTrigger RoutedEvent="Binding.TargetUpdated">            
                <BeginStoryboard>                    
                    <Storyboard>                        
                        <DoubleAnimation 
                            Storyboard.TargetProperty="(Label.RenderTransform).(RotateTransform.Angle)"                             
                            From="0" 
                            To="360" 
                            Duration="0:0:2"/>                    
                    </Storyboard>                
                </BeginStoryboard>            
            </EventTrigger>    
        </Label.Triggers>
                                    </Label>
                                </Border>

在我的 vb.net 代码中，我有这段代码，它可以正确设置值并显示在标签中：

...
 Public Event PropertyChanged As PropertyChangedEventHandler _
    Implements INotifyPropertyChanged.PropertyChanged
Private Sub NotifyPropertyChanged(ByVal info As String)
    RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(info))
End Sub
Public Property kolicina() As String
    Get
        Return m_kolicina
    End Get
    Set
        m_kolicina = Value
        NotifyPropertyChanged("kolicina")
    End Set
End Property
...

当"kolicina"的值发生变化时，我将如何对此边框进行动画处理以闪烁或旋转或任何其他动画？

Answer 1

例如，

您可以绑定Border的Tag属性并使用侦听Binding.SourceUpdated附加事件的EventTrigger：

<Border x:Name="PulseBoba" Width="auto" Height="auto" Background="#FFF75959" CornerRadius="2" Margin="0" HorizontalAlignment="Left"
        Tag="{Binding kolicina, NotifyOnTargetUpdated=True}">
    <Border.RenderTransform>
        <RotateTransform Angle="0" />
    </Border.RenderTransform>
    <Border.Triggers>
        <EventTrigger RoutedEvent="Binding.SourceUpdated">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation 
                            Storyboard.TargetProperty="(Border.RenderTransform).(RotateTransform.Angle)"                             
                            From="0" 
                            To="360" 
                            Duration="0:0:2"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Border.Triggers>
    <Label Content="{Binding kolicina}" FontSize="20" DockPanel.Dock="Right"  HorizontalAlignment="Center" VerticalAlignment="Center" 
                   FontWeight="Bold" Width="Auto" Margin="5,0" />
</Border>

如果需要更多控制，则应以编程方式实现动画。例如，您可以在视图中处理视图模型的PropertyChanged事件，并根据任何条件在代码隐藏中自行创建Storyboard。这是一个典型的示例，其中在视图中实现与视图相关的东西非常有意义。