Flash动画实例教程

《FlashCS4动画制作教程》FlashCS4动画制作实例教程2《FlashCS4动画制作教程》第1章FlashCS4入门本章主要内容：Flash动画的特点和应用；FlashCS4的工作界面；FlashCS4界面的设置；基本文件的操作。2《FlashCS4动画制作教程》第1章FlashCS4入门知识点1.1认识FlashCS41.1.1Flash动画的特点Flash的主要特点如下：Flash使用了矢量图形和流式播放技术，可以随意调整缩放，而不会影响图形文件的大小和质量。通过使用关键帧和元件，使所生成的“.swf”格式的动画文件非常小，便于在网络上播放和传播。Flash制作的动画，能够交互式地将音乐、动画、声效等融合在一起，很多用户已经把Flash当做一个开发多媒体的首选工具。Flash拥有功能强大的ActionScript语言，它采用了与JavaScript类似的语法结构，拥有自己的ActionScript函数、属性和目标对象等，并且兼容并支持Flash低版本。1.1.2Flash动画的应用1．制作动画短片2《FlashCS4动画制作教程》第1章FlashCS4入门知识点2．制作游戏3．制作MTV4．制作多媒体教学课件5．制作Internet应用程序6．制作网页1.2FlashCS4的工作界面，如右图1-1所示。菜单栏标题栏布局模式舞台属性面板绘图工具箱时间轴/图层/动画编辑器窗口1.2.1标题栏1.2.2菜单栏1.2.3主工具栏1.2.4绘图工具箱图1-12《FlashCS4动画制作教程》第1章FlashCS4入门知识点单击“小三角”可以展开下一级菜单进行选择1.2.4绘图工具箱图1-2绘图工具箱如右图1-2所示,它包含了10多种绘图工具，用户可以使用这些工具对图像或选定区进行操作。单击绘图工具箱右上角的按钮，可以将工具箱折叠为图标。若要展开面板可单击按钮或图标；另外，可以把面板缩放成单列或多列。2《FlashCS4动画制作教程》2第1章FlashCS4入门知识点1.2.5时间轴时间轴面板如右图所示，它的主要组件是层、帧和播放头，还包括一些信息指示器，如图1-3所示。层帧播放头信息指示器1.2.6场景与舞台在当前编辑的动画窗口中，我们把动画内容编辑的整个区域叫做场景。舞台就是绘制和编辑动画内容的矩形区域，具体如图1-4所示。图1-3《FlashCS4动画制作教程》第1章FlashCS4入门知识点场景名称舞台工作区舞台比例图1-4场景和舞台2《FlashCS4动画制作教程》第1章FlashCS4入门知识点1.3FlashCS4界面的设置1.3.1动画属性的设置按照下列步骤设置动画属性：第1步：打开【属性】面板,它会显示整个动画的属性。第2步：点击【550×400像素】右侧的【编辑】按钮，弹出【文档属性】对话框。第3步：在【帧频】框键入正确的放映速度，即帧每秒。默认值24，即动画的每一秒要显示24帧画面。第4步：在【尺寸】框中，输入电影的宽度和高度值。最小为18像素，最大为2880像素。第5步：点击【背景颜色】右侧的色框，在弹出的颜色面板里用户可以选择动画背景的颜色。第6步：单击【确定】。2《FlashCS4动画制作教程》第1章FlashCS4入门知识点1.3.2时间轴线的设置1.3.3工具栏、工具面板的设置工具栏、工具面板以及工作区等都可以在屏幕上任意拖动，用户可以将其拖放到最适合自己操作的位置。1.4基本文件的操作1.4.1创建新文档1.4.2Flash文档的操作2《FlashCS4动画制作教程》实训1：设计一个小球从上向下运动的动画实训2：设计一个小球由大渐小的动画第1章FlashCS4入门上机实训提示:先用椭圆工具绘一个小球,然后在第1关键帧把小球位置放在舞台上方，在第30关键帧把小球位置放在舞台下方,最后在第1帧至30帧之间创建补间形状动画。提示:用椭圆工具绘一个小球；用变形工具将第30关键帧的小球缩小；在第1帧至30帧之间创建补间形状动画。2《FlashCS4动画制作教程》第2章工具的使用本章主要内容：矢量图和位图；线条和填充图形；FlashCS4常用工具的功能及其使用。2《FlashCS4动画制作教程》任务一：制作一张“几何形体图”,效果如图2-1所示。任务二：制作一张“荷花图”，效果如图2-2所示。第2章工具的使用任务导入（图2-1）（图2-2）2《FlashCS4动画制作教程》任务三：制作一张“春天美景图”,效果如图2-3所示。第2章工具的使用任务导入（图2-3）2《FlashCS4动画制作教程》问题与思考：第2章工具的使用问题与思考FlashCS4的工具箱中的各种工具如何使用？如何绘制图形？如何编辑图形？2《FlashCS4动画制作教程》第2章工具的使用知识点2.2.1矢量图和位图矢量图形使用称作矢量的直线和曲线描述图像，矢量也包括颜色和位置属性。矢量图形与分辨率无关，它适合于线性图，特别是二维卡通动画，能够有效地减少文件容量。位图图形使用称作像素的排列在网格内的彩色点来描述图像。在编辑位图图形时，修改的是像素，而不是直线和曲线。位图图形跟分辨率有关，位图适合表现层次和色彩细腻丰富，包含大量细节的图像。2.2.2线条和填充图形线条，是指用线条工具、钢笔工具、铅笔工具绘制的图形以及由椭圆工具、矩形工具绘制的边框线。调整线条的粗细可以使用属性面板中的“笔触”数值的大小来改变；改变线条颜色可以使用墨水瓶工具。填充图形，是指用刷子工具绘制的图形，或者是由椭圆工具、矩形工具绘制的图形的填充部分。填充图形的颜色不能通过墨水瓶工具来改变，只能使用颜料桶工具来调整。2《FlashCS4动画制作教程》第2章工具的使用知识点2.2.3工具介绍（图2-4绘图工具箱）2《FlashCS4动画制作教程》实训1：制作“几何图形”实训2：制作“乡间美景图”，效果如图2-5所示。要求：绘制正方形、矩形、多边形、圆、五角星等几何图表，并自定颜色填充。第2章工具的使用上机实训图2-52《FlashCS4动画制作教程》要求：用3D工具制作由6张大小相同但内容不同的图片构成的正方体图形第2章工具的使用上机实训实训4：制作“正方体图”实训3：设计制作“卡通人物图”，效果如图2-6所示。图2-62《FlashCS4动画制作教程》第3章文本处理本章主要内容：文本的类型及属性的设置；文本的输入及编辑；文字效果和静态动画的制作。2《FlashCS4动画制作教程》任务一：制作“渐变色的文字”的动画,效果如图3-1所示。任务二：制作“金属文字”的动画，效果如图3-2所示。第3章文本处理任务导入（图3-1）（图3-2）2《FlashCS4动画制作教程》任务三：制作一幅“霓虹广告”的动画,效果如图3-3所示。第3章文本处理任务导入（图3-3第1帧和第5帧的效果图）2《FlashCS4动画制作教程》问题与思考：第3章文本处理问题与思考文本有哪些类型？文字转化为矢量图形的方法是什么？如何制作文字效果？静态动画如何制作？2《FlashCS4动画制作教程》2第3章文本处理知识点3.2.1文本及其类型在FlashCS4中，文本类型可分为3种：静态文本、动态文本和输入文本。三种类型的切换方法是在文本工具属性面板的第一个下拉列表框中选择。一般情况下默认的文本是静态文本，在动画播放过程中，静态文本区域中的文字是不可编辑和改变的，但是可以对静态文本块进行缩放、旋转或者扭曲，可以为他们指定不同的颜色和透明度效果。动态文本就是可编辑的文本，在动画播放过程中，文本区域的文字可通过事件的激发来改变。输入文本就是在动画播放过程中，提供我们输入文本，产生交互。它允许用户在空的文本区域中输入文字，用于填充表格，回答调查的问题或者输入密码等。3.2.2设置文本属性3.2.3设置段落属性1．设置段落的对齐方式2．设置边距和间距《FlashCS4动画制作教程》第3章文本处理知识点3.2.4文本的输入分为水平方向输入和垂直方向输入两种。3.2.5文本的编辑1．转换文本类型2.分散文字：分散文字就是将文字转换为矢量图形，具体操作是使用【修改】/【分离】命令。3.填充文字注意：一旦把字符转换成线条和填充以后，就不能把它们作为文本来编辑。即使重新组合字符或者把它们转换成符号，也不能再应用字体、字距或是段落选项。2《FlashCS4动画制作教程》实训1：制作“数学公式”，效果如图3-4所示。实训2：制作“空心字”，效果如图3-5所示。第3章文本处理上机实训图3-4实训3：设计制作“霓虹灯广告”。图3-52《FlashCS4动画制作教程》第4章元件和库本章主要内容：元件的类型；元件的创建和编辑；实例的编辑；库的使用；元件的制作2《FlashCS4动画制作教程》任务一：制作“渐变色的文字”的动画,效果如图3-1所示。任务二：制作“金属文字”的动画，效果如图3-2所示。第4章元件和库任务导入（图3-1）（图3-2）2《FlashCS4动画制作教程》任务一：如何创建图形元件。第4章元件和库任务导入（图4-1)要求:创建一图形元件，效果如图4-1所示任务二：如何创建图形元件。要求:创建一“动态按钮”元件，设置四个关键帧中按钮颜色属性变化，鼠标在“动态按钮”上“按下”、“弹起”等不同状态会出现不同的效果，如图4-2所示。图4-2“鼠标按下”和“鼠标弹起”时按钮状态2《FlashCS4动画制作教程》第4章元件和库任务导入（图4-3)任务三：如何创建影片剪辑元件。要求:创建一影片剪辑元件，组成四个正方形在舞台上旋转的动画，如图4-3所示。2《FlashCS4动画制作教程》问题与思考：第4章元件和库问题与思考元件的类型有哪些？如何制作元件？如何使用元件？元件库如何使用？2《FlashCS4动画制作教程》第4章元件和库知识点4.2.1在动画中使用元件的优点1．可以简化动画的制作过程2．减小文件大小3．方便网络传输4.2.2元件的类型元件主要有图形、影片剪辑和按钮3种类型，不同类型的元件有着不同的作用。4.2.3元件的创建1．创建新元件2．将舞台元素转换为元件2《FlashCS4动画制作教程》第4章元件和库知识点4.2.4编辑元件1．编辑元件的方法2．元件的编辑4.2.5创建与编辑实例1．将元件的实例添加至舞台2．编辑实例4.2.6库和公用库1．定义公用库2．使用公用库2《FlashCS4动画制作教程》实训1：制作“环环相扣图形元件”，效果如图4-4所示。实训2：制作“变色按钮”，效果如图4-5所示。第4章元件和库上机实训图4-4实训3：制作“一小球从大变小的影片剪辑元件”。图4-5“弹起”时效果“鼠标经过”时效果“按下”时效果要求：将实训1至实训3所制作的元件从库中拖放到舞台上，将实训3转换为图形元件。实训4：实例的编辑2《FlashCS4动画制作教程》第5章逐帧动画动画的原理；帧的概念、分类和基本操作；逐帧动画的创建。本章主要内容：2《FlashCS4动画制作教程》第5章逐帧动画任务导入任务一：制作“奔跑的豹子”动画要求：制作一只豹子奔跑运动（设计效果如下图5-1所示）。图5-12《FlashCS4动画制作教程》第5章逐帧动画任务导入任务二：制作“倒计时效果”动画要求：制作在一个红色圆角矩形背景下显示“5、4、3、…1、GO！”的倒计时动画效果（设计效果如下图5-2所示）。图5-22《FlashCS4动画制作教程》第5章逐帧动画任务导入要求：制作花盆中的花儿逐渐成长，并生成一朵花的动画效果（设计效果如下图5-3所示）。任务三：制作“花逐渐成长的过程”动画图5-32《FlashCS4动画制作教程》第5章逐帧动画问题与思考动画的基本原理是什么？如何创建逐帧动画？什么叫帧？帧分为几种类型？如何操作帧？问题与思考：2《FlashCS4动画制作教程》第5章逐帧动画知识点5.2.1动画基本原理动画就是通过连续播放一系列