如何以编程方式创建silverlight序列动画？

Question

我需要设置一个矩形的动画,以便首先水平移动,然后在2秒后使其垂直移动.所有这些都应该以编程方式完成.

有人可以帮帮我吗？谢谢!

Answer 1

使用以下XAML:

<UserControl x:Class="SilverlightApplication1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Canvas x:Name="LayoutRoot">
    <Rectangle x:Name="myBox" Fill="Red" Height="100" Width="100" Canvas.Left="0" Canvas.Top="0" />
  </Canvas>
</UserControl>

您可以使用以下方式以编程方式创建动画:

public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();

        Loaded += MainPage_Loaded;
    }

    void MainPage_Loaded(object sender, RoutedEventArgs e)
    {
        var moveAnimation = CreateAnimation(this.myBox);
        moveAnimation.Begin();
    }

    public Storyboard CreateAnimation(FrameworkElement element)
    {
        var storyboard = new Storyboard();

        var downAnimation = new DoubleAnimationUsingKeyFrames();
        Storyboard.SetTarget(downAnimation, element);
        Storyboard.SetTargetProperty(downAnimation, new PropertyPath(Canvas.TopProperty));
        downAnimation.KeyFrames.Add(new EasingDoubleKeyFrame
        {
            KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(2)),
            Value = 200
        });
        storyboard.Children.Add(downAnimation);

        var overAnimation = new DoubleAnimationUsingKeyFrames();
        Storyboard.SetTarget(overAnimation, element);
        Storyboard.SetTargetProperty(overAnimation, new PropertyPath(Canvas.LeftProperty));
        overAnimation.KeyFrames.Add(new EasingDoubleKeyFrame
        {
            KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(2)),
            Value = 0
        });
        overAnimation.KeyFrames.Add(new EasingDoubleKeyFrame
        {
            KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(4)),
            Value = 200
        });
        storyboard.Children.Add(overAnimation);


        return storyboard;
    }
}