1、第4章 用Flash制作交互型课件,2018/10/8,2,http:/,Flash制作交互型课件,4.1 Flash 8.0 基础知识 4.2 绘图基础 4.3 动画制作及技巧 4.4 元件、实例和库 4.5 制作交互型课件 4.6 声音和视频的编辑 4.4 动画的输出,2018/10/8,3,http:/,4.1 Flash MX 2004基础知识,Macromedia Flash以便捷、完美、舒适的动画编辑环境,深受广大动画制作爱好者的喜爱,在制作动画之前,我们先对工作环境中的菜单、工具、面板等分别作详细的介绍,包括一些基本的操作方法和工作环境的组织和安排。,1. 初识Flash 2.
2、文档选项卡 3. 时间轴 4. 工具箱 5. 舞 台,6. 常用面板 4. 设计面板 8. 开发面板 9. 其他面板 10. 使用网格、辅助线和标尺,返回,2018/10/8,4,http:/,1. 初识Flash,返回,2018/10/8,5,http:/,2. 文档选项卡,新建或打开一个文档时,在“时间轴”的上方会显示出“文档选项卡”。如果打开或创建多个文档,“文档名称”将按文档创建的先后顺序显示在“文档选项卡”中,单击文件名称,可以在多个文档之间进行快速切换。,文档选项卡,返回,2018/10/8,6,http:/,3.时间轴,“时间轴”用于组织和控制文档内容在一定时间内播放的图层数和帧
3、数。“图层”就像堆叠在一起的多张幻灯胶片一样,每个层中都排放着自己的对象。提到动画,第一个会联想到的是小时候最喜欢看的卡通影片,这些卡通影片,都是事先绘制好一帧一帧的连续动作的图片,然后让它们连续播放,利用人的“视觉暂留”特性,在大脑中便形成了动画效果。 Flash动画的制作原理也一样,它是把绘制出来的对象放到一格格的帧中,然后再来播放。,返回,2018/10/8,7,http:/,4. 工具箱,位于工作界面左边长条形状的就是工具箱,工具箱是Flash最常用到的一个面板,用鼠标单击的方式选中其中的各种工具就可以直接使用。,返回,2018/10/8,8,http:/,5. 舞台,“舞台”位于工作
4、界面的正中间部位,是放置动画内容的区域。这些内容包括矢量图、文本框、按钮、导入的位图图形或视频剪辑等。可以在“属性”面板中设置和改变“舞台”的大小。默认状态下,“舞台”的宽为550像素,高为400像素。,返回,2018/10/8,9,http:/,6. 常用面板,Flash MX 2004有很多面板,默认状态下,在“舞台”的正下方有三个比较常用的浮动面板,分别是“帮助”面板、“动作”面板和“属性”面板,单击面板的“标题栏”,可以依次展开它们 。,(1)“帮助”面板,(2)“动作”面板,(3)“属性”面板,返回,2018/10/8,10,http:/,4. 设计面板,打开“窗口”中“设计面板”菜
5、单,在菜单中可以看到所有的“设计面板”,单击 面板的名称,就可以打开或关闭相应的面板。默认状态下,打开的“设计面板”分布 在舞台右侧的面板组中。“设计面板”包括“对齐”面板、“颜色样本”面板、“混色器” 面板、“信息”面板、“场景”面板和“变形”六个面板。,返回,2018/10/8,11,http:/,8. 开发面板,打开“窗口”中“开发面板”菜单,从菜单中可以看到所有的“开发面板”,单击面板的名称可以打开或关闭相应面板。默认状态打开的一些“开发面板”分布在舞台右侧的面板组中。“开发面板”包括“动作”、“组件”、“组件检查器”、“输出”、“调试器”、“行为”和“Web服务”面板。,返回,201
6、8/10/8,12,http:/,9. 其他面板,打开“窗口”下的“其他面板”菜单,从菜单中可以查看到所有的其他面板,单击面板名称可以打开相应的面板。“其他面板”包括“辅助功能”、“影片浏览器”、“历史纪录”、“字符串”和“公用库”面板。,返回,2018/10/8,13,http:/,10. 使用网格、辅助线和标尺,网格、标尺和辅助线可以帮助我们精确地勾画和安排对象,返回,2018/10/8,14,http:/,10.设置舞台的背景和大小、场景的其他操作,2018/10/8,15,http:/,4.2 绘图基础,图形和文字是动画的基础,所以掌握绘图工具的使用对于制作好的Flash作品是至关重要
7、的。,返回,下一页,2018/10/8,16,http:/,4.2 绘图基础-Flash工具箱面板,绘图工具,查看选项,颜色选项,选项部分,返回,下一页,2018/10/8,17,http:/,4.2 绘图基础-应用,4.2.1 绘图和着色 4.2.2 着色与填充 4.2.3 选择与编辑对象 4.2.4 文本编辑 4.2.5 图形导入,返回,2018/10/8,18,http:/,4.2.1绘图和着色 - 1绘制直线,直线“属性”面板,线条样式,提示:在绘制直线的过程中,如果按住Shift键不放,可以画出角度是45倍数的直线,如水平、垂直、45度、135度的直线。,返回,下一页,2018/10
8、/8,19,http:/,4.2.1绘图和着色 - 2铅笔工具,铅笔模式,伸直模式 平滑模式 墨水瓶模式,返回,下一页,2018/10/8,20,http:/,4.2.1绘图和着色 - 3钢笔工具,能够精确地绘制出直线和曲线路径,并且在绘制完成后,可以进一步调整直线段的角度、长度以及曲线段的弯曲程度。使用“钢笔工具”并配合“部分选取工具 ”的使用,可以精确地绘制出较为复杂的曲线图形。,用钢笔工具绘制直线,用钢笔工具绘制曲线,返回,下一页,2018/10/8,21,http:/,4.2.1绘图和着色 - 4椭圆工具 和矩形工具,提示:选择“矩形工具”时,在“绘图”工具栏下方的“选项”区中,单击“
9、圆角矩形半径”按钮,在弹出的“矩形设置”对话框中设置“角半径”值,然后在舞台上按住鼠标不放并拖动,就可以画出圆角矩形,其中“角半径”的值越大,则矩形圆角程度就越明显。,返回,下一页,2018/10/8,22,http:/,4.2.1绘图和着色 - 5刷子工具,刷子的填充模式中各个选项的含义: 标准绘画:在所绘制的颜色区域中,刷子所到之处会覆盖为刷子的颜色。 颜料填充:所绘制的颜色区域会影响对象的填色内容,但不完全覆盖对象的框线。 后面绘画:在现有填充及笔触的后面进行绘制,不影响对象的填色内容。 颜料选择:只会影响所选取的区域,如果没有选择任何对象,则该模式不影响对象的填色。 内部绘画:把刷子的
10、颜色填入封闭区域中,超出封闭区域的颜色会被自动清除。,返回,下一页,2018/10/8,23,http:/,4.2.1绘图和着色 - 6、橡皮擦工具,橡皮擦工具选项,标准擦除:擦除同一层上的笔触和填充。 擦除填色:只擦除填充,不影响笔触。 擦除线条:只擦除笔触,不影响填充。 擦除所选填充:只擦除当前选定的填充,并不影响笔触(不管笔触是否被选中)。以这种模 式使用橡皮擦工具之前,请选择要擦除的填充。 内部擦除: 只擦除橡皮擦笔触开始处的填充。如果从空白点开始擦除,则不会擦除任何内容。以这种模式使用橡皮擦并不影响笔触。,返回,2018/10/8,24,http:/,4.2.2着色与填充 - 1.墨
11、水瓶工具,墨水瓶工具用来对场景中的线条进行修改,具体使用方法如下:1)单击工具箱中的墨水瓶工具按钮。2)利用“属性”面板设定所需要的颜色,选择合适的线形,然后单击场景中需要修改的线条,此线条的线形及颜色会改变 。,墨水瓶工具的应用,返回,下一页,2018/10/8,25,http:/,4.2.2着色与填充 - 2.颜料桶工具,颜料桶工具能在一个封闭或不封闭的区域中填色。可以用纯色、渐变色或导入的位图图像进行填充,具体使用方法如下:1)单击工具箱中的颜料桶工具按钮。2)利用颜色样本面板选定所需的填充色,然后单击场景中所需要填充的区域,此时,该区域颜色会改变。,颜料桶工具的应用,提示:在Flash
12、中,即使中大缺口,值也是很小的,所以要对大的不封闭区域填充颜色,一般用笔刷,返回,下一页,2018/10/8,26,http:/,4.2.2着色与填充 - 3 .填充效果,一个动画如果没有适当的颜色就无法称之为优秀的动画,所以熟练、恰当地使用混色器面板是做好Flash 动画的前提。具体使用方法如下: 1)选择“窗口”菜单中的“开发面板”子菜单中的“混色器”命令或按快捷键Shift+F9 。 2)在填充类型的下拉列表框中有5个可选选项:无色、纯色、线形、放射状和位图 。,提示:使用位图填充,在填充类型下拉列表中选择“位图”。如果当前尚未导入任何位图,系统将自动打开“导入到库”对话框。选中一个或多
13、个位图文件后,该文件将被自动增加到“混色器”面板中。,返回,下一页,2018/10/8,27,http:/,4.2.2着色与填充 - 4.使用填充变形工具,填充变形工具用于对填充后的颜色进行修改,利用该工具可以方便地对填充效果进行旋转、拉伸、倾斜、缩放等各种变换,具体使用方法如下: 1)单击工具箱中的填充变形工具按钮。 2)选择所要编辑的对象,在填充区域单击,此时将在图形上出现两条平行线,这两条平行线称为渐变控制线,同时,在渐变控制线上还显示了渐变中心控制点、渐变方向控制点及渐变线距离控制点,如图A所示。 3)在“混色器”面板中将填充类型选为“放射状”,然后再工具箱面板中单击颜料桶工具按钮,在
14、所要编辑的对象上单击填充颜色,再次单击填充变形工具按钮,在填充区域单击,此时将在图形上出现一个控制圆,单击并拖动各个控制点,可调整放射状填充效果如图B所示。,返回,下一页,2018/10/8,28,http:/,4.2.2着色与填充 - 5、使用填充变形工具编辑修改位图填充,填充位图的控制点,返回,下一页,2018/10/8,29,http:/,4.2.2 着色与填充- 6、滴管工具,滴管工具用于拾取边线颜色、填充色、位图图形等,然后将拾取的边线和填充类型用于其它图形。在使用滴管工具拾取边线和填充类型时,如果单击的是线条,则滴管工具自动变成墨水瓶工具;如果单击的是填充区域,则自动变成颜料桶工具
15、,以便于填充操作。,返回,下一页,2018/10/8,30,http:/,4.2.2着色与填充-4.绘图实例,实例说明本实例绘制“乡村小屋”图形。该实例充分运用了工具箱中的绘图工具,例如:椭圆工具、矩形工具、线条工具等,并且使用合理的填充方式使“乡村小屋”显得更加逼真。,返回,2018/10/8,31,http:/,4.2.3选择与编辑对象 1、箭头工具,箭头工具用来选择场景中的编辑对象并对其进行修改具体使用方法 如下:,选择填充区域 选择线条 选择某一区域内的对象,选中区域被移动,区域选中,返回,下一页,2018/10/8,32,http:/,4.2.3选择与编辑对象 - 2用箭头修改图形,
16、可用箭头工具修改图形,具体使用方法如下:,提示:在箭头工具中的“选项”里有两种编 辑模式,可以根据自己的需求,进行选择使用。 平滑工具: 利用它可以使曲线变得更加平滑。 伸直工具: 利用它可以使曲线趋于折线。,返回,下一页,2018/10/8,33,http:/,4.2.3选择与编辑对象 - 3 、套索工具,套索工具是一种选取工具,使用的时候不是很多,主要用在处理位图时。选择套索工具后,会在选项中出现魔术棒、魔术棒属性和多边形模式。 具体使用方法如下: 选择“套索工具”,在“选项”里单击“多边形模式”, 根据需要单击鼠标,当得到你需要的选择区域时,双击鼠标自动封闭所选区域。此时我们可以对所选区
17、域进行修改,返回,下一页,2018/10/8,34,http:/,4.2.3选择与编辑对象-4移动、复制和删除对象,1、移动对象 1)直接移动对象 2)移动对象的一部分 2、复制对象1)选定一个或多个需要复制的对象。2)单击鼠标右键,弹出一个快捷菜单,选择“拷贝”命令,将复制对象复制到剪贴板中。3)单击鼠标右键,弹出一个快捷菜单,选择“粘贴”命令,即可完成复制对象。 3、删除对象在Flash 中制作动画,常常需要删除一些不需要的对象,具体操作方法如下:1)选定一个或多个需要删除的对象。2)按下键盘上的Delete键即可删除。,返回,下一页,2018/10/8,35,http:/,4.2.3选择
18、与编辑对象- 4. 组合与分离对象,在制作动画时,场景中可能会同时存在大量的编辑对象,如图形、元件、图像等。对一个对象操作时,可能会影响到其他对象。这时,则可以考虑将其他暂时不进行编辑的对象组合。组合后的对象变成一个大的整体,对其他对象操作时不会影响到已组合的对象。 组合对象最大的特点是:组合后的对象可以作为一个大的整体进行编辑,相当于对单个对象的操作;组合后有利于对象的移动,在移动过程中不会改变组合对象的相对位置。,返回,下一页,2018/10/8,36,http:/,4.2.3选择与编辑对象 -5对齐对象,选择“窗口” 菜单中的“排列”菜单命令或按快捷键Ctrl+K, 打开对齐面板。,对齐
19、面板,提示:如果选中“对齐”面板中的“相对于舞台”按钮,则要对齐的对象将以场景为 参照进行对齐排列。,居底对齐的效果,返回,下一页,2018/10/8,37,http:/,4.2.3选择与编辑对象- 6. 变换对象,1)缩放、倾斜与旋转对象在工具箱中单击任意变形工具按钮并选取后,在工具箱下面的选项中有4种选项供我们选择,提示:选择“修改”菜单中的“变形”菜单命令,同样也可以实现对场景中的对象的相关操作。并且还可以对选择的对象进行各种角度的旋转以及水平翻转、垂直翻转等。,返回,下一页,2018/10/8,38,http:/,4.2.3选择与编辑对象 - 4.绘制花朵,实例说明本实例绘制“花朵”图
20、形。该实例充分运用了工具箱中椭圆工具选择工具、任意变形工具等,并且使用合理的填充方式使“花朵”显得更加逼真。 制作步骤,返回,2018/10/8,39,http:/,4.2.4 文本编辑,在Flash中,文本类型有静态文本、动态文本和输入文本三种。,静态文本:是在课件制作过程中创建,而在课件播放时不能改变的文本,主要用于制作固定不变的文字;,动态文本:可以制作需要随时更新的文字,如动态显示时间、试题测试结果等;,输入文本:主要用于实现各种交互功能,如输入圆的半径,则可以计算出相应圆的面积等等。,返回,下一页,2018/10/8,40,http:/,4.2.4 文本编辑-添加文本,1、添加静态文
21、本 2、添加动态文本 3、添加输入文本,返回,下一页,2018/10/8,41,http:/,4.2.4 文本编辑- 设置文本属性,返回,下一页,2018/10/8,42,http:/,4.2.4 文本编辑 - 编辑文本,在文本编辑操作中,包括对文本框及文本框中文字的编辑操作。对文本框的操作常见的有选择、复制、移动、删除等;对文本的操作,与其他文字处理软件相同(如 Word),在这里只对文本的选择进行介绍,其他就不再叙述。,返回,2018/10/8,43,http:/,4.2.5 图形导入,Flash 兼容多种格式的位图图像,在某些情况下,用户除了使用Flash 自身的绘图工具绘制图形,还需要
22、外部的位图图像导入。外部的位图导入到Flash软件后,可以将其转换为矢量图。,返回,下一页,2018/10/8,44,http:/,4.2.5 图形导入- 1导入位图,具体操作方法如下:,4)如果导入对象的文件名以数字结尾,并且此文件后面还有顺序排列的文件,则会弹出如下图所示的提示框,询问用户是否将同一文件夹中一系列文件全部导入。单击“是”按钮,将导入一系列连续的文件;单击“否”按钮,将只导入当前选择的文件;单击“取消”按钮,将取消当前导入操作,不导入任何文件。,1)选择“文件” 菜单中的“导入”菜单命令,选择导入到舞台。 2)在弹出的“导入”对话框中选择一幅图像。 3)单击“打开”按钮,即将
23、选择的图像导入。,提示:用户也可以将其他编辑软件中的图像、文字等对象直接粘贴到Flash中。使用“转换位图为矢量图”功能将位图矢量化后,矢量图形与“库”面板中的源图像将不存在链接关系。,返回,下一页,2018/10/8,45,http:/,4.2.5 图形导入 2、将位图转换为矢量图,在Flash中可以将导入的位图转换为矢量图。位图转换为矢量图后不仅可以方便地删除图像的多余部分,而且还可以压缩文件的大小。,1)单击选择一个位图图像。 2)选择“修改”菜单中的“转为位图为矢量图”菜单命令。 3)在弹出的如图所示的“转为位图为矢量图”对话框中可以进行以下设置 4)设置完毕后,单击“确定”按钮,即可
24、将当前位图矢量化。,将位图转换为矢量图的方法如下:,返回,下一页,2018/10/8,46,http:/,4.2.5 图形导入-设置位图属性,将位图导入到Flash中,无论是否曾使用该位图进行操作,导入的图像均被保存在库文件中,如图4-2-54所示。设置位图属性的具体方法如下: 1)用箭头工具选择位图,此时注意观察“属性”面板,其中在“实例”后显示出该位图的名称。 2)调整高度和宽度。在“宽”文本框中显示位图的宽度,在“高”文本框中显示位图的高度,更改其中的数值可以精确控制位图的大小。 3)控制位图位置。在“X”和“Y”文本框中显示位图的水平和垂直坐标,更改其中的数值可以精确控制位图的位置。
25、4)交换位图。单击“交换”按钮,弹出如图的“交换”对话框,可以使用库中的其他位图交换场景中选择的位图。 5)编辑位图。单击“属性”面板中的“编辑”按钮,可以打开Flash MX 2004默认位图编辑软件,对位图进行编辑。 6)在“属性”面板中对当前选择的位图属性重新定义后,更改后的效果立即反映在工作区域中。,返回,2018/10/8,47,http:/,4.4 元件、实例和库-4.3.1元件,1.认识元件元件是一个图形、按钮或影片剪辑。当元件被创建,它就被放入了该文件的“库”面板中,在使用时只需将元件从“库”面板中拖动到舞台上,就创建了该元件的一个实例。当多次将一个元件从“库”面板中拖动到舞台
26、上,就创建了该元件的多个实例,即利用一个元件可以创建多个实例。,当修改一个元件后,其对应的实例也会随之改变,不需要再逐一修改;但修改舞台上的实例,如缩放、改变颜色效果、旋转、变形等,都不会影响存到“库”面板中的元件。,返回,下一页,2018/10/8,48,http:/,4.4.1元件 2、元件类型,元件的类型可以分为图形、按钮和影片剪辑三种 ,每一个元件都有自己独立的时间轴、图层和舞台。,1)图形元件图形元件用于创建图片和动画片段。 2)按钮元件按钮元件用于响应鼠标动作(如鼠标单击、鼠标滑过等)或按键动作,实现各种交互功能。按钮元件有 4个不同的状态,如包括“弹起”、“指针滑过”、“按下”和
27、“点击”,其中“弹起”表示按钮未按下时的状态;“指针滑过”表示当鼠标指针移动到按钮上时,按钮所表现的状态;“按下”表示在按钮上按下鼠标左键,按钮所表现的状态;“点击”表示按钮可以被鼠标单击的有效范围。 3)影片剪辑元件影片剪辑元件用于创建可反复使用的动画片段,可独立于主动画的时间轴进行播放。,下一页,返回,2018/10/8,49,http:/,4.4.1元件 3、创建元件,一种是利用应用菜单命令:,另一种是直接将舞台上的对象拖动到“库”面板中。,下一页,返回,2018/10/8,50,http:/,4.4.2 元件实例,实例来自于元件,当元件改变时,其对应的实例也会随之改变;而编辑实例,却不
28、会影响“库”面板中的元件。每个元件可以有多个与之对应的实例,每个实例都可以独立编辑,互不影响。,下一页,返回,2018/10/8,51,http:/,4.4.3 库,“库”面板主要用于组织和管理元件,利用它可以对其中的元件重复使用,大大降低了文件的尺寸;另外,还可以与他人共享存于“库”面板中的元件,提高制作效率,丰富素材资源。,在Flash中,“库”面板存储了创建的元件,如图形、按钮和影片剪辑等。另外,导入的视频、声音、位图等素材文件,它们虽然不是元件,但Flash也把它们作为元件处理,可以被重复使用。在每一个Flash文件的“库”面板中,包含了该文件中使用的元件,另外还可以调用其他文件“库”
29、面板中的元件。,下一页,返回,2018/10/8,52,http:/,4.4.3 库 - 1. 显示“库”面板,显示“库”面板的方法:选择“窗口”菜单中的“库”菜单命令(或按Fll键)。,新建元件,新建文件夹,宽库视图,窄库视图,下一页,返回,2018/10/8,53,http:/,4.4.3 库 - 2. 管理元件,“库”面板是组织和管理元件的场所,在该面板中可以创建新的元件、删除元件、重命名元件、复制元件、建立用于元件分类的文件夹等操作。,新建元件,新建文件夹,属性,删除,返回,2018/10/8,54,http:/,4.4.3 库 - 3. 公用库,公用库存放了一些制作过程中常用的元件,
30、为用户提供各种素材,避免了重复制作,大大提高了制作效率。在Flash 8.0 提供了3个公用库:按钮、类和学习交互。另外还可以根据实际需要,收集一些常用素材,将其放入自建的公用库(可以多建几个),在制作过程中随时调用。,返回,2018/10/8,55,http:/,4.4 动画制作及技巧(1),Flash 动画是基于帧构成的,首先将不同的图片放在不同的帧中,然后设置帧的动作行为就可以制作出简单的动画来。Flash 动画一般包括:逐帧动画、渐变动画、遮照层动画和引导层动画。每一种动画的特点都不同。只要熟练掌握各种动画的制作方法,再结合帧的操作和图层操作就可以制作出各种形象生动的动画作品。,返回,
31、下一页,2018/10/8,56,http:/,4.3 动画制作及技巧(2),4.3.1 图层 4.3.2 逐帧动画 4.3.3 形状渐变动画 4.3.4 运动渐变动画 4.3.5 遮罩层动画 4.3.6 引导层动画,返回,2018/10/8,57,http:/,4.3.1 图层 - 1、图层的基本操作,1)新建图层 2)重命名图层 3)选择图层 4)复制图层 5)改变图层的顺序 6)删除图层,返回,下一页,2018/10/8,58,http:/,4.3.1 图层 - 2、图层的状态,返回,2018/10/8,59,http:/,4.3.2 Flash 逐帧动画,逐帧动画是动画的基础。逐帧动画
32、就是将一个连续的动画分解成多个步骤,然后在各个关键帧中制作每一个步骤的动画内容。,返回,下一页,实例演示,实例制作,2018/10/8,60,http:/,4.3.2 逐帧动画 1、帧的基本操作,1)定义关键帧 2)清除关键帧 3)插入帧 4)清除帧 5)复制帧 6)剪切帧,返回,下一页,2018/10/8,61,http:/,4.3.2 逐帧动画,动画原理 逐帧动画是指由许多连续的关键帧组成的动画,制作者在动画的每个关键帧中创建不同的内容,当播放动画时,Flash就会一帧一帧地显示每一帧中的内容。如图所示就是一个逐帧动画,动画中的每一帧都是关键帧。,返回,2018/10/8,62,http:
33、/,实例演示,实例制作,如果不是特别需要,建议不采用逐帧动画的方式。因为逐帧动画的工作量非常大,而且如果技术不熟练,还可能使动画不自然,效果不好。,2018/10/8,63,http:/,逐帧动画特点。,逐帧动画由许多关键帧组合而成,相邻关键帧中的对象变化不大。 逐帧动画中的每一帧都是关键帧,需要用户对每个关键帧中的画面进行控制,工作量很大。 相对于补间动画来说,逐帧动画的体态比较雍肿,文件很大,占用较大的内存。,2018/10/8,64,http:/,4.3.3 Flash - 渐变动画,渐变动画只是要设置动画的起点关键帧和终点关键帧,通过动作属性设置,Flash会自动生成两个关键帧中的过渡
34、关键帧动画。 渐变动画分为两种:一种是渐变动画,另一种是形状渐变动画。,返回,下一页,2018/10/8,65,http:/,与逐帧动画相比,补间动画具有以下几个特点,制作方法简单方便。只需要为动画的第一个关键帧和最后一个关键帧创建内容,两个关键帧之间帧的内容由Flash自动生成,不需要人为处理。 相对于逐帧动画来说,补间动画更为连贯自然。因为逐帧动画是由手工控制,帧与帧之间的过渡很可能会不自然、不连贯,而补间动画除了两个关键帧由手工控制外,中间的帧都由Flash自动生成,技术含量很高,因此过渡更为自然连贯。 相对于逐帧动画来说,补间动画的文件更小,占用内存少。,2018/10/8,66,ht
35、tp:/,4.3.3 形状渐变动画,(1)形状补间动画的概念 在一个关键帧中绘制一个形状,然后在另一个关键帧中更改该形状或绘制另一个形状,Flash 根据二者之间的帧的值或形状来创建的动画被称为“形状补间动画”。 (2)构成形状补间动画的元素 形状补间动画可以实现两个图形之间颜色、形状、大小、位置的相互变化,其变形的灵活性介于逐帧动画和动作补间动画二者之间,使用的元素多绘制出的形状,如果使用图形元件、按钮、文字,则必先“打散”才能创建变形动画。,2018/10/8,67,http:/,(3)形状补间动画在时间帧面板上的表现 形状补间动画建好后,时间帧面板的背景色变为淡绿色,在起始帧和结束帧之间
36、有一个长长的箭头,如图所示。(4)创建形状补间动画的方法在时间轴面板上动画开始播放的地方创建或选择一个关键帧并设置要开始变形的形状,一般一帧中以一个对象为好,在动画结束处创建或选择一个关键帧并设置要变成的形状,再单击开始帧,在【属性】面板上单击【补间】旁边的小三角,在弹出的菜单中选择【形状】,此时,一个形状补间动画就创建完毕。,2018/10/8,68,http:/,4.3.3 形状渐变动画实例1 - 变换的图形,形状渐变包括两种类型,一种是形状的变化,一种是颜色的变化,通常可以将这两种效果综合在一个动画中。,图形与图形渐变效果,提示:形状渐变动画是一种非常灵活的动画,利用形状渐变,可以实现图
37、形导 图形、图形到文字、文字到文字等等之间的渐变,值得注意 的是利用文字渐变时要对文字进行分离操作,否则不能实现渐变的效果。,返回,实例演示,实例制作,2018/10/8,69,http:/,4.3.4 Flash 运动渐变动画,运动渐变动画是渐变动画的另一种类型,它的主要功能是制作场景中元件位移和大小的变化。在Flash 动画中,运动渐变动画运用得最为广泛 动作补间动画可以使对象发生位置移动、缩放、旋转、颜色渐变等变化。这种动画只适用于文字、位图和实例,被打散的对象不能产生动作渐变,除非将它们转换为元件或组合。动作补间动画只对某个图层上单一的对象有效,如果想让一个动画中的多个对象一起动,必须
38、将它们分别放在不同的图层上分别产生动作渐变。,返回,下一页,2018/10/8,70,http:/,4.3.4 运动渐变动画类型,1、位移动画,2、大小变化动画,3、旋转变化动画,返回,实例演示,实例制作,实例演示,实例制作,实例演示,实例制作,2018/10/8,71,http:/,4.3.5 Flash 遮罩层动画,遮罩层是Flash 图层的一种类型,可以通过遮罩层中的图形,看到下层(被遮罩层)中的内容,并且被遮罩层可以是多个。可以对遮罩层中的图形建立动画(除了路径运动动画),制作出奇妙的动画效果。,探照灯效果,1、遮罩层的基本操作,2、探照灯实例,返回,2018/10/8,72,http
39、:/,4.3.5 遮罩层动画 遮罩层的基本操作,A、新建一层,并制作一个填充图形、文字或实例。 B、在需要转化成遮罩层的名称上单击鼠标右键,将弹出快捷菜单,选择“遮罩层”命令,将它变成遮罩层。,创建一个遮罩层,返回,2018/10/8,73,http:/,4.3.5 遮罩层动画实例 -探照灯,实例说明探照灯效果是一种常用的动画特效,它是利用Flash中的遮罩层来制作的,探照灯在黑暗的背景上依次显示文字。利用遮罩层,还可以制作多种特殊的动画效果。如放大镜、滚动字幕等。 制作步骤在这个实例中,至少应该制作三个层,一个是背景层,另一个是文字层,还有一个是遮罩层。,返回,实例演示,2018/10/8,
40、74,http:/,简而言之,引导层就是用来放置元件运动路径的图层。例如:在某层里有一个小圆球,如果想让这个小圆球沿着用户定义的灰色曲线路径运动,就需要用到引导层。引导层中的引导线在输出的SWF文件中是不可见的,即输出后途中的灰线是不可见的,4.3.6 Flash 引导层动画,1、引导层基本操作,2、引导层实例,返回,2018/10/8,75,http:/,4.3.6 引导层动画-基本操作,1、创建一个引导层,1)新建一层“图层1”,在该图层中绘制图形、文字。 2)为“图层1”添加引导层。,层的快捷菜单 插入引导层的菜单命令 插入引导层按钮,2、取消引导层 方法一:用鼠标右键单击层的名称,在弹
41、出的菜单中选择“引导层”命令。 方法二:双击层的名称左端的图标,进入“图层属性”对话框,选择“类型”为“正常”,返回,2018/10/8,76,http:/,4.3.6 引导层动画实例地球公转,实例说明本实例利用Flash引导层来实现地球绕着椭圆轨道做曲线运动。利用引导层,可以制作各种沿曲线路径运动的动画。 操作步骤在这个实例中,至少需要制作三个层,一个背景层,一个引导层,一个被引导层。,返回,实例演示,2018/10/8,77,http:/,4.5交互型课件基础,在欣赏Flash动画时,常常看到飘落的雪花、淅沥的小雨等场景,还有一些Flash小游戏让人们玩得不亦乐乎,其实这些动画很大程度上是
42、依赖Actions语句对动画进行编程而实现的。有些动画甚至根本不需要制作任何动画就可以直接应用Actions语句来实现。ActionsScript实际是一种脚本语言,主要用来对动画进行编程,使用它可以使动画具有交互性,在一些动画中起到画龙点睛的效果。一些Flash初学者可能会问“ActionScript在哪里呢?”,2018/10/8,78,http:/,变量,变量名 变量的类型 变量的作用范围 设置变量,2018/10/8,79,http:/,变量名可以是一个字母,也可以是由一个单词或几个单词构成的字符串,但最好取一个有意义又好记的名字。变量命名时必须遵循以下规则 :,变量名通常以小写字母或
43、下划线开头,当出现一个新单词时,新单词的第一个字母大写,如myName就是一个变量名。 变量名中不能有空格和特殊符号,但可以使用数字。 变量名不能是关键字或逻辑变量,如true和false都是逻辑变量。 变量名在它作用的范围中必须是惟一的。 使用变量时应遵循“先定义后使用”的原则。即在使用变量之前必须先定义这个变量。,2018/10/8,80,http:/,变量的类型,逻辑变量:用于判断指定的条件是否成立,它包括true(真)和false(假)两个值,true表示条件成立,false表示条件不成立。 数值型变量:用于存储特定的数值,如high=300。 字符串变量:用于存储特定的文本信息,如n
44、ame=“猪八戒”。 对象型变量:用于存储对象型的数据,如myTime=newTime()。,2018/10/8,81,http:/,变量的作用范围是指变量能够被识别和应用的区域。根据变量的作用范围,可以将变量分为全局变量和局部变量。全局变量可以在整个Flash动画中所有位置引用,局部变量只能作用于它所在的代码块中,在其他位置中将不能引用它。,2018/10/8,82,http:/,在ActionScript中设置变量的方法很简单。但全局变量和局部变量的定义方法不同。 定义全局变量可以使用等号“=”或set动作来实现,语法格式如下:,变量名=表达式;set(变量名,表达式); 例如:mount
45、=200;set(mount,200) 在这里,创建了一个名为mount的变量,并将其值设置为了200。,在set命名中的变量名,必须用引号将其括起来,如括号里的mount就是用引号括起来的。,2018/10/8,83,http:/,定义局部变量可以通过var语句来实现,语法格 式如下: var 变量名;var 变量名=表达式;例如:var name;var name=sheep;为了帮助大家理解前面所讲的概念,下面举例说明。如下所示的Actions语句的含义是:首先为一个局部变量xscale赋予数值“100”,再将该变量xscale减去数值20,并输出到窗口,运算结果为80。var xscale=100;xscale=xscale-20;trace(xscale);,2018/10/8,