第3章创建时间轴.ppt
86页本章学习内容,3.1 元件,元件的类型,图形元件:可用于静态图像,与主时间轴同步运行 按钮元件:通过事件来激发它的动作按钮元件有四种状态,即“弹起”、“指针经过”、“按下”、“点击” 影片剪辑元件 :本身就是一段小动画,可以包含交互控制、声音甚至嵌套其他影片剪辑的实例,是用途和功能最多的元件,3.1 元件,元件的有效利用,同一图层的元件如何分散至不同图层: 执行命令:“修改”“时间轴”“分散至图层” 注意分散至图层后的特点 不同文件间共享元件 注意将元件分门别类地放好,可以在库面板新建文件夹,3.1 元件,建立元件,,,将现有的矢量对象转换成元件 (快捷键:F8),,,,建立元件的方法,使用元件编辑模式新建元件 (快捷键:Ctrl+F8),3.1 元件,建立元件,建立元件中要注意的细节 元件左上角对准中心十字,3.1 元件,修改元件,修改与编辑元件,必须进入元件模式下才能进行 切换到元件编辑模式的方法 在舞台上,双击元件实例 在库面板中,双击元件名 在库面板对元件右键 / 编辑 注意:在元件编辑模式下进行的更改会影响该元件的所有实例,3.1 元件,复制元件,创建元件后,用户可以在文档中重复使用该元件的实例。
修改元件会影响到其每个实例,但改变实例的大小不会影响其它实例或原始元件 复制元件实例的方法是:在按下“Alt”键的同时用鼠标将待复制的元件拖动出一个副本,即可创建该元件的另一个实例 复制元件的方法是:在库面板中单击鼠标右键,在出现的快捷菜单中选择“直接复制”命令,即可创建元件的副本3.1 元件,元件的存放处——库,公用库面板:窗口/公用库 库 如何将库里的元件加入舞台,3.1 元件,3.2 时间轴面板,,,,,,,1,动画中的图层,动画中的图层,当用户创建动画时,可以使用图层和图层文件夹来组织动画序列的组件和分离动画对象,这样它们就不会互相擦除、相连或分割 Flash的舞台在同一时间做多个对象的动画,每个组或元件等舞台对象必须在独立的图层上3.2 时间轴面板,图层的操作,重命名图层,3.2 时间轴面板,时间轴面板,3.2 时间轴面板,,帧的类型,空白关键帧,,3.2 时间轴面板,不同性质的帧的区别,关键帧在时间轴上显示为实心的圆点,空白关键帧在时间轴上显示为空心的圆点,普通帧在时间轴上显示为灰色填充的小方格,3.2 时间轴面板,,,,不同性质的帧的区别,同一层中,在前一个关键帧的后面任一帧处插入关键帧,是复制前一个关键帧上的对象,并可对其进行编辑操作 如果插入普通帧,是延续前一个关键帧上的内容,不可对其进行编辑操作 插入空白关键帧,可清除该帧后面的延续内容,可以在空白关键帧上添加新的实例对象。
关键帧和空白关键帧上都可以添加帧动作脚本,普通帧上则不能添加,3.2 时间轴面板,3.3 逐帧动画,逐帧动画是一种常见的动画形式(Frame By Frame),其原理是在“连续的关键帧”中分解动画动作,也就是在时间轴的每帧上逐帧绘制不同的内容,使其连续播放而成动画技术点睛,逐帧动画是flash动画最基本的形式,是通过更改每一个连续帧在编辑舞台上的内容来建立的动画因为逐帧动画的帧序列内容不一样,不但给制作增加了负担而且最终输出的文件量也很大 逐帧动画的优势:逐帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容,而它类似与电影的播放模式,很适合于表演细腻的动画 通常第一个关键帧会在空白舞台上第一个实例生成时会自动生成,但第二帧以后的关键帧需要手动添加3.3 逐帧动画,例子:人物表情变化——微笑点头,3.3 逐帧动画,影片剪辑元件中逐帧动画的运用,影片剪辑元件拥有它们自己的独立于主时间轴的多帧时间轴,如果针对影片剪辑元件进行逐帧动画制作,则可以拥有一个独立于主时间轴的动画元件 例子:蝴蝶,3.3 逐帧动画,技术点睛,如何选择多个帧 复制帧 粘贴帧 时间轴上的快捷菜单,3.3 逐帧动画,“Deco工具”是一种图案装饰性工具,它主要包括3种模式:,利用Deco工具生成逐帧动画,3.3 逐帧动画,网格填充,选择“Deco工具”,在属性面板的“绘制效果”选项卡中的下拉菜单中选择“网格填充”模式,在工作区中单击鼠标,则图案将以网格的方式填充整个区域。
3.3 逐帧动画,对称刷子,选择“Deco工具”,在属性面板的“绘制效果”选项卡中的下拉菜单中选择“对称刷子”模式,在工作区中单击鼠标,则图案将以对称的形式填充整个区域在工作区中出现一个轴线,同时在属性面板的“高级选项”选项卡中的下拉菜单中提供了4种模式,选择不同的模式,图案的对称形式和调整形式也会有所不同,3.3 逐帧动画,藤蔓式填充,选择“Deco工具”,在属性面板的“绘制效果”选项卡中的下拉菜单中选择“藤蔓式填充”模式,在工作区中单击鼠标,则会在舞台中出现树叶和花朵的蔓延过程,在蔓延的图案上再单击鼠标停止填充若是在空白处单击鼠标则继续从单击位置开始填充3.3 逐帧动画,生成逐帧动画,若想将图案蔓延过程生成逐帧动画效果,则需要选择“藤蔓填充模式”,然后在属性面板中勾选“动画图案”的复选框,然后设置动画的帧步骤,然后在工作区中单击,则在时间轴上将以逐帧动画的形式展示图案蔓延过程,3.3 逐帧动画,举一反三,利用关键帧和逐帧动画,可以绘制一把自动展开和折起的扇子!只需要先绘制出一个扇叶,将其做成元件,然后在不同的关键帧上依次放置不同数量的扇叶就可以形成扇子自动张合的动画3.3 逐帧动画,绘制扇子,要点提示: 直线工具 选择工具的灵活应用 任意变形工具 填充工具 滤镜 变形面板,3.3 逐帧动画,绘制扇子步骤,一、建立新文档 点新建-文档,在文档属性里把背景颜色改为黑色,其它默认。
二、绘制扇片元件 1、绘制羽毛,重命名第一个图层为“羽毛”,在工具箱中选择“直线工具“,笔触颜色红色,在场景画一竖线,然后选择“选择工具“(快捷键为“V”)条的中间把线条拉弯 ,在拉弯的线上再画一条竖线同样拉弯形成封闭状的月牙形,如图1,,2、用放射状填充颜色,颜色可自己选择,如选择左色标:#0000FF、右色标:#000000,(注意如填充不了颜色,可使用修改|形状|将线条转换为填充)填充好颜色后把笔触删除 按着Alt键向右复制三个共四个形成一组,然后全部选中,调整大小后,按着Alt键向左复制四个,中间间隔要有一定距离做到可以单独选择一组,然后选择每组改变填充颜色,右色标:#000000不变,左色标可以选择自己喜欢的颜色如图2,,3、选中每一组用方向键向第一组靠拢,形成一个整体用选择工具在羽毛的顶部拉成一个球形,如图3: 4、用“直线”勾画图形,如图4:,,5、删除圆角部分线条外的图形,并删除笔触颜色,再用“选择工具”做细微调整,如图5所示: 6、选中羽毛图层第1帧,在全部选中的情况下右键/转换为影片剪辑元件,在弹出框中选择元件名为“羽毛”,选项中羽毛元件在属性面板/滤镜/按钮“添加滤镜”/模糊,模糊度如图6:,,7、新插入图层二,改名称为扇柄,利用矩形工具画出一个填充色为线型,左右色标:#CC6600,中色标:#FEA64E,用“选择工具”和“部分选取工具”把矩形调整成合适的形状,再放置在羽毛的合适位置,选中整个扇页,转化为图形元件,取名为扇页,到此扇片就制作完毕。
如图7:,,三、绘制扇子 1、选中扇页,用“任意变形工具”调整扇页的中心点,如图8所示: 2、通过“窗口”、“变形”打开变形面板,设置旋转读数为10度,点击变形面板当中的复制并应用变形多次,得到如图9所示:,图层1的第18帧处插入关键帧,选中第1帧至第18帧(如果图中有18片扇片)的所有帧,按【F6】键插入关键帧如图,36,3.3 逐帧动画,扇子的展开,点选扇片图层第1帧,把左边第二片扇片元件按【Delete】键删除,然后用选择工具框选除左边第一片以外的所有扇片元件,保留左边第一片扇片元件,选中第2帧方法同上不同处是保留左边的第一、第二片扇片元件,依此类推,第18帧保留所有的扇片元件37,扇子的展开,3.3 逐帧动画,扇子的合拢:点选扇片图层第1帧,再按住【Shift】键同时点击第18帧即可全选所有关键帧然后右击鼠标出现快捷菜单,选择【复制帧】命令在第30帧处右击鼠标出现快捷菜单,选择【粘贴帧】命令,即可把第1帧至第18帧内容复制到第30帧至第47帧处在第30帧至第47帧全选中的情况下右击鼠标出现快捷菜单,选择【翻转帧】命令,把第1帧到第18帧的状态翻转过来在第60帧右击鼠标出现快捷菜单,选择【插入帧】命令进行延时。
如图,38,3.3 逐帧动画,补间的类型,利用Flash可以处理两种类型的补间效果(过渡): 形状补间 动作补间(传统补间和补间动画),3.4 形状补间,3.4 形状补间,形状补间可将一个简单形状(矢量对象)变形(也可移动/变色) 适用对象:矢量图形对象(合并模式下绘制的) 注意:不能用于元件/组合(群组)对象/文本框 如需应用于文字,先要打散成矢量对象 一个图层中允许多个对象应用形状补间形状渐变制作气氛背景,颜色和形状变换 多环变换 灯光移动,3.4 形状补间,利用形状提示符实现翻页特效,关键技术:书页的翻动要沿中心轴进行,实现的技巧:添加形状提示符,3.4 形状补间,技术点睛,形状提示符与形状补间相互配合可以起到约束调整矢量对象形状变化的作用,在制作翻书效果,文字书写效果时常常会用到在添加形状提示符时,要特别注意每个提示符的一一对应关系,只有准确设定了关键帧中的形状提示符的位置,才可能达到预想的效果 添加形状提示符快捷键:Ctrl+shift+H,3.4 形状补间,3.4 形状补间,用形状补间写“一” (刷子工具),用形状补间写“中” (刷子工具),3.5 传统补间,处理元件、群组或文本框的大小、位置、旋转、透明度等变化。
适用对象:元件、群组或文本框 (如是矢量对象需要转成元件) 注意:一层中不能多个对象同时应用传统补间 策略:分多层一层一个传统补间传统补间实例,图片动作效果,文字特效:晃动文字 飞行文字 渐变文字,3.5 传统补间,传统补间实例,图片动作效果,打字效果— 逐帧动画和传统补间,3.5 传统补间,背景的移动放大效果,两种补间的外观特征总结,形状补间帧至少需要用两个关键帧来标识,它们被带有一个黑箭头和浅绿背景的中间过渡帧分开 传统补间帧至少需要用两个关键帧来标识,这两个关键帧被带有一个黑箭头和浅蓝背景的中间过渡帧分开 有问题的过渡帧,例如丢失了前后关键帧的内容,会用虚线来标识,这时需要取消该次补间动画再重新作3.5 传统补间,技术点睛,形状补间则适合于图形之间的变化(如圆到方的变化),运动的对象只能是矢量图形,不能是元件如果在形状过渡中使用文字,首先需将文本分离打散 传统补间适合于大小、颜色、位置、旋转、透明度等变化,运动的对象必须是元件或是一个对象,不能是矢量图形 导入到库的图形对象传统补间前是无法设置透明度的,只有把图形对象转化成元件才能设置Alpha样式 同一时刻同一层要保证只有一个元件进行传统补间动画设置,否则无法设置动画。
3.5 传统补间,3.6 引导层动画,引导层的功能是可以让元件沿着绘制的行进路线按照设定的方法移动引导层的功能是可以让元件、组合图形、文本沿着绘制的行进路线按照设定的方法移动 案例:蝴蝶飞舞,3.6 引导层动画,技术点睛,本案例中在另外的flash文档中导入了一个蝴蝶的影片剪辑元件可以看出通过库面板,元件得到了共享 引导层动画可以自定义对象运动路径通过在对象上方添加一个运动路径的层,在该层中绘制矢量运动路线,而让对象沿路线运动 引导层上的内容生成swf文档播放时是不可见的3.6 引导层动画,观察一下引导层和对象图层的递归状态,形成如图的隶属状态3.6 引导层动画,案例:星球运动,3.6 引导层动画,技术点睛,本案例中将运动路线复制在另一图层中显示出来,并隐藏和锁定 通过将已画有运动路径的图层转换为引导层,如左图所示,再用鼠标将小球图层拖动到引导层。





