第7讲_Flash形状补间和传统补间动画课件

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,Shanghai University of International Business and Economics,page,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,Shanghai University of International Business and Economics,page,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,Shanghai University of International Business and Economics,page,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,page,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,1,1,第,7,讲,Flash,形状补间和传统补间动画,11第7讲 Flash形状补间和传统补间动画,复习与回顾,帧的概念，类型，编辑方法,图层的概念、类型和操作，影片剪辑,元件的生成和其属性的设置,逐帧动画制作,补间形状动画制作,2,复习与回顾帧的概念，类型，编辑方法2,目的、难点和重点,目的：,掌握,Flash,的补间形状动画制作；,掌握,Flash,的传统补间动画制作；,区分补间形状动画与传统补间动画；,掌握补间形状与传统补间动画综合运用；,了解影片剪辑,重点：,补间形状动画与传统补间动画的区别；,传统补间动画的参数设置：旋转、运动快慢、元件属性的修改等；,分段分层的综合补间动画；,图形元件与实例,难点：,对文字或图形的分离操作,过渡帧与关键帧，如何设置补间动画的关键帧,补间参数的设置,不同补间动画之间的衔接,3,3,目的、难点和重点目的：33,形状提示原理,补间形状动画中，如果要控制复杂或罕见的形状变化，可以使用形状提示来控制形状以什么方式渐变。,形状提示会标识起始形状和结束形状中添加相对应的“,参考点,”，使,Flash,在计算变形过渡时依一定的规则进行，从而较有效地控制变形过程。,形状提示包含字母（,从,a,到,z,），用于识别起始形状和结束形状中的相对应的点。最多可以使用,26,个形状提示。,4,形状提示原理补间形状动画中，如果要控制复杂或罕见的形状变化，,创建形状提示,选择补间形状动画的开始帧，执行“修改,/,形状,/,添加形状提示”菜单命令，该帧的形状上就会增加一个带字母的红色圆圈，相应地，在结束帧形状中也会出现一个“提示圆圈”；,分别用鼠标拖动开始和结束帧上的“提示圆圈”，放置在适当位置，安放成功后开始帧上的“提示圆圈”变为黄色，结束帧上的“提示圆圈”变为绿色；,安放不成功或不在一条曲线上时，“提示圆圈”颜色不变还是为红色。,选择形状提示，点击鼠标右键，可以通过快捷菜单添加和删除形状提示,5,创建形状提示选择补间形状动画的开始帧，执行“修改/形状/添加,课堂示例,1,：翻书,运用形状提示，参考“翻书,-,样张,.swf”,，创建补间形状动画，实现翻书效果动画。,知识点：,形状提示,元件应用,补间形状动画,6,课堂示例1：翻书运用形状提示，参考“翻书-样张.swf”，创,课堂示例,1-,关键步骤,打开“翻书,.fla”,文件,把库中“组件,1”,放入舞台，持续到,60,帧；,创建新图层，把库中“组件,1”,放入该图层,并做水平翻转，与前一个组件合成一本书,再新建图层，该图层在最上面,在第,1,帧和第,60,帧分别放入“元件,1”,和“元件,2”,“元件,1”,在书的右侧，“元件,2”,在书的左侧,创建补间形状动画,选择第,1,帧，添加四个形状提示点,(,提示点颜色为红色,),，将四个提示点调整到书页的四个角落,(,提示点颜色变成黄色,),选择第,60,帧，调整四个提示点，注意要和第,1,帧的提示点对应,(,提示点颜色变成绿色,),导出为“翻书,.swf”,文件,7,课堂示例1-关键步骤打开“翻书.fla”文件7,元件的概念,元件的建立是以,重复使用,为目的的，不但可以将其应用于当前影片，而且可以将其应用于其它影片。,元件中可以包含位图、图形、组合、声音甚至是其它元件。,在,Flash,中创建的所有元件都会出现在库面板中，拖拽库面板中的元件到场景，就可以反复利用元件,每个元件都具有独立的时间轴、工作区和图层，除此以外，每种元件类型都具有独特的属性。,8,元件的概念元件的建立是以重复使用为目的的，不但可以将其应用于,元件的类型,Flash,中包括三种元件类型，分别为图形元件、影片剪辑元件与按钮元件。,图形元件,主要用于定义静态的、,常用的图像符号。,按钮元件,是一种具有交互功能的图形元件，用于响应各种鼠标事件，以实现用户的相应动作。,影片剪辑元件,是,Flash,中应用最为广泛的元件类型，可以将它自身理解成为一个小动画。,在影片剪辑元件中可以制作独立的影片，制作影片的方法与在场景中没有区别。,9,元件的类型Flash中包括三种元件类型，分别为图形元件、影片,创建元件,在,Flash,中，可以通过两种方式,创建,元件，分别为创建新元件与将对象转换为元件。,创建新元件是指直接创建一个空白元件，然后自动进入元件编辑模式，接着在元件中创建和编辑元件中的对象。,将对象转换为元件是指将选定的对象转换为元件，对象可以为任何元素，将对象转换为元件后，即可改变对象的属性。,选择对象，用“修改,/,转换为元件”菜单命令，可以实现元件转换。,10,创建元件在Flash中，可以通过两种方式创建元件，分别为创建,编辑元件,在快捷菜单中选择“编辑”，或双击库面板中的元件，就可进入元件的编辑状态。,元件的修改会直接影响到影片中每一个以它为基础的实例。,11,元件编辑状态,编辑元件在快捷菜单中选择“编辑”，或双击库面板中的元件，就,实例,应用于影片的元件均被称之为实例。,在工作区中选中实例，可以改变实例的尺寸、颜色与元件类型，但这些改动只针对实例本身，不会影响到库面板中的元件。,12,实例应用于影片的元件均被称之为实例。12,课堂示例,2-,瓢虫与花,13,打开“瓢虫与花,.fla”,，利用库中的素材制作瓢虫飞舞的影片剪辑；制作花丛中,5,只大小不一，头部朝向不同的小瓢虫飞舞的动画。,知识点：,掌握制作影片剪辑的方法,区分场景动画与影片剪辑动画,区分实例与元件,进一步理解逐帧动画,参考“瓢虫与花,-,样张,.swf”,课堂示例2-瓢虫与花 13打开“瓢虫与花.fla”，利用库中,课堂示例,2-,关键步骤,打开文件“瓢虫与花,.fla”,“,插入,/,新建元件”创建影片剪辑“瓢虫飞舞”；,利用库中的“瓢虫,1”,、“瓢虫,2”,、“瓢虫,3”,、“瓢虫,4”,元件和逐帧动画方法制作“瓢虫飞舞”；,注意：调整图片位置可以利用“对齐面板”,一定要把“相对于舞台”按钮按下,将库中的“花”元件拖放,3,次到舞台上形成,3,个实例，调整,3,个实例的大小或者进行翻转，得到花丛；,将库中的“瓢虫飞舞”元件拖放,5,次到舞台上形成,5,个实例，调整,5,个实例的大小得到瓢虫群；,保存为“瓢虫与花,.fla”,和“瓢虫与花,.swf”,14,14,课堂示例2-关键步骤打开文件“瓢虫与花.fla”1414,传统补间动画,传统补间动画的概念,传统补间动画给对象在两个关键帧分别定义不同的属性，如颜色、大小、方位、角度等,在两个关键帧之间建立一种变化关系,位移首尾关键帧中元件位置改变,缩放首尾关键帧中元件大小的,旋转,扭曲变形,颜色渐变等首尾关键帧中元件的颜色、,alpha,值等发生改变,传统补间动画的对象通常是元件、组合、文本块等,传统补间动画,在,CS4,以前的版本叫做,动作补间动画或动画补间动画,传统补间动画的特点,只对单一的对象有效，包括影片剪辑、图形元件、按钮、文字、位图、组合等等,分离的对象必须组合或转换成元件才能创建传统补间动画,15,15,传统补间动画传统补间动画的概念1515,创建传统补间动画,传统补间动画的创建步骤,在动画开始处创建一个关键帧，并放入对象,在动画结束处创建一个关键帧，并放入改变属性后的对象,选择两关键帧之间任何一帧，按鼠标右键，在快捷菜单中选择“创建传统补间”命令,或者打开“插入”菜单，选择“传统补间”命令,16,16,创建传统补间动画传统补间动画的创建步骤1616,传统补间动画的表现形式,动画头尾必须是关键帧，两关键帧中间被带有一个黑箭头和浅紫色背景的中间过渡帧分开,(,如图层,1,所示,),如果两关键帧中间的黑箭头变为虚线，代表传统补间动画创建错误,缺少开始或结束关键帧,(,如图层,3,4,所示,),关键帧的对象是分离的,(,如图层,2,所示,),17,17,传统补间动画的表现形式动画头尾必须是关键帧，两关键帧中间被带,传统补间动画的参数,选择传统补间动画中任何一帧，打开传统补间动画的属性面板，设置属性,缓动：使动画加速或减速运动,旋转：实现元件或组的旋转，填入的数值介于,0,到,65535,之间,调整到路径：使元件或组按照指定的路径有方向的进行运动,同步：使影片剪辑元件动画在主动画中能准确的完成循环,18,18,传统补间动画的参数选择传统补间动画中任何一帧，打开传统补间动,设置,Alpha,值,设置,Alpha,值是指设置对象的透明度。,选择对象，通过属性面板中的色彩效果设置,Alpha,值。,19,设置Alpha值设置Alpha值是指设置对象的透明度。19,课堂示例,3,：卡通动画,参考“卡通动画,-,样张,.swf”,制作传统补间动画。,美羊羊由小变大、加速、渐渐出现到地球上,美羊羊在地球上逆时针旋转,1,圈,与此同时地球顺时针旋转,2,周,知识点：,多图层传统补间动画,由小到大、渐渐出现、旋转等效果的实现,20,20,课堂示例3：卡通动画 参考“卡通动画-样张.swf”制作传统,课堂示例,3-,关键步骤,打开“卡通动画,.fla”,地球转动动画设置,在第,1,帧将库中地球元件拖到舞台中央,在第,40,帧插入关键帧,传统补间动画，并设置“旋转”参数，旋转方向为顺时针，旋转圈数为,2,圈,美羊羊跳到地球上动画设置,在第,1,帧将库中美羊羊拖到舞台的左上角，改变大小和水平翻转,在第,20,帧插入关键帧，将美羊羊拖到地球上，改变大小,选择第,1,帧设置,Alpha,值为,19%,创建传统补间动画，并设置“缓动”值为,-100,美羊羊旋转动画设置,在第,40,帧插入关键帧,创建传统补间动画，并设置“旋转”参数，旋转方向为顺时针，旋转圈数为,1,圈,保存为“卡通动画,.fla”,导出为“,卡通动画,.swf”,21,21,课堂示例3-关键步骤打开“卡通动画.fla”2121,课堂示例,4,：卡通动画综合,在课堂示例,3,的基础上，参考“卡通动画综合,-,样张,.swf,”完成动画。,美羊羊绕地球顺时针旋转,1,圈，,美羊羊变成灰太狼，灰太狼又变成“我爱灰太狼”几个字，停留一会,知识点：,多图层分段动画,传统补间动画与补间形状动画的衔接,22,22,课堂示例4：卡通动画综合 在课堂示例3的基础上，参考“卡通动,课堂示例,4-,关键步骤,美羊羊绕地球旋转,1,圈动画设置,在第,41,帧插入关键帧,运用“自由变形工具”，将美羊羊的变形点拖动到地球中心,在第,60,帧插入关键帧,创建传统补