WPF animation on data change

问题

I'm working on a WPF grid listing some Objects. In case the data of the object changes I want to start an animation.

Below an excerpt of the XAML code is listed

    <ListView Name="ListViewEmployeeDetails" Grid.Row="1" Margin="4,109,12,23"  ItemsSource="{Binding Products}"  >
        <ListView.View>
            <GridView x:Name="grdTest">
                <GridViewColumn Header="ID"  Width="100">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock x:Name="idField" Text="{Binding ID}" TextDecorations="Underline" Foreground="Blue"/>
                            <DataTemplate.Triggers>
                                <DataTrigger Binding="{Binding ID}">
                                    <DataTrigger.EnterActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Duration="0:0:5" To="0.0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="idField"/>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.EnterActions>
                                </DataTrigger>
                            </DataTemplate.Triggers>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
                <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}"  Width="100" />
                <GridViewColumn Header="Price" DisplayMemberBinding="{Binding Price}" Width="100" />
                <GridViewColumn Header="Reliab" DisplayMemberBinding="{Binding Reliability}" Width="100" />
            </GridView>
        </ListView.View>
    </ListView>

Whenever a property changes, I fire a PropertyChangedEvent. For instance, the setter of the ID looks like:

        set
        {
            m_ID = value;
            OnPropertyChanged("ID");
        }

Where the OnPropertyChanged function looks like:

    #region INotifyPropertyChanged Members

    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
    #endregion

However, when the ID is changed, the animation isn't triggered. Any idea on how to fix this?

回答1:

You should use an event trigger:

Try something like this:

<DataTemplate.Triggers>
    <EventTrigger RoutedEvent="Binding.TargetUpdated">
        <BeginStoryboard>
           <Storyboard>
              <DoubleAnimation Duration="0:0:5" To="0.0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="idField"/>
           </Storyboard>
        </BeginStoryboard>
    </EventTrigger>
</DataTemplate.Triggers>

Edit: don't forget to set this within your template!

<TextField Name="idField" Text="{Binding ID, NotifyOnTargetUpdated=True}" />

来源：https://stackoverflow.com/questions/27926451/wpf-animation-on-data-change

标签

wpf

xaml

animation

mvvm