flash教案flash入门动画

FLASH入门动画（一）教学目标：①知道FLASH软件界面及简单操作；②会使用元件、时间轴等；=3\*GB3③会完成flash的第一个动画——运动的小球。工作任务：任务一：运动的小球制作（一）实践操作：展示效果图：（这就是我们要做的第一个Flash作品。可别看它简单，以后我们要制作千变万化的Flash电影，很多都会用到它所包含的技术呢。好吧，不多说了，我们开始吧。）运行Flash4，这时系统已经打开了一个新文件。选菜单中的Modify->Movie...(或按Ctrl-M)修改当前舞台的属性。我们可以修改播放速度(FrameRate)，舞台尺寸(Dimensions)，是否显示网格(Showgrid)，网格点间距(Grid)，网格色和背景色(Colors)以及选用何种度量单位(Ruler)等。我们将参数设置为左图所示，在以蓝色背景，长300点，宽50点的舞台上制作动画。一般来说，在互联网上播出的动画，每秒8－12帧的播放速度比较合适一些。

工作环境设置好以后，我们首先需要创建一个图符(Symbol)，以便调用。按Ctrl-F8键进入建立图符的选项窗口，给图符起名叫ball，确定是图形类(Graphics)后按确定按钮。现在我们就进入了创建图符的编辑状态。在绘图工具栏中选椭圆工具。并将其下的参数设置为左图所示。我们已经在上一章中详细介绍过有关参数的设置问题，这里就不再多说了。图中的参数显示我们将要绘制一个没有轮廓线，且填充色为桔黄渐近色的球形。桔黄渐近色不是系统自带的颜色，不过我们可以按照上一章中第七节所述方法新建这一颜色。在工作区里用鼠标绘制一个小球。如果对所画的小球不满意，可以点选小球，按Delete键删掉重画，也可以在小球上按鼠标右键，在弹出的菜单中选择相应修改工具进行修改。小球图符做好后，点击时间轴(Timeline)左上角的或右上角的回到主场景。按Ctrl-L打开图库，发现里面已经有一个做好了的名为ball的图符。在预览窗口中把该图符拖动到工作区中如下左图所示的位置。你也可以通过菜单中View->Rulers(或按Ctrl+Alt+Shift-R)打开系统标尺精确定位。我们同时还注意到时间轴的第1帧上的小圆圈已经由空心变成了实心，表明该帧不再为空。在时间轴第25帧点一下鼠标左键，该帧变蓝表示被选。按Ctrl-F6键插入一个关键帧，点选小球，把它拖到舞台的另一端，如上右图所示。双击时间轴上的第1帧，弹出该帧的帧属性对话框，如下图所示。点击渐变(Tweening)标签，在其下的Tweening下拉菜单中选运动(Motion)，按确定按钮。注意：对于实例来说，只能进行运动渐变动画(MotionTweening)，不能作形体渐变动画(ShapeTweening)。而对于形体(Shape)来说，只能作形体渐变。这时时间轴窗口的状态如下图所示，第1帧和第25帧之间出现了一个实线箭头，且背景变成淡紫色，表示这两帧之间有一段运动渐变动画。如果两帧之间出现了虚线，表示过渡不成功，需要重新查看每一个关键帧及其属性。下面我们来看一看效果：选菜单项Window->Controller，打开控制面板，按播放钮播放动画，或者按下Ctrl-Enter另开窗口，以全屏预览动画，可以看到小球从舞台的左端匀速移动到右端，和本页中的效果一样，只不过本站网页的背景色与Flash电影工作环境的背景色相同，所以看不出来罢了。问题探究：做好了动画不要忘记存盘，按Ctrl+S，在弹出的对话框中输入存档文件名，确定，这时系统会把源文件用.fla格式存档。如果这时在Flash中再次按下Ctrl-Enter键，则系统会自动生成.swf的电影文件，可以用Flash电影播放器直接观看。好了，这一节我们已经学会做一个最简单也最重要的动画了，好的开端是成功的一半，我们慢慢会对Flash的强大功能体会更多的。下一节我们将对小球动画作继续深入的探讨。知识拓展:我们将在运动的小球的基础上进一步加深对运动变形动画的认识。（本节中的几个动画基本上和上一节是相同的，只不过我们对实例的属性，运动路径等适当做些变化，以便获取不同的效果。看出上面的动画和上一节有什么不同吗？是的，在小球运动的过程中渐渐消失在了背景中。其实这个效果实现起来是非常容易的。运动的制作和上一节一样。点击第25帧使处在舞台最右端的小球被选中，用鼠标左键双击小球，弹出实例属性对话框，选择颜色效果(ColorEffect)标签，如下图所示。在颜色(color)下拉菜单选项中选中透明度(Alpha)，在透明度输入框中输入百分值0，或将其右边的滑杆指针拖到最左端，使小球完全透明。点击OK确定。现在看一下效果，按Ctrl-Enter看到如上面所示结果。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：在作业一基础上进行修改、更新。（要求：用不同方向，不同球体等）上机作业三：（选做提高题）根据所学自由创作一作品。教学反思：FLASH入门动画（二）教学目标：①进一步巩固使用元件、时间轴等；②会使用运动渐变动画、图层、引导线等操作=3\*GB3③会完成flash的第二个任务——运动的小球（二）。工作任务：任务二：运动的小球制作（二）实践操作：展示效果图：上一节的小球在运动的过程中大小发生了变化。要实现这一点，我们还是在上一节做好的动画的基础上进行修改。在第13帧按F6插入一个关键帧，如下图所示。双击此关键帧发现渐变(Tweening)标签下的渐变选项已经自动设定为运动(Motion)，点取消(Cancel)。用鼠标右键点击此帧下的小球，在弹出的菜单中选择放缩(Scale)，将小球缩小到一定程度就可以了。用Ctrl-Enter查看结果同上。因为运动导向层是一个单独的层，我们将在这个层上绘制小球将要走过的路径，所以这一节起我们开始接触多个图层的操作。建立导向层有多种方法，一种是点击时间轴窗口左下角，在当前层上新建一个层。在该层上点鼠标右键，在弹出的菜单中选择导向(Guide)，使其前面出现对号，这时从该层左边的符号看出它已经成为导向层。这时，按住Alt键，用鼠标左键点击小球所在图层，使小球层与其上的导向层发生关联，我们看到小球层向右缩进，表示二者已产生关联。还有一种建立导向层的方法是用鼠标右键点击小球所在层的名称，在弹出的菜单中选择增加运动导向(AddMotionGuide)，在小球图层上出现新的导向层，小球图层缩进显示二者关联。这时的时间轴显示应如下图所示。下面我们就在导向层中绘制一条路径。为了避免对小球所在层进行误操作，点击小球所在层上所对应的黑点，使该层被锁定，不能被编辑。点击导向层第1帧，在绘图工具栏选择铅笔工具，将其下方参数修改器中的铅笔模式按钮变为，颜色选黄色，也可以选其它颜色，因为导向层在动画播放中不被显示。然后在工作区画一条如下图所示的线。上面这条就是小球将要沿着运动的路径。现在解除小球所在层的锁定，恢复该层的可编辑状态。在绘图工具栏中选箭头工具，将其下方参数修改器的捕捉(Snap)按钮选定为状态。点击小球所在层的第1帧，点住小球中心附近将其拖动到路径最左端，小球中心出现小圆圈，当小球接近路径端点时，中心点自动捕捉到该端点，如下图所示，这样我们就把小球放在了路径的起始位置。同样，我们再点击小球所在层的第25帧，将小球中心放置在路径的另一端。现在，我们就完成了所有的工作。用Ctrl-Enter看一下效果，是不是很不错？问题探究：我们如何将本节所学的各种效果综合起来使用，例如让物体沿指定路径运动的同时发生缩放，旋转及透明度上的变化等。下面，我们还将通过小球的运动进一步了解如何设置一些重要参数，以获得一些特殊效果知识拓展:前面我们通过小球的运动介绍了Flash中最基本的动画－－运动渐变动画，这一节我们仍将继续深入学习这种方式的动画。首先我们一起来看一看上面的例子是怎么做出来的。这是一个跳动的球。我们先试着用前两节中讲过的方法做一下。首先选好舞台的大小，颜色等，在舞台上用桔黄梯度色画一个大小适中的圆球形。（注意现在的这个圆球形是形体而不是实例，你可以对它进行重新填色，甚至可以用箭头工具选择其中一部分区域进行操作，而实例则作为一个整体出现，你只能对它做整体操作。这一点我们在上一章已经讲过。）我们需要把它做成一个图符，以方便我们调用。选中这个圆球形，按F8键把它转换成图符，在弹出的窗口中给这个图符起名为ball，并确认是图形类图符，按回车确定。这时圆球形外面出现一个方框，如右图所示，表示小球已经成为一个实例。现在小球位于时间轴的第1帧上，我们把小球拖动到舞台的最上端，然后在时间轴第18帧上按F6键插入一个关键帧，把实例小球从最上端拖动到最下端，然后再在第36帧处按F6插入一关键帧，为了使小球在这一帧能回到原位，我们可以把第1帧的内容复制到这一帧。在第1帧上点鼠标右键，在弹出的菜单中选CopyFrames，或按快捷键Ctrl+Alt-C，复制第1帧，然后同样在第36帧处点鼠标右键，选PasteFrames，或按快捷键Ctrl+Alt-P，将第1帧的内容粘帖到这一帧上。可以看到在这一帧，小球又回到了起始位置。时间轴的状态应如下图所示。现在我们来看一下效果，如左图所示。怎么好象和上面的结果不一样，似乎看不出那种重力作用的感觉，看来我们还有点工作没有做完。双击时间轴第1帧，弹出帧属性对话框，选择渐变(Tweening)标签，在其下的选项中将Easing所对应的指针拖动到最左端，或在右边的输入框中输入-100，如右图所示，确定。然后，在第18帧双击，把Easing所对应的指针拖动到最右端，或在右边的输入框中输入100。然后，我们再来看一下效果，按Ctrl-Enter全屏观看，是不是和我们需要的效果一样了？现在大家应该知道Easing选项的作用了吧。它的作用是在运动的过程中产生速度上的变化，默认值为0，即为匀速运动。当Easing所对应的指针向左边移动时，也就是Easing值为负时，运动的物体做加速运动，相反，当Easing所对应的指针向右边移动时，也就是Easing值为正时，运动的物体做减速运动。当Easing值的绝对值越大时，物体运动的加速度越大，物体运动时速度变化也就越快。在小球下落的过程中，速度越来越快，所以我们把Easing的值改为负值，注意在Easing值为-100时，比较接近重力加速度。当小球弹起时，速度越来越慢，因此Easing值为正。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：在作业一基础上进行修改、更新。（要求：用不同引导线，不同运动方向速度、不同球体等）上机作业三：（选做提高题）根据所学自由创作一作品。。教学反思：FLASH入门动画（三）教学目标：①进一步巩固使用元件、时间轴、图层、引导线等；②会使用复杂运动渐变动画等操作=3\*GB3③会完成flash的第三个任务——物理实验小球撞击。工作任务：任务三：物理实验小球撞击实践操作：展示效果图：下面我们做一个简单的物理实验的模拟。如上面所示，桔黄色的小球从空中落下，落地瞬间与地上静止的绿色小球发生碰撞，两球均沿不同轨迹飞出界面。以我们刚才做好的动画为基础，在时间轴窗口新增加一个层，命名为GreenBall，注意该层上有铅笔标志，表示正在编辑该层。我们用椭圆工具选绿色梯度色绘制一个大小和桔黄色小球差不多的小球，并把它移动到桔黄色小球下方偏右一点，以便桔黄色小球落地时正好与它接触。在第18帧上按F6新建关键帧，因为这时是与落地的桔黄色小球碰撞产生运动的起始位置。在第36帧再按F6增加一个关键帧，并把绿色小球横向右移出画面。为了让绿色小球动起来，我们在第18帧双击，在弹出的帧属性对话框中渐变标签下，选Tweening为Motion。确定后第18帧到第36帧之间会有一个实箭头。这样，绿色小球的动画部分就做好了。下面我们设法让桔黄色的小球在与绿色小球碰撞后沿指定的路线飞出画面。用鼠标右键在时间轴窗口，桔黄色小球所在层点一下，在弹出的菜单中选Addmotionguide，新增一个导向层。这时导向层成为当前正在编辑的层。我们在导向层上画一条路径。画好的结果应如左图所示。绘制这条路径的方法有很多，一种方法是，可以用铅笔工具或直线工具画路径的直线部分，然后用椭圆工具画不填充的椭圆，用箭头工具取其中一段作为路径的曲线部分。路径画好后，用鼠标左键双击桔黄色小球所在层的第1帧，在弹出的帧属性对话框中渐变(Tweening)标签下在捕捉到路径(Snaptoguide)前的复选框中点一下使其被选中，确定。同样对第18帧进行相同的操作。回到第1帧，选择箭头工具(注意箭头工具的参数修改器中捕捉按钮应处于按下状态)，用鼠标左键点击桔黄色小球中心附近并把它拖动到路径直线的最上端，见左图。在接近端点时，小球中心会自动吸附在端点上。在第18帧，把桔黄色小球拖动到路径直线的下端，在第36帧，拖动到曲线的末端。做好后，时间轴窗口的设置应如下图所示，绿色小球所在层位于桔黄色小球所在层上面还是下面无关紧要。我们用Ctrl-Enter来查看一下效果，如果发现桔黄色小球并没有沿指定路线移动，表明关键帧中小球的位置不对，未能真正处于路径的端点，试着调整有问题部分的关键帧中桔黄色小球的位置。一次不行，多调整几个就行了。现在我们就可以欣赏这一段稍微复杂点的动画了。是不是很有点成就感？下一节中我们将从另一个方面讲解运动渐变动画的用法。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：在作业一基础上进行修改、更新。（要求：用不同引导线，不同运动方向速度、不同球体等）上机作业三：（选做提高题）根据所学自由创作一作品。教学反思：FLASH入门动画（四）教学目标：①进一步巩固使用元件、时间轴、图层、引导线等；②会使用复杂运动渐变动画中旋转运动等操作=3\*GB3③会完成flash的第四个任务——旋转的风车工作任务：任务四：旋转的风车实践操作：展示效果图：这一节我们来制作一个旋转的风车，从制作中我们不仅要学习运动渐变动画的另一种形式：旋转动画，而且还要练习用箭头工具对对象进行修改的方法。首先要打开一个新文件。现在我们先来画风车的一个叶片。选择绘图工具栏中的矩形工具，把边线屏蔽掉，填充色选黄色，在工作区中间画出一个矩形如下图一所示。选箭头工具，将矩形左上角的顶点向右拖动直到与右上角的顶点重合，如图二所示。下面我们将对三角形作进一步的加工。用鼠标分别点住三角形的两条直角边拖出一个弧形，调整使弧形连续，如图三所示。然后再对三角形的斜边加工，使它也呈现一定的弧形，如图四所示。选中叶片，按F8将其转换为图符，在弹出的图符属性框中将叶片命名为yepian，确定是图形类图符后回车。这时叶片就变成了实例。按Ctrl-L打开图库窗口，为了使叶片旋转时不致发生偏离的情况，我们需要把叶片调整到合适的位置，双击图库窗口中预览窗口的叶片，进入图符编辑状态，如图五所示，把叶片移动到图示位置，使其尖端指向十字定位中心。现在我们就做好了一个叶片了。

图一图二图三图四图五然后，我们要利用这个叶片做出风车其余的叶片。选Flash菜单项Window->Inspectors->Transform，打开变形监控面板，如左图所示。监控面板可以帮助我们精确地定义对象以及精确地旋转放缩对象。选中已经做好的叶片，按Ctrl-C复制，再按Ctrl+Shift-V将叶片复制在原来的位置上。在变形监控面板上的旋转(Rotate)项下输入45，表示将复制的叶片顺时针旋转45度。点应用(Apply)，发现新的叶片出现在原有叶片顺时针45度位置，如下左图所示。用同样的方法再复制出6个叶片，组成八个叶片的风车。注意，复制其他叶片时，每按一个Ctrl+Shift-V后将变形监控面板中的旋转角度值多加45度。现在我们用鼠标拉出一个大框把这八个叶片全部套住，再按F8键把这八个叶片转换成一个图符，起名叫fengche。可以看到，现在八个叶片成了一个整体，其中心为十字定位符，见下图右。风车已经做好了，我们现在该让它动起来了。在第30帧按F6插入一个关键帧。双击第1帧弹出帧属性对话框，在渐变标签下Tweening选择项目中选Motion作运动渐变动画。在旋转(Rotate)项目中选择顺时针(Clockwise)，并将随后的旋转圈数设为1。这样，风车将在第1帧到第30帧之间顺时针旋转1圈。现在按Ctrl-Enter来看一看效果吧，怎么样，还不错吧。知识拓展:现在我们对已经做好的风车动画做一个加工，以便生成如上图所示的效果。在第60帧处按F6插入一关键帧，在第30帧双击鼠标左键，在弹出的帧属性对话框中渐变标签下，将Tweening设置为Motion，并将Rotate设为Clockwise，其后的次数栏中填1次。该帧属性同第1帧，如上图帧属性对话框面板所示。现在风车将在第1到60帧的时间里顺时针旋转2圈。下面我们对第30帧做一些修改。选择时间轴上第30帧，用鼠标右键点击风车实例，在弹出的菜单中选择Scale，将风车缩小一些。随后，双击该风车实例，进入实例属性面板，在ColorEffect标签下Color选项中选Tint，设置如下图所示。这样我们就把大小的颜色变化设置完成了，最后的结果就如上图所示。大家也可以想些别的花样来做一做，这样可以尽快地熟练掌握运动渐变动画的实现过程。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：在作业一基础上进行修改、更新。（要求：用不同引导线，不同旋转运动方向速度，不同形状叶片等）上机作业三：（选做提高题）根据所学自由创作一作品,如地球的旋转等。教学反思：FLASH入门动画（五）教学目标：①进一步巩固使用元件、时间轴、图层、引导线等；②会懂得运动渐变动画和形体渐变动画的区别,会使用形体渐变动画的操作技巧=3\*GB3③会完成flash的第五个任务——延伸的直线。工作任务：第五节延伸的直线实践操作：展示效果图：这一节我们将来学习渐变动画的另一种形式，即形体渐变(Shapetweening)动画。我们先来学习做上面这个直线伸长的简单动画，之后我们稍加变化，做一个更有趣的直线伸长动画。用Flash新建一个文件，按Ctrl-M对电影的属性作一个调整，将其设置为狭长的矩形(如宽Width设为400，高Height设为50)，将背景色设为蓝色。用铅笔工具或直线工具画一条横向的短线，长度如右图所示：。注意要画一条笔直的横线，可以按住Shift键，再用铅笔工具或直线工具横向拖动鼠标即可，因为按住Shift键以后，线条只能沿水平，竖直及45度角方向变化。然后我们在第40帧上按F6插入一关键帧，或按F7插入一空帧(当在这一帧上绘制图形后，该帧会成为关键帧)。确定这一帧为当前帧，我们将在这一帧上绘制一条更长的直线，有两种方法可以实现这一点。一种是按下F7插入空帧后，点击时间轴窗口下方洋葱皮按钮的左边第一个，即。这时我们发现第1帧的短横线以灰色显示出来。我们就以它为基准，用铅笔工具绘制一条长直线，直线左端与短横线左端对齐。另一种方法要简单一些，在第40帧按下F6插入一关键帧后，第40帧会具有和第1帧相同的内容，即一条短横线，我们只需要对它加一下工就可以了。选中绘图工具栏中的箭头工具，移动鼠标到短横线的右端，鼠标形状如右图：。点住鼠标左键并向右拖动，直到直线足够长为止。选用这两种方法之一做好第40帧的直线。下面我们就要设置帧属性让直线动起来。用鼠标左键双击时间轴上的第1帧，在弹出的帧属性对话框中选渐变(Tweening)标签。对其下的Tweening选项进行设置，选择Shape如下图所示，回车确定。这时在第1帧和第40帧之间出现一个实箭头，背景变为淡绿色，表明是形体渐变动画。按Ctrl-Enter看一下效果，应该和上面所示一样的。知识拓展:现在我们来变个花样，做一个环绕矩形四条边伸长的直线。大家能猜一猜这个动画是怎么做的吗？其实有了本节开头直线伸长动画的基础，这个动画一点也不难做。我们对刚刚做好的直线伸长的动画加一加工。首先按Ctrl-M对电影属性作一个调整，将其高度(Height)设置为150。为了缩短动画时间，我们按下Ctrl键把鼠标移到第40帧上，发现鼠标这时变成黑色，如右图所示：。把第40帧向左拖动到第20帧位置松开鼠标，这时动画时间缩短了一半，发现直线延伸变快了。点时间轴窗口下的新建一个层，在新层的第21帧按F6插入一个关键帧。按下洋葱皮按钮，这时原先层上的直线用灰色显示出来：。我们从这条线的最右端开始向下画一条短竖线：。在新层的第30帧按F6插入一个关键帧，该帧具有和第21帧相同的内容。用上面讲过的方法把这一帧的竖线拉长到合适的长度，同上面动画中的竖线长度差不多。然后，双击第21帧弹出帧属性对话框，按刚才讲过的方法把Tweening设置为形体渐变动画。按Ctrl-Enter看一下效果，应如下图所示：我们发现这并不是我们想得到的结果，我们希望直线不断延伸，而不是分段延伸。得到这个显示结果是因为横向直线延伸的动画在第20帧以后就终止了，在第21帧到第30帧之间，也就是竖线延伸时横向直线层上没有内容。为了弥补这一点，我们在横向直线延伸动画所在层的第30帧上按下F5键，使该层在第21帧到第30帧之间仍保留第20帧，也就是最近的一个关键帧上的内容，这样在第21帧到第30帧之间，横向的直线将一直被显示出来。再按Ctrl-Enter看一下效果，发现直线先是横向延伸，到了右端顶点后转为竖向延伸，这才是我们需要的结果。现在再做其它两条边的直线延伸就变得很简单了，再新建两个层，一条边一个，方法和上面讲过的一样，我在这里就不再多说了。做好后的时间轴应如下图所示。好了，欣赏一下我们做的动画吧。体会一下运动渐变动画和形体渐变动画的区别。下一节课中我们还将继续介绍形体渐变动画其它的应用。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：在作业一基础上进行完成矩形上机作业三：（选做提高题）根据所学自由创作一作品,不同形状直线的延伸,如三角形,圆形等。教学反思：FLASH入门动画（六）教学目标：①进一步通过字符的变形动画来认识形体渐变动画的作用；②会使用不同字符形体渐变动画的操作技巧=3\*GB3③会完成flash的第六个任务——变幻的字符。工作任务：任务六：变幻的字符实践操作：展示效果图：这一节我们将通过字符的变形动画来认识形体渐变动画的作用。对于这类变形动画，只能用形体渐变来实现，用运动渐变是做不到的。首先，我们新建一个电影文件，按Ctrl-M修改电影属性，使其宽度和高度均为100，背景为蓝色。选择绘图工具栏中的文字工具，把鼠标移到电影文件中点一下，会出现一个文字输入框，选择好字体，字号，设定颜色为黄色，输入字母F，选择箭头工具，这时字母F的周围出现一个阴影方框，表示该字母已经成为一个集合体。我们在这个字母上点鼠标右键，在弹出的菜单上选放缩(Scale)，这是F周围出现放缩手柄，我们把这个字母放大到和上面动画中字母大小差不多。在时间轴的第12帧点鼠标左键，按F6插入一关键帧，这一帧的内容和第1帧一样。双击这一帧中的字母F，进行字符编辑模式，我们把字母F替换成字母L。用同样的方法，分别在第24帧，第36帧，第48帧，第60帧插入关键帧，并把相应的字母变成A，S，H，F。因为要制作的是形体渐变动画，我们首先要把已经集合了的字符打散成形体。选择第1帧，按Ctrl-B把字母F打散：。然后依次选择第12，24，36，48和60帧按Ctrl-B把字母L，A，S，H，F分别打散。现在就可以做动画了，在第1帧上双击鼠标左键，在弹出的帧属性对话框中选渐变标签，其下的Tweening选项选Shape，回车确定。然后分别对第12帧，24帧，36帧及48帧如此操作。最后的时间轴窗口应如下图所示：现在我们按Ctrl-Enter预览一下效果，应如上面的动画所示。这样的字符变形很简单，但是我们总觉得上面的这个动画中，字符变形有点没有规则，变幻得有些莫名其妙。那是因为在形体渐变动画中，如果用户没有指定变形规则的话，Flash将自动为待变形的形体设置一些关键点。形体渐变动画实际上就是关键点位置的变化，形体其余部分的变化可以通过插值的方法计算出来。在Flash中提供了一种人为干预变形效果的方法，就是设置提示点(Hints)，通过指定相应提示点间的变化方法可以指定整个形变的过程。下面我们用具体的实例来说明。以字母A变S的过程为例，因为没有设置提示点时，这个变形过程显得比较凌乱。先按Ctrl+Alt-H打开提示点的显示。选择第24帧，按Ctrl-H加入一提示点，以图一中红色的小圆圈表示，a用来标识提示点。看一看第36帧，发现字母S上也有一个对应的提示点，见图二。回到第24帧，把提示点a拖动到字母A的右下角，如图三所示，再到第36帧，把提示点a放在如图四所示位置。这时我们发现提示点变绿了，回到第24帧，这时提示点由红色变成了黄色，见图五，表明提示点的设置正确。

图一图二图三图四图五图六图七如果提示点仍是红色，说明提示点位置设置不正确，多调整几次就会好了。用同样的方法，我们可以再设置一到多个提示点，如上图六和七，我们又设置了一个提示点b，这样就可以获得比较好的变形效果。左图所示为加入与未加入提示点的字符变形对比。我们可以看出，加入了提示点后字母的变形似乎更有规则一些。知识拓展:(效果图展示)上面的这个动画实际上就是这两节中我们所学的形体渐变动画的一个综合运用，在变形的过程中还有位置和颜色的变化。也许大家一看就知道是怎么做的了，我就不再多说了，只简单提两句。在每一个关键帧上把相应的字母向右拖动一段距离，并使用油漆桶工具用不同的颜色填充就行了。大家有兴趣，可以自己动手做一做看。当然形体渐变动画不仅仅是作用于文字，所有的形体都适用。所以我们也可以把文字变形的动画扩展到几何图形的变化，例如可以把圆形变成三角形，再变成正方形等，大家可以发挥自己的想象力，多动手练一练，一定会慢慢熟练起来，并创作出很好的作品的。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：在作业一基础上进行修改，变成汉字等上机作业三：（选做提高题）根据所学自由创作一作品,我们也可以把文字变形的动画扩展到几何图形的变化，例如可以把圆形变成三角形，再变成正方形等，大家可以发挥自己的想象力。教学反思：FLASH入门动画（七）教学目标：①进一步通过文字的输入和输出实例，掌握静态、动态及输入文本的使用；②会制作简单按钮及简单脚本的编写;=3\*GB3③会完成flash的第七个任务——文字的输入与输出。工作任务：任务七：文字的输入与输出实践操作：展示效果图：这一节我们要来介绍文字的输入和输出方法，这是Flash中的一项重要功能，也是我们认识Flash交互性的基础。大家试着在上面的Flash电影下面的文本框中输入一段文字，然后回车或点“确定”按钮，看一看有什么效果。再点一点“清除”键呢？要实现文本的输入，就要用到绘图工具栏中的文字工具，我们先把输入框做好。点击工具栏中，选中文字工具，在下面的参数修改器中设置好用于输入的文字字体，字号，颜色以及对齐方式等项，不要忘记一定要点选最下面的，这个按钮用于设置文本域。在场景中下方用鼠标拉出一个文字框用作输入，宽度大约比所选字宽稍大一点。然后我们要对所画的输入文本框的属性做一点调整。在文本框上点鼠标右键，在弹出的菜单中选最下面的“属性”(Properties...)，进入文本域属性设置面板。如下图所示，在变量名(Variable)后填“input”，并选中第一项Drawborderandbackground，这样就会显示文本域的背景和边界。设置变量名是为了方便我们今后的调用。现在按回车确定。输出文本框的做法与输入框相同，我们还和刚才一样，在文字工具下用其参数修改器为要输出的文字设置字体，字号，颜色等，注意要保证按下，在刚才的输入框上面拉出一个宽一些的文本域用作输出。用鼠标右键点这个区域选“属性”进入文本域属性设置对话框。将Variable设置为“Output”，再将Options中的选项设置为下图所示。（关于每个项目的含义和设置我们将在本节的后面部分详细介绍。）这样我们就将输出文本域设置成了有边界和背景，允许多行输出并自动换行以及禁止编辑等属性。下面我们还需要做两个按钮，分别用来输入和清除文字。因为是演示，所以我们把按钮做得简单些，你也可以直接调用Flash中已经做好了的按钮。按Ctrl-F8新建一个图符，给图符起名为Button，并将图符的类型设置为Button。进入图符编辑模式后，用矩形工具拉出一个矩形，我们还可以加入圆角并修改颜色使它更象一个按钮。注意到我们所绘制的图形都是在按钮的UP帧下，为了简单起见，我们只做这一帧。返回场景中，按Ctrl-L打开图库窗口，分两次从预览窗口把按钮拖动到输入文本框的下面并排放置，用文字工具在两个按钮上分别写上“确定”和“清除”，如上面的电影所示。下面的步骤要稍微难理解一些，因为我们要用到actions为按钮加入一些动作，这样当点击按钮后才能执行相应的操作。actions属于Flash的高级技术，今后我们会重点介绍的。在这里，我们只需要有个大概的印象和认识就行了。用鼠标左键双击“确定”按钮，弹出实例属性对话框，注意到按钮类实例比图形类实例多了一项设置，就是Actions。点选Actions标签，点为按钮增加动作，在下拉菜单中选OnMouseEvent，即设置鼠标对事件的响应。然后在出现的选项框中选Release和KeyPress，并在KeyPress后的输入框中按一下回车键。这样我们就把按钮将要响应的鼠标事件设置好了，即当按钮被释放或按下回车键后发生动作。然后，我们将进一步指定在这些事件产生后如何进行操作。再点一下，在菜单中选SetVariable，我们在右边的变量名(Variable)一栏中填入output，在下面的值(Value)一栏填入input。注意必须把值右边的等价方式按钮设为，表示当按钮按下时，output中应该具有和input域中相同的内容，即二者的值相同。如果选，表示字串内容相同，这时无论你在文本输入框中输入任何文字，在按下确定按钮后，输出框中只会出现input这几个字符。同时我们注意到在这两种等价方式下，表达式的写法也不相同。同样，双击清除按钮，我们也为它设置动作。它的Actions设置如下所示。表示鼠标在该按钮上释放时，将output和input里的内容全部清空。这样我们就把这个文字输入和输出的演示做好了。知识拓展:(效果图展示)怎么样，做的这个文字输入输出演示比上面那个漂亮多了吧。大家想一下，如何利用我们前面学过的知识生成这样的效果。这个效果很容易实现的，与上面那个动画最大也最主要的差别是输入和输出文本域设置了边框和背景色，这使得画面靓丽了许多。其实，只是利用了层的技术造成了一个假象罢了。我们还用上面做好的动画为例，在两个文本域上分别点鼠标右键，在弹出的文本域属性设置框中把Drawborderandbackground前的对勾去掉，如右图所示。这样在场景中效果应如下图所示，文本域的边框和背景不再显示。新建一个层，把它拖动到原来层的下面，并命名为Background。在该层上用矩形工具选好边框和背景色绘制出两个大小和位置分别与输出输入框均相同的矩形来，如下图所示。这样，文本域就有了边框和背景色了。然后，我们再给按钮上上渐进色，再加些文字点缀就得到上面的效果了。怎么样，不难吧。附：文本域属性对话框中各项含义解释Drawborderandbackground显示文本域的边框和背景Password用户键入的任何字符均以＊号表示，且文字不能复制，剪切，从而得到保密Multiline允许文本以多行方式出现Wordwrap使文本在到达右边界时自动换行Restricttextlengthto限制用户文本输入的最大字符数Disableediting防止用户改变文本域的内容，使文本域不能被编辑Disableselection使文本域中的内容不能被选择Outlines可以选择只保存字体的轮廓，或指定的文字，符号等，适当选用可大大减小Flash文件的大小

作业练习：上机作业一：按照教师所展示的效果图模仿完成第一个作品。提高作业：在作业一基础上进行修改，完成第个二个作品。教学反思：FLASH入门动画（八）教学目标：①进一步通过按钮制作实例一，掌握按钮元件使用；②会制作简单按钮;=3\*GB3③会完成flash的第八个任务——按钮制作（一）。工作任务：任务八：按钮制作（一）实践操作：展示效果图：这一节，我们来学习按钮的制作方法。在上一节中，我们曾经做过一个简单的按钮，但是很不全面，现在我们就来学习一个完整按钮的制作过程。新建一个文件，按Ctrl-F8创建图符，命名新图符为Button，并在下面的行为(Behavior)选项中选按钮(Button)，确定。这样我们就进入了按钮的编辑窗口。注意这时时间轴上只有四帧，如右图所示：。这四帧的含义我们在前面的第一章中已经详细介绍过。首先我们来画Up帧上的内容，也就是正常状态下按钮的外观。选绘图工具栏中的矩形工具，在编辑窗口中间拉出一个不带边线的矩形来，为了美观起见，也可以选参数修改器中的设置圆角。用颜料桶工具选中深蓝色，在矩形上点一下，矩形这时以深蓝色填充。选文字工具，设置适当的字体，颜色，字号等，在矩形中间写上“按我”。选箭头工具，在刚刚输入的文字上点鼠标右键，在弹出的菜单中选放缩(Scale)。我们对文字进行放缩处理，使它排放在深蓝色矩形的合适位置。Up帧下的内容已经做好了，我们现在再来做Over帧的内容，也就是鼠标滑过按钮表面时按钮的外观。在Over帧上用鼠标左键点一下，并按F6把这一帧设为关键帧，这时该帧具有和Up帧相同的内容。选择颜料桶工具，选中灰绿色，用颜料桶在矩形上边线附近点一下，注意点中间的文字不会有效果，这时矩形框填充灰绿色。选择箭头工具，双击矩形中间的文字，进入文字编辑模式，改变文字工具参数修改器中的字号和颜色，并在文字输入框中输入“我会变色”。这样，我们又做好了按钮的第2帧。Down这一帧的做法和前两帧相同，先用F6在这一帧插入一关键帧，然后一方面用颜料桶工具选黄色填充矩形，另一方面用箭头工具双击矩形中间的文字部分，在文本编辑状态下改为“再变一次”。最后一帧是Hit帧。它的作用是定义按钮对鼠标做出反应的区域。一般情况下这一帧可以省略掉，但对于某些特殊情况，你可能会需要为按钮指定对鼠标做出响应的特殊区域，这时这一帧就很关键了。按下F6插入关键帧，把文字部分选中删除掉就行了，这样就设定对鼠标响应的区域就是这个矩形区域。这四帧全部设置好以后。我们点时间轴窗口左上角的回到主场景中，按Ctrl-L打开图库窗口，从它的预览窗口中把刚才做好的按钮拖到工作区中。按Ctrl-Enter观看一下效果，应该和我上面的按钮差不多。知识拓展:(效果图展示)下面我们玩大一点，做一个比较逼真一些的按钮。按钮的样子就如上面所示，怎么样，还不算太差吧。其实做这个按钮也不难，幸运鸟之前也从来没有做过按钮，这次破例做了一次竟然只用了半个小时就做好了，相信大家不会比我差，我也会把制作的步骤说得尽量详细一些的。事实上，要做一个逼真的按钮，最关键的不是制作方法，而是对光影效果的掌握。如上图所示，现在按钮处在正常状态下，也就是对应着按钮里的Up帧。大家一看就知道，这个按钮的外观实际上是由几个图片组合在一起的。没错，我们现在把组成按钮外形的几个图形类图符分离开来，大家就更清楚了。下图所示就是在按钮正常状态下，组成按钮外观的三个图符，从左到右按它们在按钮中的位置排列。当它们三个叠在一起时，由于各部分光强和阴影效果的反差，就形成了上图所示的样子。我们先来看一看位于最上面的这个桔黄色圆盘是怎么做的。其实这也是由两个形体组成的，见下图。按下Ctrl-F8，新建一个图符，命名为top，并确认是图形类图符后回车。在该图符的编辑模式中，我们先用椭圆工具出除边线，选棕黄渐进色，拉出一个圆球来，注意在绘制圆球前按下Shift键，这样保证拉出的是正圆而不是椭圆。绘制好以后，我们用颜料桶工具，还选用刚才的棕黄渐进色在球的右上方点一下，这样就把高亮点移到了球的右上方，如下面的右图所示。背景球做好以后，我们点时间轴下方的新建一个层。选中新层的第一帧，用椭圆工具去除边线，选桔黄色按住Shift键拉出一个比刚才的球小一圈的圆来。我们可以在这个桔黄色的圆上点鼠标右键，用菜单中的Scale命令调整它的大小。然后，我们用鼠标或方向键把圆移到球的中间，让它们的圆心位于同一位置，因为圆所在的层位于球所在层的上面，所以圆也位于球的上面。当然，为了更真实一些，这个桔黄色的圆实际也是用渐进色填充的，只不过色彩上变化不明显罢了。下面我们来做按钮的中间部分，就是上面那个中间亮两端暗的金属片样子的图符。再创建一个图形类图符，命名为Middle，这些我就不多说了。制作这个金属片的光效有两种方法。一种方法如下图所示，先绘制一个任意颜色，不带边线且比刚才做的桔黄色圆盘稍大一点的正圆，如下图一所示。然后我们用箭头工具在图中拉出一个矩形框选中这个圆的上半部分，见图二。选择颜料桶工具，将颜色设置为黑白线性渐进色，在图中圆形的阴影部分点一下，结果变成图三所示那样。接着我们在颜料桶工具的参数修改器中选中来改变渐进色的方向。在圆的上半部分点一下，结果如图四所示。图一图二图三图四用鼠标拖动平行线上圆形的旋转修改手柄调整渐进色方向为上面暗下面亮的状态，见图五。再用鼠标拖动平行线上方形的手柄将渐进色范围压缩为图六所示状态。现在我们就得到了如图七所示的半个金属片光效的图符。用同样的方法将圆的下半部分也做好，或者把下面的部分删除，把上面做好的部分复制做镜像再拼在一起也可以得到相同的效果。关于颜料桶工具的这个参数修改器我们上一章曾详细介绍过，这一节只是它的一个实际应用。

图五图六图七另外一种做金属光效的方法是先选择椭圆工具，点击参数修改器中的颜色选择按钮，再点进入颜色设置面板，进入渐进色设置框，选择黑白线性渐进色，按New键新建一个颜色，把左边黑色的指针井拖进关键色设置滑杆的中心位置，如右图所示。将中间的颜色调为白色，两端的颜色设为黑色，即得到中间亮两端暗的新线性渐进色。用这个颜色直接绘制出一个圆来，该圆就是以这种颜色填充的，然后我们只需要对圆作一个旋转处理以获得所需的颜色方向就行了。按钮的最下面的那一层是一个球，我想大家肯定都会做的，我就不再多说了，不过这个球要比中间的那个金属片还要大一圈。以上是制作按钮Up帧所要用到的图符。现在来做按钮，按Ctrl-F8新建一图符，命名为Button，且行为选项为Button。在Up帧把图库中已经做好的三个图符依次拖到编辑窗口中，中心对齐排列好即可。按钮的Over帧与Up帧的内容很接近，只不过最下面的那个球的颜色稍微调亮了一些，如下图所示，其余的桔黄圆盘和金属片都不变。按钮的Down帧在Over帧的基础上稍加变化，把桔黄色圆盘缩小一些就行了。至于Hit帧，我们只需要把Down帧中桔黄色圆盘和金属片删除即可。这样我们就做好了一个样子不错的按钮。作业练习：上机作业一：按照教师所展示的效果图模仿完成该作品。上机作业二：按照教师所展示的效果图模仿完成圆形按钮。上机作业三：（选做提高题）根据所学自由创作一作品,制作一个有个性的按钮，大家可以发挥自己的想象力。教学反思：FLASH入门动画（九）教学目标：①进一步通过按钮制作实例二，掌握按钮元件使用；②会使用影片剪辑元件制作成按钮;=3\*GB3③会完成flash的第九个任务——按钮制作（二）。工作任务：任务九：按钮制作（二）实践操作：展示效果图：大家试着点一点上面的按钮，看看这个按钮和上一节我们讲到的按钮有什么区别。对了，除了外形不一样以外，最大的区别就在于当鼠标滑过按钮上方时，是播放一小段动画而不仅仅是切换成另外一张图片。这就是我们这一节要学习的，制作一个动态按钮。大家知道，按钮的制作实际上是按钮的Up、Over、Down和Hit关键帧的制作，上一节中我们在这四帧中分别放上不同的静止的图形类图符，这样生成的按钮就成为静态按钮。相反，如果我们在其中某些关键帧中放入的是动态的电影片断(MovieClip)，当特定鼠标事件产生时，就会表现为动态的效果。这个道理我想是很容易理解的，所以这一节也会相对简单一些。下面就让我们来研究一下上面的这个动态按钮是怎么做出来的。首先打开一个新文件，按Ctrl-F8新建一个图形类(Graphics)图符并将图符命名为NextUp。这个图符将用于按钮在正常状态下的外形。进入图符编辑模式后选矩形工具，拉出一个宽比高稍短一点的红色矩形来，如下图一所示。然后我们用箭头工具把矩形移动到如图二所示位置，让十字中心点位于矩形右边的中心。当箭头移到矩形右上角时，形状变成图三所示，大家一看就知道我们要做什么了。如图四和图五那样，分别把矩形的右上角和右下角拉到右边的中心点位置，这样，我们就把用作按钮Up帧的三角形图片做好了。做这个三角形的方法很多，大家也可以用铅笔或线条工具试一下。图一图二图三图四图五大家注意到鼠标滑过上面的按钮时，按钮变成黄色三角形，并且重复调用四次，所以我们需要为制作这个电影片断而事先准备一张黄色三角形图符。因为它的形状和刚才做的nextup红色三角形图符一样，所以我们只要对上面做好的图符稍加修改就行了。新建一个图形类图符，命名为nextover，进入图符编辑画面，按Ctrl-L打开图库窗口，从预览窗口把红色的三角形直接拖到编辑区中，在该三角形被选中的情况下，按Ctrl-B把它打散，用颜料桶工具选黄色的填充色在三角形中点一下。这样我们就做好了这个图符。用同样的方法，我们再做一个名为nextdown的绿色三角形图符用做按钮按下状态时的外观。下面我们来制作按钮Over帧上将要用到的电影片断(MovieClip)。新建一个图符，起名为movie，并选择它的类型为MovieClip。进入编辑画面，发现与主场景的编辑画面很相似。从图库窗口中选中nextover，从预览窗口中把黄色的三角形拖到编辑区中。在第2帧按F6键插入一关键帧，在这一帧上再从预览窗口中把黄色的三角形拖到编辑区中，放在原来的那个三角形右边，这样就有两个并排放置的三角形。在第2帧用鼠标左键双击右边的三角形，进入图符属性对话框，在Color标签下把Alpha值设为80，使得右边三角形稍稍透明一些。同样，在第3帧按F6键插入关键帧，与其上帧的操作一样，再拖进一个三角形并排放在右边，然后把最右边的三角形Alpha值设为60。第4帧也是如此，只不过最右边的三角形的Alpha值为40。现在按钮主要关键帧上所要放的图片和电影片断我们都已经做好了，现在就可以动手制作了。按Ctrl-F8新建一按钮类图符，取名为button。在Up帧，把红色三角形nextup从图库拖到编辑窗口。在Over帧上用鼠标点一下，按F6插入关键帧。因为我们要用电影片断取代红色的三角形放在这里，所以要求它们应放在同一位置，这里我们提供一种对齐方法。因为在Over帧按的是F6，所以这一帧的内容与Up帧一致，均为红色三角形，从图库中拖出名为nextover的电影片断，把它放在红色三角形的上方，用键盘上的方向键调整它的位置，使它刚刚好把红色三角形完全遮住。现在在电影片断被选中的情况下，按Ctrl-X把它从画面中剪取出来，这时画面中只剩红色的三角形。用箭头工具选中红色的三角形，按Delete键把它删掉，再按Ctrl+Shift-V把剪取的电影片断粘帖到原处，这样电影片断就与刚才的红色三角形在同一位置。同样，也可以用相同的对齐方法把绿色的三角形放在Down帧同一位置上。这样，一个按钮就做好了。为了看一下效果，我们回到主场景中，从图库中把这个按钮拖出来，再按下Ctrl-Enter查看结果。知识拓展:(效果图展示)严格地说，上面这个按钮并没有玩多大，大家一看就应该知道是怎么做的，所以也不准备讲得太多。不过这个按钮虽然很普通，但多少会给大家一些启发，其实按钮的变化千姿百态，大家多看看，多想想，就会设计出有创意的作品来。这个按钮中，文字出现的次数比较多，且具有不同的效果，所以把文字做成图符是必要的，我们首先创建一个新的图形类图符，名为AnWo，在编辑状态下选文字工具以适当大小颜色的字体写上“按我”两个字。同样的方法，我们可以做好名为XieXie的图符，是由“谢谢”两个字组成的，用于按钮Down帧下电影片断的制作。下面我们来做Over帧下将要用到的电影片断。按Ctrl-F8键新建一电影片断(MovieClip)类图符，取名为overmovie。从图库中把做好的“按我”图符拖动到编辑窗口中。现在新建两个层，在时间轴窗口把最初的那个层拖到新建的两个层之间。回到最初的那一层，用箭头工具选中“按我”，按Ctrl-C键把它复制到剪帖板中，分别点新建的两个层的第1帧，按Ctrl+Shift-V把刚才复制的内容分别粘帖到这两层中，这时三个“按我”文字重合。现在我们分别对这三个实例进行编辑，首先修改原有层。点击时间轴窗口新建两个层下对应的黑点，把这两层锁住。用鼠标左键双击“按我”文字，在实例属性对话框中把Alpha值改为80。然后把原来的层锁住，对新建两个层分别解锁进行编辑，把它们的第一帧“按我”文字的Alpha值均设为80。在新建两个层的第12帧分别按F6新增关键帧，然后在第12帧处把两层中的文字一个向右上方拖出一定距离，一个向左下方拖动一定距离，并分别设置这一帧中文字的Alpha属性值为0，也就是全透明，这时新建的这两层在这一帧中将看不到内容，但仍可以选择文字实例。在原来层的第16帧按F5，使得该层内容一直保持到第16帧。这样这个电影片断就做好了，我们可以按下回车键查看效果。Down帧所需要用到的电影片断我就不准备再讲了，因为和上面讲的差不多做法。这些都做好后，新建一个按钮类图符，先用矩形工具拉出一个矩形框来做背景，再把不同的图符和电影片断分别放在按钮的不同帧上，把位置放好就行了。作业练习：上机作业一：按照教师所展示的效果图模仿完成作品一。上机作业二：按照教师所展示的效果图模仿完成作品二。上机作业三：（选做提高题）根据所学自由创作一作品,制作一个有影片剪辑元件的创意按钮，大家可以发挥自己的想象力。教学反思：FLASH入门动画（十）教学目标：①通过残影技术制作实例，进一步掌握元件使用；②会熟练使用图层的操作;=3\*GB3③会完成flash的第十个任务——残影技术工作任务：任务十：残影技术实践操作：展示效果图：这一节我们来学习残影技术，也就是上面Flash电影中所展示的。大家不要以为实现这个效果很难，其实只需要简单的几步就可以做到。首先，我们新建一个文件，按Ctrl-M选好电影的大小和背景颜色，我们这里选用300X280，背景为天蓝色。用文字工具，选白色方正隶变繁体36号字在场景中写下“新闪光时代”五个字，如果对文字的大小不满意，可以进行放缩处理，方法如以前所讲。因为文字部分要多次调用，所以我们把它转换成图符。选中文字，按F8转换，起名为shadowtext，类型为图形类。我们也可以一开始直接按Ctrl-F8建立新图符，然后再在图符编辑窗口输入文字，这样也可以做出包含文字的图符。不过在场景中把文字转换成图符会简化我们的操作，大家注意到转换以后的文字在正中心会有一个十字定位符出现，我们要做文字的旋转动画就是绕着这个十字中心旋转的，所以这会省去我们调整文字位置的麻烦。移动文字图符到画面合适位置，使得估计它旋转以后不至于超出边界。现在我们在第20帧按F6插入关键帧。在第1帧上双击鼠标左键，在帧属性对话框中选Tweening标签。将其下的参数Tweening设为Motion，在Rotate项选择顺时针(Clockwise)旋转，在后面的次数栏里填上1，表示顺时针旋转1圈，如下图所示。设置好以后，我们按Ctrl-Enter查看一下效果，可以看到文字顺时针不停旋转。下面我们回到主场景，点时间轴窗口的新建两个图层，在中间一层的第2帧按下F6插入关键帧。点最下面层也就是起初有文字的那一层的第1帧，按下Ctrl-C把文字图符复制到剪帖板上，再点中间层的第2帧，按下Ctrl+Shift-V把剪帖的文字图符粘帖到刚才复制时的位置上。然后在中间层的第21帧按下F6键，然后双击中间层的第1帧，设置帧属性与刚才相同，参见上图设置。同样，对于最上面层，我们在第3帧按下F6键插入关键帧，然后再按Ctrl+Shift-V键粘帖刚才复制的内容。在第22帧上按F6再插入一关键帧，双击第1帧设置帧属性同上所述。现在时间轴的分布应如下图所示。现在我们再来看一下效果，在文字旋转时会分成三个连续的旋转过程。为了达到残影的效果，我们需要改变上面两层文字透明度，使它们看上去颜色淡一些。先修改中间层，为了便于操作，我们把其它两层都锁住。选择第2层的第2帧，双击场景中的文字，进入实例属性对话框，在Color标签下把Alpha值改为70。对第21帧做同样的操作。接着修改最上面层，锁住中间层，对最上面的层解锁，选择第3帧，把Alpha值改为40。对第22帧做同样的操作。现在再让我们来看一下效果，残影的感觉已经有了，只是电影结尾部分还不十分完善，我们现在在每一层的第30帧分别按F5键，这样每一层都将保留最近的一个关键帧的内容直到第30帧。再按Ctrl-Enter，现在的残影效果似乎已经没有什么可以挑剔的。

知识拓展:(效果图展示)下面我们来想办法实现上面这个效果。不难看出，上面的Flash电影先是运用了平移的运动渐变技术，随后再运用边旋转边平移的运动渐变。这样看来，这个效果应该是很容易就可以实现的。幸运鸟在这里只是想抛砖引玉，提供给大家一种应用残影技术的思路。具体的制作过程就不再多讲了，只是想再强调两点在制作中需要注意的地方。一是大家注意到旋转的中心点并不是在文字的正中间，而是在偏右一些的地方。我们可以利用本节首的Flash动画源文件，对它的图符再稍稍编辑一下。在图符编辑窗口下，用键盘上的方向左键把文字向左移动一些，使得十字定位点位于文字偏右的位置上，见右图。二是为了产生文字在旋转后趋于稳定的效果，我们加入了对运动渐变的Easing设定。我们在前面讲过，使用Easing参数可以改变运动的节奏，在一般情况下Easing为0表示匀速运动，在它大于0时减速，小于0时加速。我们在这里设置Easing值为80，如下图所示，使旋转的节奏在最后趋缓。同样，我们可以设置平移运动的Easing为小于0的某值，使得平移作加速运动，以便平移与旋转二者很好地衔接。这个动画其它的部分大家应该都会做了，做好后的时间轴如下图所示。大家可以试着做一做，还可以考虑加入导向层控制文字的移动路径，以及加上色彩的变化等。作业练习：上机作业一：按照教师所展示的效果图模仿完成作品一。上机作业二：（选做提高题）在作品一的基础上完成作品二。教学反思：FLASH入门动画（十一）教学目标：①通过遮罩效果制作实例，掌握遮罩层使用及含义；②会灵活运用遮罩层的技术，产生风格各异的效果来;=3\*GB3③会完成flash的第十一个任务——遮罩效果工作任务：任务十一：遮罩效果实践操作：展示效果图：这一节我们来学习遮罩。这是一个比较简单但应用广泛的技术。如果运用得当，可以产生某些特殊的效果。上面的例子就是遮罩的一种表现形式。下面我们来看一下它是怎么实现的。首先，新建一个Flash文件。按Ctrl-M把电影属性修改为长条形，大约400X100，背景选天蓝色。然后，选文字工具在场景中输入“新闪光时代”几个字。设置字的颜色为白色，字体为隶书，调整字号至合适大小。新建一个层，这个层应该在文字层的上面。在该层中用椭圆工具绘制一个圆形，颜色无所谓，但要求其直径要大于刚才输入的文字高度。选中圆，按F8把它转换成一个图形类图符，因为我们在后面要多次调用。当然，不转换也可以，只不过在圆渐变运动时，要选择形体渐变，而不是运动渐变。不论是用图符还是用形体，效果都一样。这里用图符。把圆拖到文字的左面如下图所示：然后我们还在这一层第25帧按下F6键新建一个关键帧，再在第50帧按下F6键。现在这两帧都和第1帧具有相同的内容。我们还在打算让圆先从左向右移动到文字右端，再移回文字左端。所以在第25帧，我们用键盘上的方向右键把圆从左端移到文字右端，见下图。移动时可以按下Shift键，这样移动起来会快一些。用键盘而不用鼠标移动的好处是移动后无需进行水平对齐。在圆所在层的第1帧，双击鼠标左键，设置渐变方式为运动渐变，怎么设不用我再多说了吧。同样，在第25帧也如是操作。因为第50帧和第1帧内容相同，所以不需要再做什么。在圆所在层点鼠标右键，在弹出的菜单中选择Mask，也就是把这一层变为遮罩层，而下面的文字层也自动变成为被遮罩层。我们注意到文字只在第1帧里有内容，为了在整个动画过程中文字都能显示出来，我们在文字层的第50帧按F5键，这样该层所有帧的内容将和第1帧相同。好了，现在我们来看一看效果，应该差不多了，遮罩的感觉已经有了。现在大家应该明白为什么圆是什么颜色无关紧要了吧。因为遮罩就是把遮罩层中对象以外的部分遮盖住，而只显示透过对象的被遮罩层的内容。所以我们看到的文字的颜色是被遮罩层的，与遮罩层无关。为了使动画的效果更明显一些，我们可以在最下面放上浅一些颜色的文字做底色。我们选中圆所在层，再点新建一个层，把这个新建的层拖到最下面来。在文字层中选中文字，按Ctrl-C复制，再回到最下层，按Ctrl+Shift-V把文字粘帖到原来的位置上。在文字上双击鼠标左键，进入实例属性对话框。在Color标签下把Alpha值改到50或以下，让文字显得透明一些。你也可以把文字打散再填充灰蓝一些的颜色。然后我们选中第50帧，按F5键，让之间所有帧的内容与第1帧相同。

现在动画的效果是不是更好一些了呢？

知识拓展:(效果图展示)咦，这个作品我们不是在前面做过了吗，怎么又拿出来了？呵呵，先别急，上面这个例子的效果的确在前面出现过，也就是文字的镂空效果。不过相同的效果可以用不同的方法来实现，我们现在就介绍用遮罩来实现文字镂空效果的方法。大家还记得我们用的是什么方法吗？简单地说，那一节中我们先要做一个镂空的色带，也就是先要画一个和电影属性中的设置同样大小的矩形覆盖背景，矩形的填充色和我网页的背景色相同，再在上面写上文字，把文字打散融于这个矩形中，再把文字删掉就形成了镂空。然后让图片在下面移动，就可以得到上面的效果。那么如果我们用遮罩又该怎样实现呢？其实，方法就更简单了。首先，我们先按Ctrl-M把电影文件的属性设置成与第十节中这个例子同样的宽度和高度，将背景色设置为与网页背景色相同的天蓝色。在设置电影文件属性的背景色时，因为Flash中只提供了部分颜色可供选择，如果没有自己想要的颜色怎么办呢？这里提供一个小窍门。下面的颜色面板是我们在按下Ctrl-M，点击Background所对应的Color按钮后所得的背景色选择面板。先随便选一个颜色退出电影属性设置。然后我们点绘图工具栏中的颜料桶工具，也可以点矩形，椭圆或笔刷工具等，在其下的参数修改器中找改颜色的按钮，进入颜色选择面板。点进入颜色设置对话框，在Solid标签下，我们按New新建一个色值，使用颜色区选择一种颜色或直接在R，G，B输入框中填上色值，我在这里分别填上0，112，170，如下图所示，在预览窗口可以看到现在的颜色已经和我网页的背景色一样了。按Change把设好的颜色保存下来。点颜色设置窗口右上角的X关掉这个窗口。再按Ctrl-M进入电影属性设置面板，点Background下对应的颜色按钮，进入背景色选择面板，这时我们发现刚才新建好的天蓝色已经出现在颜色选择面板的最下方了，如下图所示，选择它就行了。现在背景色已经设置成我们需要的颜色了。然后，我们在这一层上写上文字“新闪光时代”，字体字号及位置与第十节中镂空效果的文字相同。新建一个层，把这个层拖到文字层的下面来。还把上次用的图片放到这一层中，且使该层的内容和设置与第十节中镂空效果示例中的图片层完全一致。现在我们在文字层的第40帧按F5键，保持文字在这40帧里的持续显示。然后我们在文字层的点鼠标右键，在弹出的窗口中选Mask，则图片层自动成为被遮罩层。设置好的时间轴窗口如下图所示：现在我们来看一下效果。按Ctrl-Enter。怎么样，和第十节我们讲过的效果一样吧。这种方法好象还要简单些。与我们这一节开头的那个示例比较一下，看看两者有什么不同。是的，本节开头的示例中是移动遮罩层中的对象，而这个示例是移动被遮罩层中的对象，这样就会形成截然不同的效果了。看来，灵活运用相同的技术，我们也可以产生风格各异的效果来。作业练习：上机作业一：按照教师所展示的效果图模仿完成作品一。上机作业二：（选做提高题）在作品一的基础上完成作品二。教学反思：FLASH入门动画（十二）教学目标：①通过放大镜效果制作实例，进一步掌握遮罩层使用及含义；②会灵活运用遮罩层的技术，产生风格各异的效果来;=3\*GB3③会完成flash的第十二个任务——放大镜效果工作任务：任务十二：放大镜效果实践操作：展示效果图：在这一节中，我们将利用上一节学过的遮罩来实现一个放大镜的效果。因为讲解所需的图片比较多，所以载入时间也许会长一些，还请大家多等一会儿，因为这一节的内容既重要又有趣，不学可惜了耶。上面的示例做得还不错吧，呵呵，也花了我不少时间呢。现在我就一步一步地来详细说明制作过程。新建一个文件。按Ctrl-M把电影属性设置为525pxX120px，天蓝色背景。选绘图工具栏中的文字工具，用黑体48号字选择白色在工作区中间写上“新闪光时代”五个字。略微放大这几个字到如下图所示大小，怎么放大不用我多说了吧。双击这一层文字“Layer1”，将名字改为“BackgroundText”。在这一层上新建一个层，命名为“MagnifiedText”，这一层将用于显示放大了的文字。还用文字工具选黑体72号字，用稍有些灰的白色在这一层仍写上“新闪光时代”五个字。颜色的选用是根据物理上光学的知识，放大后的字会损失一部分光线，所以选择稍灰暗一些的颜色。现在两层文字重叠在一起。我们的思路是当放大镜从待放大的字的左端移到右端，也就是滑过这五个字时，在放大镜里也正好同步显示这五个字，但问题是这两层中的文字不一样长度，这就需要我们在动画过程中还要稍稍向左移动这一层上的文字，使得两层中的文字起点和终点尽量接近。方法如下：在MagnifiedText层里把72号字的左端移动到下图所示的位置上，使两层中的文字左端位置比较接近。然后我们在第40帧里按F6生成关键帧。在BackgroundText层里的第40帧按F5保持第1帧的内容。回到MagnifiedText层里的第40帧上，用键盘上的方向键把文字向左移动到下图所示位置上。然后在第1帧双击鼠标左键设置从第1帧到第40帧的运动渐变。下面我们来设置遮罩层使放大的文字在特定的区域里才能显示。在最上面新建一个层，起名为“MaskTopText”，如果新建层不在最上面，把它拖到最上面即可。用椭圆工具画一个不带边线的圆，代表放大镜，颜色无所谓，直径比放大层中文字要稍大一些，位置如下图所示。当设置此层为遮罩层后，只有圆形中的被遮罩层的内容才能被显示出来。为了方便调用，用箭头工具选取圆，按F8把它转换为图形类图符。在这一层的第40帧按F6插入关键帧，并把圆向右移动到下图所示位置。双击第1帧设置帧属性为运动渐变。在这一层上点鼠标右键，在弹出的菜单上选Mask设为遮罩层，这时下面放大的文字所在层自动成为被遮罩层。现在我们来观察一下效果。按Ctrl-Enter发现随着圆形的移动，放大的效果已经出来了。不过放大的文字下方却还可以看得到背景文字，这是不真实的，所以我们还要再改进一些。看来我们得对最下面的背景文字也加一个遮罩层，让代表放大镜的圆所过之处的背景文字不被显示。选择BackgroundText层，点新建一个层，新建的层将位于最下面的文字层上方，给它起名为“MaskBottomText”。在这一层上，我们用矩形工具，以任意填充色（不要与圆的颜色相同）绘出一个不带边线的矩形，长度约为1050px，也就是电影属性设置的长度的2倍，宽度大约110px，把它放在如下图所示的位置上。因为这个矩形太长了，这里放不下所以缩小了一半显示。由于这个矩形所在层的缘故，它遮住了下面的背景文字层，而放大的文字层及其遮罩层上的内容可以显示出来。现在我们把放大的文字所在层隐藏起来，让编辑区里只能看见矩形和圆形。选择圆形，按Ctrl-C复制，然后把圆所在层也隐藏起来。选择矩形所在层，按Ctrl+Shift-V把圆形复制到这一层原来的位置上，按Ctrl-B把它打散，如下图所示：然后我们用箭头工具在圆的外面拉出一个比矩形的高度要大一些的框选中矩形的一部分和整个圆，见下图。这一步的作用是使圆和矩形融合在一起。在矩形外点一下，取消对这部分区域的选择，再一次用鼠标点选圆形，按Delete键把圆删除，得到下面所示的图形：这是一个镂空的色带，与以前所讲不同的是，这次镂空的部分是一个图形而不是文字。而且，我们用它来作遮罩时，有形体的部分下面的内容将正常显示，而中间被镂空的部分下的内容无法显示出来，这实际上与镂空的概念是截然相反的，但这个效果正是我们希望的。用箭头工具拉一个大框套住全部矩形，按F8把它转换为图形类图符，以方便调用。在矩形所在层的的第40帧按F6新建一个关键帧。把这个镂空的矩形移到下图所示位置。这个位置的确定是由代表放大镜的圆的位置所决定的。我们可以对圆所在层恢复显示，让镂空的矩形中间的空洞在第40帧正好对准代表放大镜的圆。在矩形所在层的第1帧设置帧属性为运动渐变。然后，用鼠标右键点击这一层，在弹出的菜单中选择Mask。现在我们再来看一下结果，按下Ctrl-Enter发现，放大镜效果已经是非常明显的了。为了产生更好的效果，我们再来动手做一个放大镜加上去，使得效果真加逼真一些。按Ctrl-F8新建一个图形类图符。进入图符编辑画面，按下Ctrl-L打开图库窗口。从预览窗口中把圆形图符拖动在编辑区中，使它中心的十字与编辑区中心的十字重合。按下Ctrl-B把它打散，再按Ctrl-X把它剪切到剪帖板中。我们再从预览窗口中拖一个圆形图符到编辑画面中，将它的中心与编辑区中心的十字重合，如下图一所示。在圆上点鼠标右键选Scale。拉动右下角的手柄把圆放大一点，发现圆的中心并没有移动，见下图二。按Ctrl-B把圆打散，用颜料桶工具给圆填充黑色，如图三所示。

图一图二图三图四图五然后，我们按Ctrl+Shift-V把刚才剪取的圆粘帖到原来的位置上，在图形外面点一下，如图四所示，这时两个圆已经很好地融合在一起了。点取中间浅黄色的圆，按Delete键把它删掉，就得到图五中所示的图形。如果愿意，我们还可以用墨水瓶工具给图五中的图形加上适当颜色的轮廓线。现在，放大镜的透镜部分我们已经做好了，下面来制作手柄。还是在透镜的编辑窗口下，在另一个区域里选择矩形工具拉出一个如下图六所示的用从暗黑到黑的线性渐进色填充的矩形。然后我们用箭头工具将其下面的三条边拉出一些弧度来，见图七。在手柄上点鼠标右键选Rotate将手柄旋转一个角度，见图八。现在我们就把手柄也做好了。如果对手柄的粗细不满意，还可以适当放缩。图九是手柄的最终样式。图六图七图八图九把手柄移动到透镜下方适当位置处，就得到了完整的放大镜，见下图。回到主场景，在最上面新建一个层，在这个层上把放大镜图符调入，同样在40帧插入关键帧，在第1帧设置运动渐变。使从第1到第40帧里，放大镜的透镜始终与MaskTopText层中的圆形位置重合。这样，我们的工作就基本上做完了。为了使动画更连续，我们在第80帧插入关键帧，并制作放大镜移回的动画。这个大家自己完成吧。对了，因为电影属性中背景不够大，我们还需要按Ctrl-M把高度设置为210px。这样一个完整的放大镜动画就全部做好了。做好后的时间轴应如下图所示。作业练习：上机作业一：按照教师所展示的效果图模仿完成作品。教学反思：FLASH入门动画（十三）教学目标：①通过放大镜效果制作实例，进一步掌握遮罩层使用及含义；②会灵活运用遮罩层的技术，产生风格各异的效果来;=3\*GB3③会完成flash的第十三个任务—