Блог

Главная - Вопросы по программированию - Анимировать границу при изменении значения метки

Анимировать границу при изменении значения метки

#wpf #vb.net

#wpf #vb.net

Вопрос:

У меня есть эти границы и метки:

 <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 код у меня есть этот фрагмент кода, который правильно устанавливает значения и отображается в label:

 ...
 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
...

Как бы я анимировал эту границу для мигания или поворота или любой другой анимации при изменении значения «колицина»?

Комментарии:

1. Во-первых, я вижу, что вам не хватает Storyboard.TargetName= , добавить Storyboard.TargetName="PulseBoba" , но это также, если вы хотите настроить таргетинг на границу, в противном случае вам нужно добавить имя к метке … есть и другие проблемы… IMHO создайте стиль, который вы можете использовать, который нацелен либо на метку, либо на границу, которую вы можете использовать.

Ответ №1:

Вы могли бы, например, связать Tag свойство Border и использовать EventTrigger , которое прослушивает Binding.SourceUpdated подключенное событие:

 <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 себя в коде на основе любого условия. Это типичный пример случая, когда имеет смысл реализовать в представлении вещи, связанные с представлением.