Flash实例教程——鱼戏莲叶间 (1)

成疯也成魔

　　鱼戏莲叶间（如图1所示）是一个将鼠标跟随效果应用得非常巧妙的例子。该动画中，一条可爱的鱼儿在莲叶间畅游。最吸引人的是，这条鱼儿会紧紧跟随着您的鼠标，并且在转身回头之间，鱼头、鱼身以及鱼尾之间的运动显得非常连贯。一般的鼠标跟随效果往往只应用了简单的跟随，实际上就是ActionScript的简单调用。本例将告诉您如何在脚本程序的基础上加入一些技巧，使做出来的效果更富情趣，更惹人眼球。本例在帧上下的功夫并不多，关键的地方在影片剪辑元件的调用和安排上。学完本实例，不但可以掌握如何制作鼠标跟随效果，而且对动画创作的技巧会有一个新的认识。

登录/注册后可看大图

图1　“鱼戏莲叶间”效果图 : 软件知识点 : 影片剪辑元件的链接 : attachMovie 语句 : with 语句 : duplicateMovieClip 语句 : startDrag 语句 　　　 　　实例分析 　　在制作“鱼戏莲叶间”之前，让我们来对实例进行一些分析，以便理清思路，对全局有一个系统的把握。 　　制作特点 　　本任务主要有以下特点： 　　（1）要做的鱼其实只有鱼头、带鳍的鱼身和不再鳍的鱼身3个元件，整条鱼是通过脚本程序组合起来的。在鱼和莲叶的布置上都要用到深度级别（level）的概念。 　　（2）鼠标跟随效果实际上是使对象位置随鼠标的运动而不断变化，这样的效果很容易就做出来了。但是要将鼠标跟随效果做到出神入化，往往需要进行一些技巧性的计算。本例的技巧重点在于对鱼的各部分的运动速度和方向的控制。 　　创意分析 　　鼠标跟随属于交互式动画的一种。在里，用鼠标可以控制您想控制的任何东西。但是要使这种人为的操纵不那么生硬，就得照顾到所操纵对象的每一个细节。 　　本例将一条鱼拆分成若干节，首先从头至尾对每一节的大小和透明度作一个递减，这样，一条头粗尾细真实感很强的鱼就做出来了。在控制鱼的运动时，每一节的速度也有一个从快到慢的变化，使游动的鱼有一定的伸缩度，这样才能体现出鱼的灵活性。另一个环节是随着鼠标的运动，鱼的游动方向会产生剧烈的变化。如果不对每一节的旋转方向作一个比较精确的调整，鱼身的错位就会非常惊人。本例使用的方法是使鱼在游动时身体的每一节都旋转到前面一节在上一时刻的方向，这样鱼不再完全受鼠标的指使，而会跟随自身的角度产生渐变。另外，在做鱼鳍时让它附带一段改变透明度的渐变动画，使鱼更具真实感。 　　向场景中添加莲叶有3种方法： 　　【方法1】 　　直接将其拖到场景中，这样会使游动的鱼浮于它的上层，显然不是我们所要的效果。 　　【方法2】 　　将其拖到场景中，并用duplicateMovieClip方法调整其层级，使其浮于鱼的上层。这是本例用到的方法。 　　【方法3】 　　不将其拖到场景中，而在库中为其添加链接，使用attachMovie方法将其调用到场景中，但需要为其设置位置参数，否则它将出现在播放窗口的左上角，也就是窗口坐标中的原点位置。 　　技术要领 　　制作动画“鱼戏莲叶间”的技术要领主要在于几个ActionScript命令的应用。本例用到的ActionScript命令主要有： 　　 1． attachMovie （ idName, newName, depth ） 　　从库中取一个为动作脚本设置了链接的元件并将其附加到场景中。idName是库中要附加到舞台上的影片剪辑元件的链接名称，也就是在“链接属性”对话框中的“标识符”字段中输入的名称。newName是为使用该命令附加到场景中的影片剪辑实例指定的唯一名称。depth是一个整数，用来指定影片剪辑所放位置的深度级别，这个深度级别（level）是在动画播放时由Flash分配的，它与层（layer）的概念类似但又有所区别。每个深度级别只能容纳一个影片剪辑实例，如果为同一级别附加新的实例，旧实例将自动消失。表示深度级别的整数越大，相当于显示的层越贴近我们的视线。 [color=red'] [/url] [url=/news/news001/flash/200510/20051017075432_3.html] [/url] [url=/news/news001/flash/200510/20051017075432_5.html] [/url] [url=/news/news001/flash/200510/20051017075432_2.html] 　　鱼戏莲叶间（如图1所示）是一个将鼠标跟随效果应用得非常巧妙的例子。该动画中，一条可爱的鱼儿在莲叶间畅游。最吸引人的是，这条鱼儿会紧紧跟随着您的鼠标，并且在转身回头之间，鱼头、鱼身以及鱼尾之间的运动显得非常连贯。一般的鼠标跟随效果往往只应用了简单的跟随，实际上就是ActionScript的简单调用。本例将告诉您如何在脚本程序的基础上加入一些技巧，使做出来的效果更富情趣，更惹人眼球。本例在帧上下的功夫并不多，关键的地方在影片剪辑元件的调用和安排上。学完本实例，不但可以掌握如何制作鼠标跟随效果，而且对动画创作的技巧会有一个新的认识。

登录/注册后可看大图

图1　“鱼戏莲叶间”效果图 : 软件知识点 : 影片剪辑元件的链接 : attachMovie 语句 : with 语句 : duplicateMovieClip 语句 : startDrag 语句 　　　 　　实例分析 　　在制作“鱼戏莲叶间”之前，让我们来对实例进行一些分析，以便理清思路，对全局有一个系统的把握。 　　制作特点 　　本任务主要有以下特点： 　　（1）要做的鱼其实只有鱼头、带鳍的鱼身和不再鳍的鱼身3个元件，整条鱼是通过脚本程序组合起来的。在鱼和莲叶的布置上都要用到深度级别（level）的概念。 　　（2）鼠标跟随效果实际上是使对象位置随鼠标的运动而不断变化，这样的效果很容易就做出来了。但是要将鼠标跟随效果做到出神入化，往往需要进行一些技巧性的计算。本例的技巧重点在于对鱼的各部分的运动速度和方向的控制。 　　创意分析 　　鼠标跟随属于交互式动画的一种。在里，用鼠标可以控制您想控制的任何东西。但是要使这种人为的操纵不那么生硬，就得照顾到所操纵对象的每一个细节。 　　本例将一条鱼拆分成若干节，首先从头至尾对每一节的大小和透明度作一个递减，这样，一条头粗尾细真实感很强的鱼就做出来了。在控制鱼的运动时，每一节的速度也有一个从快到慢的变化，使游动的鱼有一定的伸缩度，这样才能体现出鱼的灵活性。另一个环节是随着鼠标的运动，鱼的游动方向会产生剧烈的变化。如果不对每一节的旋转方向作一个比较精确的调整，鱼身的错位就会非常惊人。本例使用的方法是使鱼在游动时身体的每一节都旋转到前面一节在上一时刻的方向，这样鱼不再完全受鼠标的指使，而会跟随自身的角度产生渐变。另外，在做鱼鳍时让它附带一段改变透明度的渐变动画，使鱼更具真实感。 　　向场景中添加莲叶有3种方法： 　　【方法1】 　　直接将其拖到场景中，这样会使游动的鱼浮于它的上层，显然不是我们所要的效果。 　　【方法2】 　　将其拖到场景中，并用duplicateMovieClip方法调整其层级，使其浮于鱼的上层。这是本例用到的方法。 　　【方法3】 　　不将其拖到场景中，而在库中为其添加链接，使用attachMovie方法将其调用到场景中，但需要为其设置位置参数，否则它将出现在播放窗口的左上角，也就是窗口坐标中的原点位置。 　　技术要领 　　制作动画“鱼戏莲叶间”的技术要领主要在于几个ActionScript命令的应用。本例用到的ActionScript命令主要有： 　　 1． attachMovie （ idName, newName, depth ） 　　从库中取一个为动作脚本设置了链接的元件并将其附加到场景中。idName是库中要附加到舞台上的影片剪辑元件的链接名称，也就是在“链接属性”对话框中的“标识符”字段中输入的名称。newName是为使用该命令附加到场景中的影片剪辑实例指定的唯一名称。depth是一个整数，用来指定影片剪辑所放位置的深度级别，这个深度级别（level）是在动画播放时由Flash分配的，它与层（layer）的概念类似但又有所区别。每个深度级别只能容纳一个影片剪辑实例，如果为同一级别附加新的实例，旧实例将自动消失。表示深度级别的整数越大，相当于显示的层越贴近我们的视线。 [color=red'] [/url] [url=/news/news001/flash/200510/20051017075432_3.html] [/url] [url=/news/news001/flash/200510/20051017075432_5.html] [/url] [url=/news/news001/flash/200510/20051017075432_2.html]