C#开发WPF/Silverlight动画及游戏系列教程(Game Tutorial)：(六)完美移动
????經過前面的介紹和學習，我們分別掌握了如何點擊鼠標讓對象移動，并且實現2D人物的動作動畫。那么，如何將兩者完美的進行融合呢？這一節的內容將涉及到很多重要的技術及技巧，很關鍵哦。
??? 那么同樣的，前臺xaml還是保持不變，接下來看后臺C#第一部分：
??????? int count = 0;
??????? Image Spirit;
??????? Storyboard storyboard;
??????? public Window6() {
??????????? InitializeComponent();
??????????? Spirit = new Image();
????????? ??Spirit.Width = 150;
??????????? Spirit.Height = 150;
??????????? Carrier.Children.Add(Spirit);
??????????? Canvas.SetLeft(Spirit, 0);
??????????? Canvas.SetTop(Spirit, 0);
??????????? DispatcherTimer dispatcherTimer = new DispatcherTimer();
??????????? dispatcherTimer.Tick += new EventHandler(dispatcherTimer_Tick);
??????????? dispatcherTimer.Interval = TimeSpan.FromMilliseconds(150);
??????????? dispatcherTimer.Start();
??????? }
??????? private void dispatcherTimer_Tick(object sender, EventArgs e) {
? ??????????Spirit.Source = new BitmapImage((new Uri(@"Player\" + count + ".png", UriKind.Relative)));
??????????? count = count == 7 ? 0 : count + 1;
??????? }
??? 上面代碼基本上相對于前面幾節沒有太多改變，只是結合了第一節和第四節的內容。
??? 那么再看C#第二部分：
?? private void Carrier_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) {
??????????? Point p = e.GetPosition(Carrier);
??????????? Move(p);
???}
???private void Move(Point p) {
??????????? //創建移動動畫
??????????? storyboard = new Storyboard();
??????????? //創建X軸方向動畫
??????????? DoubleAnimation doubleAnimation = new DoubleAnimation(
????????????? Canvas.GetLeft(Spirit),
????????????? p.X,
????????????? new Duration(TimeSpan.FromSeconds(1))
??????????? );
??????????? Storyboard.SetTarget(doubleAnimation, Spirit);
??????????? Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(Canvas.Left)"));
??????????? storyboard.Children.Add(doubleAnimation);
??????????? //創建Y軸方向動畫
??????????? doubleAnimation = new DoubleAnimation(
????????????? Canvas.GetTop(Spirit),
????????????? p.Y,
????????????? new Duration(TimeSpan.FromSeconds(1))
??????????? );
??????????? Storyboard.SetTarget(doubleAnimation, Spirit);
??????????? Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath("(Canvas.Top)"));
??????????? storyboard.Children.Add(doubleAnimation);
??????????? //將動畫動態加載進資源內
??????????? if (!Resources.Contains("rectAnimation")) {
??????????????? Resources.Add("rectAnimation", storyboard);
??????????? }
??????????? //動畫播放
??????????? storyboard.Begin();
???}
??? 不難看出鼠標左鍵點擊事件中Move()方法，該方法大家如果熟悉第一節的話將非常好理解，通過將這兩段代碼進行合成，即可以實現鼠標點哪主角就向哪移動，同時主角的動畫始終保持為跑步狀態。
??? 那么該動畫并非完美，存在以下3個問題：
??? 一、主角始終為跑步狀態，那么能否當主角移動到目的地后即變成站立狀態呢？
??? of course，方法不要太多，這里我給大家一個小提示，例如我們可以dispatcherTimer_Tick事件中進行如下判斷：
??? if (storyboard != null && storyboard.GetCurrentTime() == TimeSpan.FromSeconds(1)) {
??????????? TODO...?
??????????? //主角的圖片源切換成站立系列幀圖片即可。
??? }
??? 當然此方法只是N多方法之一。
?? ?二、主角定位的坐標始終處于圖片的左上角，能否定位到主角的腳底，例如我鼠標點哪，主角移動到該處后腳的位置站在此點上，實現精確定位？
??? 這其實并不難，涉及到一個圖片定位算法問題，您需要設置一個Point Spirit_Position{get;set}屬性來存儲主角的坐標。并且該坐標的Spirit_Position.X，Spirit_Position.Y值分別定位到主角的腳底，如下圖：
??? 然后在以后的調用中都使用該坐標來取代Canvas.getLeft(),Canvas.getTop()。
??? 三、主角朝向如何實現8個方向，即往哪邊跑就朝向哪邊？
??? 這就是典型的算法問題了，其實也很簡單，根據主角移動的目標Target.X和Target.Y分別與主角初始位置的Old.X和Old.Y進行一個角度計算，然后根據判斷返回0-7(int)，8個數字分別代表8個朝向，這樣在Spirit.Source設置時就調用相應角度的圖片源系列幀即可。
??? 到此，我們已經能夠完美的實現角色的移動與停止等動畫，接下來的章節我將就地圖結構與主角在地圖中的處理進行詳細講解，敬請關注。
作者：深藍色右手出處：http://alamiye010.cnblogs.com
教程目錄及源碼下載：點擊進入(歡迎加入WPF/Silverlight小組 WPF/Silverlight博客團隊)
本文版權歸作者和博客園共有，歡迎轉載。但未經作者同意必須保留此段聲明，且在文章頁面顯著位置給出原文連接，否則保留追究法律責任的權利。
總結
以上是生活随笔為你收集整理的C#开发WPF/Silverlight动画及游戏系列教程(Game Tutorial)：(六)完美移动的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 浅谈中西方文化差异
- 下一篇： Ruby BigDecimal库拒绝服务