FLASHMX动画制作实例教材

第1页共103页FLASH动画制作实例教材一、熟悉Flash界面二、动画的原理看下面几幅画面:图2-2图2-3图2-4图2-5图2-2中飞机位于图片的最左边，图2-3中飞机位于图片的中间，图2-4中飞机位于图片的最右边。当我们将这三幅画面依次按照一定速度播放的时候，给我们的视觉效果就是看上去感觉飞机在从左向右飞行，如图2-5所示。动画就是由一系列近似的画面按照一定的顺序和速度进行播放而产生，它是欺骗人视觉效果的一种把戏。三、帧/关键帧/空白关键帧由动画的原理我们知道，动画就是画面的连续播放所产生的，电影是每秒播放24幅画面，电视则每秒播放25幅画面，Flash默认每秒播放12幅画面（可以修改）。每一幅画面我们都称它为一个帧，记住：一个帧就是一幅画面（暂不管这个画面是真实的还是虚幻的）！第2页共103页如图2-6所示上面的每个小格子就是一个帧，每个格子都分别代表着一幅画面，播放时按照帧的先后顺序由左向右进行。你也许会问：“上面帧怎么还不一样啊？”对了，正是因为它们不一样才有了帧、关键帧、空白关键帧（也叫白色关键帧）这些名词。空白关键帧我们先看第一个小格子，它里面有一个白色的小圆圈，它就是空白关键帧，里面什么内容都没有，一片空白。用鼠标单击一下该空白关键帧，结果我们在下面的场景里看到的是一片空白区域如图2-7所示：关键帧第二个小格子里面是个实心的小黑点，它就是关键帧，里面有实际存在的内容，用鼠标单击该关键帧（或用鼠标按住帧上面红色滑块向后拖动到该帧），我们看到了一个黑色的圆，如图2-8所示：第3页共103页看来，关键帧和空白关键帧的区别就在于关键帧有实际的内容而空白关键帧没有。空白关键帧+内容（比如画个圆）=关键帧。可变形为：空白关键帧=关键帧-里面所有内容。读者不妨把图2-8中的圆删除（Ctrl+A，Delet），看它是不是变成了和它前面一样的空白关键帧？帧关键帧后面的灰色部分都是普通帧，普通帧里面没有实际的内容，但是它却能将离它最近的关键帧的内容显示出来。用鼠标点击第三帧，如图2-9所示。看起来它似乎有内容，实际上这一帧是没有内容的，3、4、5帧只不过是把前面离它最近的关键帧（第二帧）的内容显示出来了而已，由此可见普通帧尽管没有实际内容但它却可以用来延续一幅画面的存在时间。说明：图2-9的第五帧代表普通帧的结束，另外还有一种叫过渡帧，暂时不用知道，后面会结合具体实例讲。这几个概念在Flash制作中非常重要，使用的频率也最高，希望读者一定要弄明白。移除帧与清除帧的区别：用鼠标对着帧点击鼠标右键，在弹出的菜单中有“移除帧”和“清除帧”命令。移除帧就是删除帧，用来将帧连同帧上的内容（如果是关键帧的第4页共103页话）一起删除，而清除帧则是只把帧上的内容清空，帧仍然存在。图形元件和移动渐变按照正常习惯，此时应该讲工具的使用了，但是考虑到读者刚刚理解完上面关于帧的一些枯燥的概念，我讲顺序做了调整。下面我们就放松一下来做一个小动画。一、制作矩形的变化启动Flash软件，鼠标单击第一帧，然后点击左边工具箱中的矩形工具，边框选择没有颜色如图2-6所示，填充选择自己所喜欢的颜色如图2-7所示。在工作区按住鼠标左键拖动绘制矩形，如图3-8所示。我们用选取工具单击一下矩形，执行【插入】菜单下的【转换成元件】命令，将弹出一对话框，在名称中输入“动作渐变”，选择【图形】如图3-9所示。然后确定。此时画面应为图3-10所示。第5页共103页鼠标放在25帧处，点击右键，在弹出的菜单中选择“插入关键帧”，如图3-11。用鼠标单击缩放工具，将矩形调小，如图3-12所示。鼠标点击1到25之间的任何一帧（不能是最后一帧，所以25除外），然后选择下面的“移动”，如图3-13。第6页共103页到此为止一个简单的动画就做成了，按Ctrl+回车进行预览。源文件的位置：光盘\源文件\移动渐变演示.fla说明：1）图3-11中，在25帧处插入关键帧的意思是复制了前面和它最近的关键帧（此处为第1帧），所以此时第25帧和第1帧完全一样：是关键帧，里面都右一个矩形，连同矩形的大小位置等都一样。2）图3-13中，2到24帧像普通帧一样看似有内容，其实没有，它们是从第1帧到25帧的一个过渡，所以叫做过渡帧。3）以前每次讲这个例子的时候，学生总会问：“图3-10为什么要转换成图形元件？”这个问题后面会讲到，暂时只需要记住当转换成图形元件后，下面要选择“移动”，就可以了。4）在绘制矩形时我们选择边框为无色，这并不是说一定不能要边框，因为一旦要了边框在将矩形转换成图形元件的时候就必须把它和它的边框一起转换，而初学者一般都容易把边框给漏掉。所以，如果要了边框，边框和填充都必须都要选中后再一起转换为图形元件，具体做法是选择箭头工具用鼠标点击一下填充部分，然后按住Shift键不放双击边框即可（按住Shift代表可以选择多个，双击边框表示把边框给选中）。读者可以试试有边框的情况。5）变化的快慢可以控制，Flash默认为每秒播放12帧，所以可以计算出应该在什么地方插入关键帧。如果你做成功的话，相信你对Flash已经有了一定的兴趣，如果你觉得上述例子太麻烦而没有做成功的话，也不要紧，因为我们还没有讲工具的使用，下面我们举个更简单的来加以巩固。第7页共103页二、制作照片的出现效果1．启动Flash软件，打开【文件】下拉菜单，选择【导入】命令，在弹出的对话框中选择你的一张照片，如图3-14所示。2．用选取工具单击图片，然后按F8，出现了图3-15所示的对话框。然后单击确定按钮。如图3-16所示。将鼠标放在20帧处，点击鼠标右键，选择【插入关键帧】命令，将出现图3-17。第8页共103页用鼠标单击第1帧，然后单击按钮，图片周围出现8个控制点，我们用鼠标拖动右下角的控制点，将图片缩小。如图3-18所示。用鼠标点第1帧，在下面属性栏选择移动，如图3-19所示。第9页共103页此时就可以Ctrl+回车进行预览了。我们看到了一张图片由小变大的效果，下面我们接着做让这张照片变大之后再渐渐向右上角消失的效果。在40帧处插入关键帧，移动图片到右上角，如图3-20所示。用鼠标选中图片，在属性栏调整透明度，如图3-21所示。用鼠标点击20到40之间任何一帧，选择属性栏上面的移动，其结果如图3-22所示。第10页共103页好了，此时再按Ctrl+回车试试。源文件的位置：光盘\源文件\我的照片.fla通过以上两个例子，我们已经感觉到Flash功能的强大，只需要给一个起始状态和一个结束状态，中间的那些状态都交给Flash去做。工具简介1、箭头工具箭头工具主要用来选取对象，以便对该对象进行操作如：删除，移动等。如图4-1，鼠标单击选择该对象后，可用Delet删除，图4-2用鼠标按住不松开，然后拖动到所需要的位置。第11页共103页另外它还具有切割和变形的功能。当我们用工具箱中的工具绘制出圆、矩形、线条等形状时，用鼠标可以将他们切割。按住鼠标拖动，将不需要的部分选中，如图4-3所示。当鼠标接近我们绘制的图形时，会出现图4-4，这时可按住鼠标拖动来改变它的外形，如图4-5所示。重新绘制一个矩形，当按住Ctrl键拖看有什么变化，撤消（Ctrl+Z）后再次按住Ctrl键拖看又有什么不同，请读者朋友试一试。2、次选取工具它用来修改由铅笔或钢笔所绘制的线条。当用次工具选取所绘曲线时上面会出现一些节点，如图4-6所示，当鼠标点击节点时，节点上会有控制柄出现，如图4-7，拖动控制柄上的点便可修改线条的形状。3、直线工具使用直线工具用来绘制从起点到终点的直线，在按下鼠标左键进行拖动时如果按住了Shift键，则可绘制水平、垂直或以45度角度增加的直线。4、套索工具套索工具用来选取不规则的区域以便对所选部分进行操作，如图4-8所示。5、钢笔工具选取钢笔工具，用鼠标左键单击起点，然后移动到下一个位置，按住鼠标左键不放拖出所需的线条，然后再用同样的办法绘出到下一点的线条，双击鼠标代表绘制结束。如果绘制不满意，可用次选工具进行调整。如图4-9所示。第12页共103页6、文本工具文本工具是用来输入文字信息。选择文本工具，再工作区按住鼠标拖出文本框，输入文字，如图4-10所示。7、椭圆工具用来绘制椭圆，在绘制过程中按住Shift键可绘制正圆，如图4-11所示。8、矩形工具用来绘制矩形，同椭圆工具一样在绘制过程中按住Shift键可绘制正方形。9、铅笔工具它可以绘制任何形状的曲线，点击铅笔工具后，在工具箱下面有个图标，单击后可选择“平滑”绘出的线条比较平滑。按住Shift键可绘制水平方向或垂直方向的直线。10、画笔工具画笔工具也叫刷子工具，由此可见它用来“刷”一些具有刷子效果的曲线，如图4-11。工具箱下面可以调整刷子的大小和形状。11、缩放工具顾名思义，缩放工具用来改变对象的大小情况，包括长、宽、旋转、倾斜等。下图中的小白点代表旋转的中心点，用鼠标可以改变其位置。第13页共103页图4-12改变长图4-13改变宽图4-14旋转图4-15倾斜12、填充变形工具该工具用来对填充的方式进行调整，如图4-16所示。对该图中的改变填充的控制点进行调整，分别得到了图4-17、图4-18、图4-19。13、墨水瓶工具给已绘制好的几何图形添加边框或修改已有边框的颜色、粗细等属性。14、颜料桶工具颜料桶工具也叫油漆桶工具，用来对封闭图形的内部进行填充或修改。15、点滴器使用滴管工具可以从场景中选择线条、文本和填充的样式，然后创建或修改相应的对象。从场景中导入一张图片，执行【修改】下的【分解组件】命令将图片打散。此时用点滴器工具点击一下该照片，然后用椭圆工具去画椭圆我们发现我们导入的图片作为了椭圆的填充，如图4-20所示。第14页共103页用填充变形工具进行修改，如图4-21所示。源文件的位置：光盘\源文件\填充演示.fla说明：导入的图片只有打散才可以使用点滴器工具。16、橡皮擦使用橡皮擦工具可以擦除当前场景中的对象，当选择橡皮擦后，工具箱下面还有擦除模式，各擦除模式效果如图4-22所示。水龙头是用来擦除整块颜色的。17、手形工具手形工具可以将文档窗口中的场景连同对象一起移动。选择手形工具，在场景中按住鼠标左键拖动看有什么变化。18、放大镜选择放大镜工具，用鼠标在场景中点击左键，发现场景以及里面的对象放大了，如果想缩小，按住Alt键的同时单击鼠标左键。按住鼠标左键拖动将需要放大的部分匡住，然后松开鼠标即可。19、笔触色按钮笔触色按钮用来改变线条或所绘几何图形边框的颜色。20、填充色按钮用来改变填充的颜色。形状渐变在第三章学习了图形元件，知道了图形元件需要用动作渐变，那么如果不转换成图形元件又是什么情况呢？启动Flash软件，用矩形工具在场景中绘制一矩形，如图5-1所示。第15页共103页然后在25帧的地方鼠标右键插入关键帧，用缩放工具调整矩形的大小，如图5-2所示。鼠标单击1到25之间单击任何一帧，在属性栏选择“形状”（因为该矩形没有转换成图形元件，所以它还是形状），如图5-3所示。第16页共103页按Ctrl+回车进行预览。源文件的位置：光盘\源文件\形状渐变演示一.fla结果看到和将矩形转换成图形元件一样的效果，既然如此，那么转不转换成图形元件到底有什么区别呢？转换成图形元件需要用“移动”来创建动画的过渡，而所绘制的形状在不转换成图形元件的情况下，需要用“形状”来创建动画的过渡，二者不可换用。如果将图5-3的“形状”改为移动，1到25帧之间出现了虚线，这说明问题出现了，如图5-4所示。图形元件可以改变其透明度（应该是叫不透明度），所绘形状则不能。图形元件在场景中不能改变其外形，只能在编辑改图形元件时才可以，而所绘形状可以方便地改变其外形。为了更好的理解这一点，读者用鼠标将图5-2中第25帧这一帧里面矩形的形状调整一下如图5-5所示。甚至可以将这一帧的内容删除重新绘制新的形状，读者不妨试一试。而这些是图形元件无法办到的。源文件的位置：光盘\源文件\形状渐变演示二.fla下面我们利用形状渐变来制作一个弹跳的小球。启动Flash软件，选择椭圆工具，不要边框，填充方式为