每个 ListBox.ItemTemplate>DataTemplate 中的不同 WPF 故事板动画

Question

我想为每个 ListView 项设置不同的动画。

<Window.Resources>
    <Storyboard x:Key="myAnimation" RepeatBehavior="Forever">
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Source" Duration="0:0:2">
            <DiscreteObjectKeyFrame KeyTime="0:0:0">
                <DiscreteObjectKeyFrame.Value>
                    <BitmapImage UriSource="/img/image1.png"/>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
            <DiscreteObjectKeyFrame KeyTime="0:0:1">
                <DiscreteObjectKeyFrame.Value>
                    <BitmapImage UriSource="/img/image2.png"/>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>

<ListBox  Name="SessionList" HorizontalContentAlignment="Stretch" >
    <ListBox.ItemTemplate>
        <DataTemplate>
           <Image x:Name="stateimage">
                <Image.Triggers>
                    <EventTrigger RoutedEvent="Loaded">
                        <BeginStoryboard Storyboard="{StaticResource myAnimation}">
                        </BeginStoryboard>
                    </EventTrigger>
                </Image.Triggers>
            </Image>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

上面的 XAML 代码可以很好地为每个列表项显示相同的动画myAnimation。但是我如何才能实现它以显示不同的动画（即我必须在 Window.Resources 中定义几个故事板），取决于 listitem ViewModel 的绑定属性？

编辑：

通过下面链接的问题，我终于以这种方式工作了。太棒了！

<Window.Resources>
    <Storyboard x:Key="animLOAD" RepeatBehavior="Forever">...</Storyboard>
    <Storyboard x:Key="animPREPARED" RepeatBehavior="Forever">...</Storyboard>
    <Style x:Key="animStyle" TargetType="{x:Type Image}">
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=st, Mode=OneWay}" Value="LOAD">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource animLOAD}" />
                </DataTrigger.EnterActions>
            </DataTrigger>
            <DataTrigger Binding="{Binding Path=st, Mode=OneWay}" Value="PREPARED">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource animPREPARED}" />
                </DataTrigger.EnterActions>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

<Image Style="{StaticResource animStyle}" /> 

Answer 1

我不确定您的模型对于这种方法的可访问性，但您应该能够在某种程度上使用它。 您可以使用一组 DataTrigger，每个都继承一个故事板：

<DataTrigger Binding="{Binding Property}" Value="SomeValue">                                            
    <DataTrigger.EnterActions>
        <BeginStoryboard Storyboard="{StaticResource Storyboard}"/>
    </DataTrigger.EnterActions>
</DataTrigger>

我会在 ControlTemplate 中使用它们：

<ControlTemplate TargetType="Image">
    <ControlTemplate.Triggers>
        <!-- DataTriggers -->
    </ControlTemplate.Triggers>
</ControlTemplate>

编辑：

This Question 也有类似的解决方案，您可能根本不需要ControlTemplate。