案例6--ARPG游戏人物移动

ARPG游戏大家一定都有玩过，像《永远的伊苏》系列，DNF，还有许多flash游戏，超级玛丽、魂斗罗等。今天我们就来揭露其中人物移动的原理。
必须先看一下结果预览啊！http://www.iamsevent.com/upload/roleMove.swf
     首先，美工同学会给我们图片素材，可以是psd格式、jpg,png格式等所有flash支持的格式，之后我们就需要在FLASH CS工具来制作我们的素材元件。今天我们卡哇伊的美工童鞋给我的素材是一个小关羽形象，于是我们今天游戏的主人公就是关羽了，他移动方向有东南西北四个，每个方向上的移动动画将会由4张图片组成。
<ignore_js_op> 

拿到了素材后我们把素材拖入库中，之后就准备利用图片来逐一制作动画吧。我们先做west(西)方向上的移动动画，新建一个元件，取名为“人物移动-西”好了，元件类型保持默认的MovieClip，因为只有此类型才支持时间轴。进入元件编辑界面，我们在第一帧从库中拖出west中第一张图片放入元件中，并把关羽的中心对准十字注册点。这就完成了第一步，之后，我们在第5、10、15、20帧处右击鼠标，在弹出菜单中选择插入帧(Insert Frame)，再在第6、11、16帧插入关键帧(Insert Keyframe)，在这三个关键帧里依次放入我们剩下的三张图片素材，最后我们就完成了关羽向西移动的动画元件。按下回车键可以预览一下我们元件的播放，看啊，人物动起来了！
<ignore_js_op> 

按同样的步骤完成我们人物另外三个方向的移动动画元件。
<ignore_js_op> 

但我们的主人公只有一个，总不可能有四个吧？那就让他们四个合体好了呗~新建一个元件命名为“人物移动-总”，在元件中第一帧放入我们的“人物移动-东”元件，中心对准注册点后(对齐工作可以打开CS工具中的Window-->Align打开对齐功能窗口来帮助我们简单地做到)，之后我们在第10、20、30帧（这里帧的位置不一定需要10、20、30.可以任意选择，至于原因，稍后就会明白了）处插入关键帧，在关键帧里面放入我们另外三个方向的元件，然后我们给这四个关键帧取个名字方便我们查找，就叫他们moveEast, moveWest之类的吧。
<ignore_js_op> 
嗯，完成了这一切后我们把“人物移动-总”元件放到舞台上测试一下影片看看，咦？怎么回事？关羽在向东走了几步之后咋自动调转方向了？如果你理解flash动画的本质你就会知道问题何在了，当一个元件被添加到舞台上后它就会自动播放其内部动画，从时间轴最左侧播放到最后侧，播放到底后会从新回到最左边进行反复播放，这一点我们可以来做一个测试，把“人物移动-西”或者其他3个方向的移动元件随便放一个到舞台上然后测试影片，我们会看到关羽头正朝着一个方向不停运动。理解这个原理之后我们再回头来看看我们的“人物移动-总”元件中究竟出了什么问题。我们看到在时间轴上我们放了4个元件，每个元件内部都不停地在播放着动画（即人物朝着一个方向不停地走动的动画），在“人物移动-总”元件添加到舞台上后他内部的动画开始播放，从时间轴左边播放至右边，因为我们时间轴上放置了4个元件，那么在第一帧会播放第一个元件“人物移动-东”的动画，不过播放没一会后时间轴来到了第二个元件“人物移动-南”所在的时间轴，那么我们看到的就是“人物移动-南”内部的动画了，人物自然就会从朝东移动转向朝南移动了。
    那么我们应该做些什么来避免产生这个问题呢？在flash ActionScript脚本代码中我们有几个重要的操作动画的方法可以调用：
stop() ： 停止时间轴向右播放动画
play()：  开始让时间轴向右播放动画
gotoAndPlay()：跳至某一帧并从这一帧开始时间轴开始从左至右播放动画 
gotoAndStop()： 跳至某一帧并停在这一帧

这里，我们需要在“人物移动-总”元件的第一帧处添加脚本代码，并在脚本代码中写上：

1. stop()

复制代码

这样就能在时间轴一开始便阻止元件中的时间轴从左至右播放动画，就不会发生人物过一会儿自动转向的情况了。好了，测试一下影片，发现果然如我们所希望的那样。人物一直朝着一个方向运动而不会自动转向，可能有人会问我：咦？你不是加了stop()阻止了动画播放么？怎么关羽还是在走动呢？这是因为你stop()语句添加在了“人物移动-总”的时间轴中，那么“人物移动-总”的时间轴就会一直停在第一帧上面，不过第一帧上有一个内部带有动画的元件，该元件内部的时间轴上可没有添加stop()语句来阻止其播放动画，所以它内部的动画还是一直在播放着的，不受影响。若你想在防止人物自动转向的同时连人物自动朝一个方向的走动也阻止掉的话，就可以进入“人物移动-东”元件并在它第一帧添加上stop()的脚本代码。

稍做休息先，讲得太详细了篇幅就有点紧张……