wpf中的图像marque动画?

时间:2013-11-15 05:49:58

标签: c# wpf animation

在我的项目中,我想要大量的图片。我试过但没有成功。当我给予持续时间相同时,所有图像都被组合并移动。

我的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>

我的模特是 -

enter image description here

1 个答案:

答案 0 :(得分: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>