Siverlight之路1-动画

刚学Siverlight吧自己的程序一点点记录下来，成为我学习见证者。慢慢"累"代码吧！偶尔能回头看看自己的代码，看看自己是怎么走过来的。

实现在画布上添加一个方块跟随移动到鼠标点击的地方。

前台XAML代码

<UserControl x:Class="SLBegin.Animation"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width="640" Height="480">
    <Canvas x:Name="LayoutRoot" Width="600" Height="400" Background="Plum"
            MouseLeftButtonDown="LayoutRoot_MouseLeftButtonDown">
       
    </Canvas>
</UserControl>

后台.cs文件代码

#region 文件描述
/*******************************************************************
 * 作者: Vincent-Wen
 * 功能描述：Siverlight3 的动画，在画布上创建一个正方形，采用Siverlight
 * 动画的故事板(Storyboard)动画效果实现正方形随鼠标点击移动
 * 版本： v1.0
 * 创建时间：2010年1月10日20:51:42
 * 修订描述： 
 * 主要函数和功能列表： 
*  最后修订日期：
******************************************************************/
#endregion

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SLBegin
{
    public partial class Animation : UserControl
    {
        Rectangle rect;//创建一个方块
        public Animation()
        {
            InitializeComponent();

            #region 创建一个方块
            rect = new Rectangle();
            rect.Fill = new SolidColorBrush(Colors.Red);
            rect.Width = 50;
            rect.Height = 50;
            rect.RadiusX = 5;
            rect.RadiusY = 5;
            LayoutRoot.Children.Add(rect);         
            #endregion

            //注册鼠标点击事件
            this.LayoutRoot.MouseLeftButtonDown += new
                MouseButtonEventHandler(LayoutRoot_MouseLeftButtonDown);

        }


        private void LayoutRoot_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {

            //获取矩阵当前坐标
            Point point = e.GetPosition(this.LayoutRoot);
            //获取鼠标点击坐标
            Point mousePoint = e.GetPosition(this.LayoutRoot);

            //实例化故事板
            Storyboard storyboard=new Storyboard();

            #region 创建X轴方向动画

            //实例化X轴动画对象
            DoubleAnimation doubleAnimationX=new DoubleAnimation();
            //设置动画延迟
            doubleAnimationX.Duration=new Duration(TimeSpan.FromMilliseconds(500));
            //设置动画起始位置
            doubleAnimationX.From = Canvas.GetLeft(rect);
            //设置动画完成值
            doubleAnimationX.To = mousePoint.X;

            //设置动画操作对象
            Storyboard.SetTarget(doubleAnimationX,this.rect);
            //设置动画对象属性
            Storyboard.SetTargetProperty(doubleAnimationX, new PropertyPath("(Canvas.Left)"));
            //将动画加载到故事板(Storyboard)
            storyboard.Children.Add(doubleAnimationX);

            #endregion

            #region 创建Y轴方向动画
            //实例化Y轴动画对象
            DoubleAnimation doubleAnimationY=new DoubleAnimation();
            //设置动画延迟
            doubleAnimationY.Duration=new Duration(TimeSpan.FromMilliseconds(500));
            //设置动画初始值
            doubleAnimationY.From = Canvas.GetTop(rect);
            //设置动画的完成值
            doubleAnimationY.To = mousePoint.Y;

            Storyboard.SetTarget(doubleAnimationY,this.rect);
            Storyboard.SetTargetProperty(doubleAnimationY, new PropertyPath("(Canvas.Top)"));
            storyboard.Children.Add(doubleAnimationY);

            #endregion

            //开始动画
            storyboard.Begin();

        }
    }
}