c# - wpf中的图像标记动画？

Question

在我的项目中，我想要选取 n 个图像。我试过但没有成功。当我给出相同的持续时间时，所有图像都被组合并移动。

我的 XAML -

 <Grid>
        <Canvas x:Name="MyCanvas" VerticalAlignment="Center">
            <Canvas.Triggers>
                <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                    <BeginStoryboard >
                        <Storyboard Storyboard.TargetName="img1" Storyboard.TargetProperty="(Canvas.Left)">
                            <DoubleAnimation From="0" To="514" Duration="0:0:20" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
                <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                    <BeginStoryboard >
                        <Storyboard Storyboard.TargetName="img2" Storyboard.TargetProperty="(Canvas.Left)">
                            <DoubleAnimation From="0" To="514" Duration="0:0:20" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
                <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                    <BeginStoryboard >
                        <Storyboard Storyboard.TargetName="img3" Storyboard.TargetProperty="(Canvas.Left)">
                            <DoubleAnimation From="0" To="514" Duration="0:0:20" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Canvas.Triggers>
            <Image Name="img1" Source="/Images/01.jpg" Height="180" Width="120"  />
            <Image Name="img2" Source="/Images/02.jpg" Height="180" Width="120"  />
            <Image Name="img3" Source="/Images/03.jpg" Height="180" Width="120"  />
        </Canvas>
    </Grid>

我的模型是 -

Answer 1

请参阅以下链接并将其应用于您的情况。

http://weblogs.asp.net/razan/archive/2009/10/01/creating-marquee-scrolling-text-in-wpf.aspx

更新1：

修改您的代码如下似乎满足您的要求

<Grid>
            <Canvas x:Name="MyCanvas" VerticalAlignment="Center">
                <Canvas.Triggers>
                    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                        <BeginStoryboard >
                            <Storyboard Storyboard.TargetName="panel" Storyboard.TargetProperty="(Canvas.Left)">
                                <DoubleAnimation From="0" To="514" Duration="0:0:20" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>                   
                </Canvas.Triggers>
                <StackPanel x:Name="panel" Orientation="Horizontal">
                    <Image Name="img1" Source="/Images/01.jpg" Height="180" Width="120"  />
                    <Image Name="img2" Source="/Images/02.jpg" Height="180" Width="120"  />
                    <Image Name="img3" Source="/Images/03.jpg" Height="180" Width="120"  />
                </StackPanel>
            </Canvas>
        </Grid>