C#开发WPF/Silverlight动画及游戏系列教程(Game Course)：(十六) 牵引式地图移动模式②

核心提示： 以上代码中用黄色背景突出的即为需要修改的地方，其中Storyboard.SetTargetProperty(keyFramesAnimationX, new PropertyPath("X"));和Storyboard.SetTargetProperty(keyFra

以上代码中用黄色背景突出的即为需要修改的地方，其中Storyboard.SetTargetProperty(keyFramesAnimationX, new PropertyPath("X"));和Storyboard.SetTargetProperty(keyFramesAnimationY, new PropertyPath("Y"));这两句作用是将主角（Spirit）的X，Y属性值作为Storyboard动画的更新对象目标，值得注意的是keyFrame.Value = i == 0 ? Spirit.X : (framePosition[i].X - SpiritCenterX) * GridSize;与keyFrame.Value = i == 0 ? Spirit.Y : (framePosition[i].Y - SpiritCenterY) * GridSize;这两句话，它们的作用是将寻路后得到的所有路径点按从角色起点到终点这样的顺序依次做为Storyboard的关键帧添加进Storyboard动画中，并且首先舍弃寻路得到的第一个点而以坐标（Spirit.X，Spirit.Y）作为动画起点（…i == 0 ? Spirit.X ……i == 0 ? Spirit.Y…）从而起到平滑衔接动画的效果。千万别小看它，很多人往往忽略了它导致动画衔接粗糙（大家可以尝试将keyFrame.Value = i == 0 ? Spirit.X : (framePosition[i].X - SpiritCenterX) * GridSize;替换成keyFrame.Value = (framePosition[i].X - SpiritCenterX) * GridSize;将keyFrame.Value = i == 0 ? Spirit.Y : (framePosition[i].Y - SpiritCenterY) * GridSize;替换成keyFrame.Value = (framePosition[i].Y - SpiritCenterY) * GridSize;后再运行一下程序看看，当角色正在移动且还未到达终点的时候，此时你用鼠标再点击别的地方让主角向新的目的地移动，由于未采取平滑处理将导致角色会突然跳动一下的效果（起始坐标定位错误BUG）。为了配合大家更好的理解，我用张图来说明（图中的网格即为单位为20*20的单元格，即GridSize=20的效果）：