WPF how to animate picture inside listboxitem using data trigger?

Question

I have a listbox with templated listboxitem which is binded to an object. one of the listboxitem controls is an image and it's source is also binded to a property inside the datacontext, So the pictur inside the Image control is different according to that property. I want to animate the image but only specific one (when the binded property value is some specific value only). I guess there are other ways to do that, maybe using code behind. But I would realy like use it in the xaml code, so I thought using animation inside DataTrigger, it makes sense to me because the starting/ending the animation depends on the DataContext:

                    <DataTrigger Binding="{Binding Path=Value.SomeProperty}"
                                  Value="SomePropertyValue">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard TargetName="SomePropertyIcon">
                                    <StaticResource ResourceKey="SomePropertyValueAnimation"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard TargetName="SomePropertyIcon">
                                    <StaticResource ResourceKey="StopSomePropertyValueAnimation"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.ExitActions>
                    </DataTrigger>

But I cannot make it work any way. I tried to put that code inside a style of the listBox and then apply that style to the image, it didnt work, I also tried to put inside the listBox.ItemTamplate, and other places but nothing helped. Here is the code. maybe it can help to understand (I pasted only relevan code here):

<UserControl ...>
<UserControl.Resources>
    <local:SomePropertyToImageConverter x:Key="somePropertyToImageConverter"/>
    <DoubleAnimation x:Key="SomePropertyValueAnimation"  Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" To="45"  Duration="0:0:2" RepeatBehavior="Forever"/>
    <DoubleAnimation x:Key="StopSomePropertyValueAnimation" Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)"   To="0" Duration="0:0:2"/>
</UserControl.Resources>
<Grid>

    <ListBox Name="myListBox" 
        ItemsSource="{Binding Path=myDataContext}" IsEnabled="True" Focusable="True" SelectionMode="Extended">

        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <Image Width="20" Height="20" Name="SomePropertyIcon"

                    Source="{Binding Path=Value.SomeProperty, Converter={StaticResource somePropertyToImageConverter}}"/>

                </Grid>

                <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding Path=Value.SomeProperty}"
                                  Value="SomePropertyValue">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard TargetName="SomePropertyIcon">
                                    <StaticResource ResourceKey="SomePropertyValueAnimation"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard TargetName="SomePropertyIcon">
                                    <StaticResource ResourceKey="StopSomePropertyValueAnimation"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </DataTemplate.Triggers>

            </DataTemplate>
        </ListBox.ItemTemplate>
        <ListBox.ItemContainerStyle>
            <Style TargetType="{x:Type ListBoxItem}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path=Value.SomeProperty}"
                                  Value="SomePropertyValue">                            
                        <Setter Property="Background" Value="Bisque"/>
                    </DataTrigger>

                </Style.Triggers>
            </Style>
        </ListBox.ItemContainerStyle>
    </ListBox>
</Grid>

Answer 1

Animation cannot change property values for a property path that does not exist. The "Image" you are trying to manipulate does not have "Rotate transform" you should add it and it should work:

    <Image Width="20" Height="20" Name="SomePropertyIcon"
           Source="{Binding Path=Value.SomeProperty, Converter={StaticResource somePropertyToImageConverter}}">
        <Image.RenderTransform >
            <RotateTransform />
        </Image.RenderTransform>
    </Image>