为了正常的体验网站,请在浏览器设置里面开启Javascript功能!
首页 > Flash动画制作综合实例

Flash动画制作综合实例

2014-03-19 28页 doc 1MB 59阅读

用户头像

is_478433

暂无简介

举报
Flash动画制作综合实例7 第14章 Flash动画制作综合实例 教学提示: Flash最主要的功能是制作矢量动画,制作出效果独特且容量很小的Flash动画作品是其主要特色。同时,通过动作(Actions)指令集控制动画的播放、开关音效、制作交互式接口效果、Java网页特效等效果是其另一大特色。这使得Flash不再只是单纯的动画制作软件,而成为交互式多媒体工具、交互式网页制作工具、光盘自动播放画面制作工具。此外,它还可以做出多种格式的动画,不需死记程序语言就能做交互式游戏。 本章介绍了4个Flash动画制作实例,综合运用了Flash的编程语言技术、F...
Flash动画制作综合实例
7 第14章 Flash动画制作综合实例 教学提示: Flash最主要的功能是制作矢量动画,制作出效果独特且容量很小的Flash动画作品是其主要特色。同时,通过动作(Actions)指令集控制动画的播放、开关音效、制作交互式接口效果、Java网页特效等效果是其另一大特色。这使得Flash不再只是单纯的动画制作软件,而成为交互式多媒体工具、交互式网页制作工具、光盘自动播放画面制作工具。此外,它还可以做出多种格式的动画,不需死记程序语言就能做交互式游戏。 本章介绍了4个Flash动画制作实例,综合运用了Flash的编程语言技术、Flash的设置文档属性、制作元件、时间轴、文字工具、测试动画速度等技术。 教学目标:在掌握前面几章介绍的基本操作和基本知识的基础上,本章主要通过几个Flash动画制作的实例,让读者领略Flash的特效动画制作和强大的编程功能,进一步熟悉Flash利用动作语句来制作动画特效的操作方法和独自完成实例创作的能力,加深对Flash动画制作方法的认识和提高。 14.1 星光闪烁的特效实例 大家可以想像这样一种场景:漆黑的夜空中,出现一点微弱的亮光,然后光线慢慢地增强,最后变成许许多多光芒四射的星星,若隐若现,而且,星星可以变换多种形状和颜色,很美的画面吧!如果将这些添加在你的动画中,将是一道非常亮丽的风景线。 14.1.1 设置文档属性 (1) 选择【文件】|【新建】命令,或单击工具栏中的新建按钮 ,新建一个 Flash MX 2004文档。 (2) 为了作图方便,选择【修改】|【文档】命令,打开如图14.1所示的【文档属性】对话框。 图14.1 【文档属性】对话框 (3) 场景大小自定,背景颜色设为黑色,主要是为了增加一种神秘的感觉,而且更能突出光线的效果,与动画设置的环境相搭配。 14.1.2 制作元件 (1) 制作一个球体。新建一个元件,取名为“光球”,行为为“图形”,然后在工具栏里选取圆形工具,在工作区绘制一个正圆形。 (2) 设置颜色效果。选择【窗口】|【混色器】命令,打开【混色器】面板,选择渐变色中的圆形渐变,制作两个滑块的渐变色,其中第一个滑块颜色选取成白色,但Alpha值设置为100,示不透明,最好不要放在最左边,否则,中间的白点就太小;第二个滑块为浅黄色,Alpha值设置成0,即为全透明。这样设置以后,将会达到很好的视觉效果,如图14.2所示。 (3) 用渐变色填充图形,得到如图14.3所示的图形,小球有了放射性的效果。 图14.2 混色器 图14.3 填充图形 (4) 制作光线1。首先设置第一种光线色彩效果,选择矩形工具,并在【混色器】面板中,选择渐变色中的线性渐变,制作4个滑块的渐变色,其中两头的滑块颜色选取成黄色,但Alpha值设置为0,即全透明的黄色。中间滑块的颜色也选取成黄色的,但Alpha值仍设置为80,部分透明,如图14.4所示。 (5) 新建一个元件,取名为“光线一”,选择矩形工具,在黑色背景的电影上任意画一个区域,矩形框高度大概为“1 pixel”左右,此时会有光线的效果。 (6) 制作光线2。首先设置第二种光线色彩效果。按照第(4)步的设置,制作4个滑块的渐变色,其中在两边的滑块颜色设为粉红色,Alpha值为0;中间滑块的颜色设为白色,Alpha值为100,如图14.5所示。 (7) 按照第(5)步的制作方法,制作一个元件,并命名为“光线二”。准备工作到现在都已经完成了,接下来,我们来应用做好的元件,制作另外一个星星的元件。 (8) 新建一个元件,设为“影片剪辑”,并命名为“星星”,直接按Ctrl+L组合键调出元件库,将“光线一”拖入,按组合键Ctrl+Alt+S,弹出对话框,调整它的大小和旋转角度,设旋转角度为20°,如图14.6所示。 (9) 再拖入一条“光线一”,与前一条光线的中心重合,按照同样的方法,旋转角度40°,大小设为不同于前光线,同理再拖入第3条“光线一”,分别旋转40°、50°和80°不等,角度大小均有所变化,如图14.7所示。 图14.4 设置颜色 图14.5 设置颜色 图14.6 调整角度 图14.7 光线一 (10) 新建一图层,在新层中拖入“光线二”,一条旋转90°,一条不旋转角度,并把它们的大小设为比“光线一”大,这样才能重点突出它们,注意中心与前面的光线一致,如图14.8所示。 (11) 再新建一层,将“光球”拖入,调整大小和位置。这样星星的整体形状我们就做出来了,如图14.9所示。 图14.8 光线二 图14.9 星星 14.1.3 制作场景 上小节中的操作只是一个星星的元件,还没有设定动画,下面我们就要制作流星的动画了。 (1) 选择【插入】|【创建新元件】命令新建一个影片剪辑,命名为“运动的星星”,按Ctrl+L组合键调出元件库,把刚才做好的星星拖放到工作区中心,注意和十字重合,如图14.10所示。 (2) 选取这个星星,运用工具栏中的 工具把这个星星放大,然后在第20帧按F5键,插入一个普通帧,并且锁住这个层。 (3) 再新建一个图层,从元件库中拖入一个星星,放在刚做好的那个大星星的中心,再在第20帧按F6键插入一个关键帧。 (4) 把第20帧的那个星星拖到大星星的一个角上,再把这个星星的透明度设为 40%,返回第一帧设为“运动渐变”动作,如图14.11所示。 图14.10 拖动元件 图14.11 建立星星的动画 (5) 再新建一个层,把第二层第1帧的星星复制到第三层的第1帧,这样做是为了使星星能重合,按照第二层的做法把它设为运动渐变,这次要把第20帧的星星放到大星星的另一个角上,依次做好五个层的运动星星,如图14.12所示。 (6) 把那个大星星层连同星星一起删除,因为我们只是用它来起辅助作用的。 (7) 选择【插入】|【创建新元件】命令再新建一个影片剪辑,命名为“运动”,现在是设流星的运动路径。本实例中用的是一个椭圆,你也可根据目的的不同画出不同的动运路径。在第100帧按F5键插入一个帧,然后锁定这个层,如图14.13所示。 图14.12 建立五个星星层 图14.13 绘制椭圆形 (8) 新建一个层,把刚才做好的那个“运动的星星”元件拖到第1帧,中点对好运动路径的开头,再在第20帧按F7键,这样“运动的星星”做完了20帧的运动后就会停下来,如图14.14所示。 (9) 新建一个层,在第2帧按F7键,然后把“运动的星星”拖到第2帧,这颗星一定要放到第一颗星的后面,中心对好运动路径,再在第21帧按F7键,如图14.15所示。 (10) 新建一个层,在第3帧按F7键,然后把“运动的星星”拖到第3帧,这个星星放在第二个星星的后面,中心也要对好运动路径,然后在第22帧按F7键。依照这样的方法把星星依次排成你设定的运动路径。 图14.14 建立第一颗运动星星 图14.15 建立新层 (11) 最后把第一层的运动路径删除掉,如图14.16所示。 图14.16 建立星星图层 (12) 最后你把“运动”的影片剪辑拖放到绘制的背景图上,按Ctrl+Enter组合键观赏动画,如图14.17所示,有了闪烁的星星做装饰,画面显得很丰富多了! 图14.17 将元件拖拽到背景图 14.2 控制动画鱼影片的实例 在这个练习当中,可以用四个不同的按钮分别来控制动画鱼的身体各个身体部件的运动。 14.2.1 设置文档属性 (1) 选择【文件】|【新建】命令,或单击标准工具栏中的新建按钮 ,新建一个Flash MX 2004文档。 (2) 选择【修改】|【文档】命令,打开【文档属性】对话框。 (3) 场景大小设置成400像素×500像素,背景颜色设为白色,主要是为了看清楚动画的运动,如图14.18所示。 图14.18 【文档属性】对话框 14.2.2 制作元件 (1) 新建一个影片剪辑,命名为“身体”,在元件编辑区绘制一个鱼的图形,如图14.19所示。 (2) 在第4帧插入一个关键帧,然后将鱼的头部图形改变,将它的嘴巴张开,然后将帧延长到第6帧,如图14.20所示。 图14.19 绘制图形 图14.20 插入关键帧 (3) 新建一个影片剪辑,命名为“背鳍”,在元件编辑区绘制一个背鳍,注意要让中心点对准背鳍图形的角部,如图14.21所示。 (4) 在第4帧插入关键帧,然后旋转并变形背鳍,将帧延长到第6帧,如图14.22所示。 图14.21 绘制背鳍 图14.22 旋转并变形背鳍 (5) 新建一个影片剪辑,命名为“胸鳍”,然后在元件编辑区绘制一个胸鳍的图形,如图14.23所示。 (6) 在第4帧插入关键帧,将胸鳍旋转并变形,将帧延长到第6帧,如图14.24所示。同样,新建一个影片剪辑,命名为“腹鳍”,然后在元件编辑区绘制一个腹鳍的图形,在在第4帧插入关键帧,将腹鳍旋转并变形,将帧延长到第6帧。 图14.23 绘制胸鳍 图14.24 旋转并变形胸鳍 (7) 新建一个影片剪辑,命名为“动画鱼”,在时间轴建立四个图层,分别命名为“身体”、“胸鳍、“背鳍”、“腹鳍”,然后从元件库中将鱼的元件拖拽到元件编辑区,分别对应放在四个图层上,最后组合成完整的鱼图形,如图14.25所示。 (8) 新建一个按钮元件,命名为“普通按钮”,在编辑区制作一个按钮,在这里为了使读者能够看得更清楚,我们使用一个不加修饰的长方形按钮,根据自己的喜好,在“指针经过”、“按下”、“点击”状态时插入关键帧,并设置颜色,如图14.26所示。到这里,所有的元件都制作完了。 图14.25 鱼元件 图14.26 普通按钮 14.2.3 制作场景 (1) 回到主场景中,现在的主场景是一片空白,将图层命名为“动画鱼”,从元件库中将“动画鱼”的元件拖拽到场景中央,如图14.27所示。 (2) 新建一个图层,命名为“身体按钮”,从元件库中将“普通按钮”元件拖拽到场景中,放在如图14.28所示的位置上,并在按钮下面输入“身体控制”。 图14.27 拖拽元件 图14.28 拖拽按钮 (3) 用同样的方法,建立新层“背鳍按钮”、“胸鳍按钮”及“腹鳍按钮”,然后在图层上放置普通按钮元件,并输入对应文字“背鳍控制”、“胸鳍控制”及“腹鳍控制”,如图14.29所示。 (4) 用鼠标单击动画鱼元件,将它选取,然后选择【窗口】|【属性】命令,打开【属性】面板,在实例名称标签栏里输入“fish”,这样,就将实例的名称设置为fish了,如图14.30所示。 图14.29 建立新层 图14.30 输入名称 (5) 双击动画鱼元件,进入到元件编辑区内,可以看到动画鱼被分为四层,每一层分别放置着动画鱼的身体各个部位的元件。 (6) 单击身体的元件,将其选取,然后打开【属性】 面板,在实例名称标签栏里输入“body”,这样就指明了实例名称,如图14.31所示。 (7) 按照上述方法,分别将“胸鳍”、“背鳍”和“腹鳍”分别命名为“sidefin”、“topfin”和“minfin”。 (8) 单击“场景1”回到主场景,新建一个图层,命名为“动作”。 (9) 选取动作层的第1帧,选择【窗口】|【开发面板】|【动作】命令(快捷键为F9),选取动作命令打开面板,在面板里加入下列语句,如图14.32所示: topfinFlag=0; sidefinFlag=0; bodyFlag=0; minfinFlag=0; 图14.31 输入名称 图14.32 加入语句 此变量的作用是记忆按钮的状态。例如,单击胸鳍按钮时,如果胸鳍在动的话,就停止;如果胸鳍处于静止状态,就让它动起来,它是一个记忆各部分是否处于动态的变量。将各个按钮的Flag状态值的初始值设置为0,则相应的实例处于动态;变量为1,则处于静止状态。 (10) 选取胸鳍控制的按钮,给这个按钮加入下列动作语句,如图14.33所示。 图14.33 给控制胸鳍的按钮加命令 // 每次单击时停止或播放指定的Instance on (release) { if (sidefinFlag == 0) { //在当前位置停止sidefin实例的帧播放 this.fish. sidefin.stop(); sidefinFlag = 1; } else { //在当前位置播放sidefin实例的帧 this.fish.sidefin.play(); sidefinFlag = 0; } } 由on(release)指定按钮处理程序,使单击鼠标时执行动作。先检查变量sidefinFlag,如果为0,则停止sidefin实例的帧,如果为1,则重新播放,按下的时候如果处于停止状态,那么放开的时候就重新播放。 (11) 按照这个原理,给下面两个按钮添加命令,如图14.34和图14.35所示,四个按钮的动作结构基本上相同,只不过变量和播放、停止实例方面有所变化。 (12) 同理,给腹鳍控制加上动作语言。 (13) 到这里,按钮控制不同影片片段的动画就制作完了,按Ctrl+Enter组合键预览动画,单击四个蓝色按钮,可以看到动画鱼先是乱动,然后停止,再按一次按钮就又开始乱动了。 图14.34 给控制背鳍的按钮加命令 图14.35 给控制身体的按钮加命令 14.3 制作金属小球跟踪鼠标 在Flash中,利用动作语言,能制作出许多变化多姿的鼠标效果,鼠标将再也不是我们以前所见的样子,它将以一种崭新的姿态出现在我们的眼前,像是具有了灵性。将这些鼠标动画用在个人网站上,将能增加许多很酷的动感效果,下面将介绍常用的鼠标效果。 在本实例中,只要在屏幕上拖动鼠标即可以看到鼠标周围有一连串的带有金属质感的小球旋转的动画效果。 14.3.1 设置文档属性 (1) 选择【文件】|【新建】命令,或单击标准工具栏中的新建按钮 ,新建一个Flash MX 2004文档。 (2) 为了作图方便,选择【修改】|【文档】命令,打开如图14.36所示的【文档属性】对话框。 图14.36 【文档属性】对话框 (3) 将尺寸选项区的宽设为550像素,高设为400像素(图中在数字之后以px表示像素),单击【确定】按钮。 14.3.2 制作元件 (1) 新建一个元件,输入元件名称“小球”,行为选择【图形】单选项,再单击【确定】按钮。 (2) 使用工具箱中的椭圆工具,绘制一个带有金属质感的球体,并将其定位到“十”字处,如图14.37所示。 图14.37 绘制小球 (3) 再次选择【插入】|【新建元件】命令,添加一个按钮类型的元件,并将其命名为【按钮】。 (4) 单击帧插入一个空白帧,再次选择工具箱中的椭圆工具,绘制一个同金属球一般大小的圆,并且以另外一种颜色填充,注意,可以使用显示参考线进行绘制,确保大小一样,如图14.38所示。 (5) 按Ctrl+F8组合键,添加一个影片片段,并将其命名为【动画】,再单击【确定】按钮。 (6) 按Ctrl+L组合键,快速启动Library面板,将按钮元件拖放到“十”字处,如 图14.39所示。 图14.38 绘制圆形 图14.39 拖拽元件 (7) 单击第2帧,然后按F7键,插入一个空白帧,将【小球】元件拖放到“十”字处,如图14.40所示。 (8) 单击第10帧,然后按F6键,插入一个关键帧,将该帧内的小球向下移动一段距离,如图14.41所示。 图14.40 拖动元件 图14.41 移动元件 (9) 选择【窗口】|【变形】命令,打开【变形】面板,输入按图14.42所示的数值,再单击 按钮,就可以将小球变形,变形的小球如图14.43所示。并将第二个浮动层没有变形的小球删除。 图14.42 输入数值图 图14.43 变形的小球 (10) 单击选取第2帧,然后打开【属性】面板,在【补间】下拉列表框中选择【动作】选项,在旋转下拉列表中选择【顺时针】选项,并在次数文本框中输入数值2,即表示将小球顺时针旋转两圈,如图14.44所示。 图14.44 设定选项 (11) 单击第20帧,然后按F6键,插入一个关键帧,删除该帧内的小球,然后从元件库当中重新拖动一个小球元件到“十”字处,如图14.45所示。 (12) 选取该帧小球,在【属性】面板中,将【透明度】的值设置为0,然后选取第10帧,在第10帧与第20帧之间建立一段运动渐变动画,如图14.46所示。 图14.45 拖动元件 图14.46 建立Motion动画 (13) 接下来,选取第1帧,打开【动作-帧】面板,选择【全局函数】|【时间轴控制】命令展开列表,然后双击Stop选项,为该帧加入帧行为,如图14.47所示。这样,影片一开始就会停止在第1帧上面。 (14) 单击选取第1帧内的按钮元件,然后输入以下命令: on(rollOver){ gotoAndPlay(2); } 意思是鼠标跳到该按钮上面之后,就跳转到第2帧开始播放,如图14.48所示。 图14.47 加入动作 图14.48 添加命令 14.3.3 制作场景 (1) 单击“场景1”标签,返回到主场景,然后再改变文件属性,如图14.49所示。 (2) 打开元件窗口,将【动画】元件拖动到场景中,然后将其缩放到适当的大小,最后在场景中复制无数个动画元件,并将它们紧密地排列在一起,如图14.50所示。 图14.49 设置属性 图14.50 复制动画元件 (3) 至此,本实例全部制作完毕,按Ctrl+Enter组合键可观看动画播放按钮,如 图14.51所示。 图14.51 动画效果 14.4 编程语言控制鼠标跟随实例 本实例是制作一个Flash的动态鼠标跟随实例。效果图如图14.52和图14.53所示。 图14.52 效果图一 图14.53 效果图二 14.4.1 设置文档属性 (1) 按Ctrl+N组合键,新建一个文档。 (2) 按Ctrl+M组合键,打开【文档属性】对话框,并设置影片的尺寸宽为780像素,高为440像素(图中在数字之后以px表示像素),背景颜色为#99CC33,如图14.54所示。 图14.54 设置属性 14.4.2 制作元件 跟随鼠标的文字串为“Hi,look at me”,其所包含的文字为a,e,H,i,k,l,m,o,和t。 (1) 按Ctrl+F8组合键打开【创建新元件】对话框。 (2) 将元件命名为“a”,并选择元件的行为为“影片剪辑”。 (3) 选择【文字】工具,在元件“a”窗口中输入文字a,并设置其字体为“Comic Sans MS”,大小为20,颜色为红色,如图14.55所示。 (4) 重复步骤(1)~(3),分别建立元件e,H,i,k,l,m,o, t和一个空元件dummy(即什么也没有)。 (5) 按下Ctrl+L组合键打开【库】面板,在【库】面板中,按下 按钮,新建一个目录Letters。并把刚新建的所有元件拖动到目录中去,如图14.56所示。 图14.55 输入文字 图14.56 【库】面板 (6) 按Ctrl+F8组合键打开【创建新元件】对话框。 (7) 将元件命名为“period”,并选择元件的行为为“影片剪辑”。 (8) 在元件period编辑窗口中单击时间轴的第5帧,按“F6”键插入一个关键帧。 (9) 选择文本工具,输入一个“.”号。 (10) 单击时间轴第10帧,按F6键插入一个关键帧。 (11) 选择文本工具后,单击刚插入的“.”号,然后在其后面插入一个“.”号。 (12) 单击时间轴第15帧,按F6键插入一个关键帧。 (13) 选择文本工具后,单击刚插入的“.”号,再在其后面插入一个“.”号。 (14) 单击时间轴第20帧,按F5键插入一个帧,时间轴如图14.57所示。 图14.57 时间轴 (15) 单击【库】面板中的 按钮,新建一个目录“dragged object”。 (16) 在【库】面板中的“dragged object”目录里,按Ctrl+F8组合键打开【创建新元件】对话框,新建一个元件“loading dragOBJ”,并选择元件的行为为“影片剪辑”。 (17) 在元件loading dragOBJ编辑窗口中,选取第1帧,打开【动作】面板。 (18) 在【动作】面板中的编辑窗口中输入以下代码: i = 16;//"Hi look at me…"字符串(计算空格在内)共16个元件 a = 5; b = 1.66; k = 12; //替换各元件位置 while (Number(i)>=0) { set ("|trail" add i add ":x_value", getProperty ("|trail" add i,_x)); set ("|trail" add i add ":y_value", getProperty ("|trail" add i,_y)); set ("|trail" add i add ":vx", 0); set ("|trail" add i add ":vy", 0); i = i–1; } //使元件能拖动 startDrag ("|trail0", true); 此时,【动作–帧】面板如图14.58所示。 图14.58 添加代码后的【动作–帧】面板 (19) 单击时间轴第2帧,按F6键插入一个关键帧。 (20) 选取时间轴第2帧,在【动作】面板中输入以下代码: //替换各元件位置 i = 1; while (Number(i)<=16) { set ("|trail" add i add ":vx", (eval("|trail" add i add ":vx")+(eval("|trail" add (i–1) add ":x_value")+k–eval("|trail" add i add ":x_value"))*1|a)|b); set ("|trail" add i add ":vy", (eval("|trail" add i add ":vy")+(eval("|trail" add (i–1) add ":y_value")–eval("|trail" add i add ":y_value"))*1|a)|b); set ("|trail" add i add ":x_value", eval("|trail" add i add ":x_value")+eval("|trail" add i add ":vx")); set ("|trail" add i add ":y_value", eval("|trail" add i add ":y_value")+eval("|trail" add i add ":vy")); i = Number(i)+1; } //重新获得各元件的位置 |trail0:x_value = getProperty("|trail0", _x); |trail0:y_value = getProperty("|trail0", _y); //重新写入各元件位置 i =16; while (Number(i)>=1) { setProperty ("|trail" add i, _x, eval("|trail" add i add ":x_value")); setProperty ("|trail" add i, _y, eval("|trail" add i add ":y_value")); i = i–1; } (21) 单击时间轴第3帧,按F6键插入一个关键帧。 (22) 点击时间轴第3帧,在动作】面板中,单击“+”,选择【全局函数】|【时间轴控制】|gotoAnd Play命令,值设为2,如图14.59所示。 图14.59 【动作–帧】面板 (23) 单击时间轴的第40帧,按F5键插入一个帧,此时,时间轴如图14.60所示。 图14.60 时间轴 14.4.3 制作场景 (1) 在场景中选择【查看】|【网格】|【显示网格】命令。 (2) 按下Ctrl+L组合键打开【库】面板。 (3) 在【库】面板中,选择元件“loading dragOBJ”,并把此元件拖到场景中。 (4) 在场景中选取元件loading dragOBJ,选择【窗口】|【属性】命令打开【属性】面板,在面板的【名称】文本框中输入“trail0”,如图14.61所示。 图14.61 【属性】面板 (5) 重复步骤(3)~(4)操作,并按文字串“Hi_look_at_me…”的顺序把元件拖到场景中。再按递增的顺序在【属性】面板中分别把各元件命名为trail1~trail16。此时,场景如图14.62所示。 (6) 按下Ctrl+A组合键,全选场景中的元件,选择【窗口】|【对齐】命令或是按 Ctrl+K组合键,打开【对齐】面板,如图14.63所示。 图14.62 场景 图14.63 【对齐】面板 (7) 先单击按钮 (或选择【对齐】|【分布场景】命令),然后再单击按钮 (中间垂直对齐),如图14.64所示。 图14.64 排列元件 (8) 单击按钮 (或选择【对齐】|【分布场景】命令),然后再单击按钮 (中间水平分布),如图14.65所示。 图14.65 【对齐】元件 (9) 保存文件,按下Ctrl+Enter组合键预览效果。 14.5 新型菜单实例 本节将制作一个新型的菜单实例,其效果如图14.66所示。 (a)原始状态 (b)按下“Menu2” (c)指针移至“m2” (d)单击“m2” 图14.66 菜单实例效果 14.5.1 设置文档属性 (1) 按Ctrl+N组合键,新建一个影片。 (2) 按Ctrl+M组合键,打开文档属性,并设置影片的尺寸宽为220像素,高为350像素,背景颜色为#0000CC。 14.5.2 制作元件 1. 普通元件制作 (1) 按Ctrl+F8组合键打开【创建新元件】对话框。 (2) 将元件命名为menu1,并选择元件的行为为“图形】。 (3) 选择文字工具,在元件“menu1”窗口中,输入文字“Menu1”,并设置其字体为Lucida Sans Unicode,大小为28,颜色为红色。 (4) 重复步骤(1)~(3),分别建立元件menu2和menu3。 (5) 按Ctrl+F8组合键,打开【创建新元件】对话框。 (6) 将元件命名为“top”,并选择元件的行为为【图形】。 (7) 在元件top编辑窗口中,选择【矩形工具】,设置【描绘颜色】为白色,【填充颜色】为黄色,并打开设置矩形工具的【矩形设置】对话框,设置【边角半径】为60,如图14.67所示。 图14.67 【矩形设置】对话框 (8) 在编辑窗口中,画一个圆角矩形,如图14.68所示。 (9) 设置【角半径】为0,再画一个矩形,并覆盖在步骤(8)中所画的矩形的下半部分,如图14.69所示。 图14.68 圆角矩形 图14.69 再画一个矩形 (10) 选择【选择工具】,单击图14.69中的中间直线,并按Delete键删除此直线,如图14.70所示。 (11) 全选元件top中的内容,按Ctrl+C组合键,进行复制。 (12) 按Ctrl+F8组合键,打开【创建新元件】对话框。 (13) 将元件命名为“bottom”,并选择元件的行为为【按钮】。 (14) 在元件bottom编辑窗口中,按Ctrl+V组合键粘贴元件top中的内容。 (15) 选择箭头工具,全选bottom元件编辑窗口中内容,并使用任意变形工具将图形旋转180°。 (16) 选择【矩形工具】,设置【描绘颜色】与【填充颜色】均为黑色,画一个矩形,矩形的大小与位置如图14.71所示。 图14.70 元件top形状 图14.71 元件bottom (17) 按Ctrl+F8组合键打开【创建新元件】对话框。 (18) 将元件命名为“Test1”,并选择元件的行为为【按钮】。 (19) 在元件Test1编辑窗口中,选择【矩形工具】,设置【描绘颜色】为无色,【填充颜色】为黄色,画一个矩形,其中矩形的长度与元件top的长度一样,如图14.72所示。 (20) 单击时间轴的第1帧,按Ctrl+L组合键打开【库】面板,并将库中的元件menu1拖动到元件Test1中,调整位置,如图14.73所示。 图14.72 绘制矩形 图14.73 添加元件menu1到Test1中 (21) 全选元件Test1编辑窗口中所有元素,并按Ctrl+C组合键复制。 (22) 分别单击时间轴第2、3、4帧,分别按Ctrl+V组合键进行粘贴复制的内容。 (23) 单击时间轴第1帧,选取添加的元件menu1。选择【窗口】|【属性】命令,打开【属性】面板,并将【透明度】效果设置为50%。 (24) 单击时间轴第4帧,选取元件menu1,按下Delete键,将其删除。选择【箭头工具】,再全选矩形,最后设置【描绘颜色】与【填充颜色】均为蓝色。 (25) 重复步骤1(7)~2(4),分别制作元件Test2和Test3。 (26) 按Ctrl+F8组合键,打开【创建新元件】对话框。 (27) 将元件命名为“m”,并选择元件的行为为【按钮】。 (28) 在元件m编辑窗口中,选择【矩形工具】,设置【描绘颜色】为白色,【填充颜色】为#996633,画一个矩形,如图14.74所示。 (29) 全选元件m编辑窗口中的元素,并按Ctrl+C组合键复制。 (30) 分别单击时间轴第2、3、4帧,分别按Ctrl+V组合键进行粘贴复制的内容。 (31) 单击时间轴第2帧,选择箭头工具,全选矩形,设置【填充颜色】为#33FF33;单击时间轴第3帧,选择箭头工具,全选矩形,设置【填充颜色】为#CCCC00;单击时间轴第4帧,选择箭头工具,全选矩形,设置【描绘颜色】与【填充颜色】均为黑色。 2. 影片剪辑元件制作 (1) 按Ctrl+F8组合键打开【创建新元件】对话框。 (2) 将元件命名为“main movie”,并选择元件的行为为【影片剪辑】。 (3) 将图层命名为“top”,按Ctrl+L组合键,打开【库】面板,将元件top拖到元件main movie编辑窗口中,并单击时间轴第90帧,按F6键添加一个关键帧。 (4) 新建图层Test1,将元件Test1拖到元件main movie编辑窗口中,并调整与元件top的位置,如图14.75所示。 图14.74 绘制矩形 图14.75 元件top与元件Test1 (5) 将时间轴设置如图14.76所示。 图14.76 设置时间轴 (6) 重复步骤(4)~(5),分别添加图层Test2,Test3和bottom,如图14.77所示。 (7) 隐藏图层Test2、Test3和bottom,添加图层m。单击图层m中的第10帧,按F6键,插入关键帧,并将元件m拖三次到main movie编辑窗口中。调节元件m位置并添加图层m text,分别在每一个m元件中添加文字,如图14.78所示。 图14.77 添加元件 图14.78 添加元件 (8) 单击m的第10帧,设置元件【行为】为【图符】,并设置其方式为【单帧】。 (9) 单击m的第20帧,按F6键插入一个关键帧,设置元件【行为】为【按钮】;单击m的第21帧,按F6键插入一个关键帧,设置元件【行为】为【图符】,方式为【单帧】;单击m的第30帧,按F6键插入一个关键帧。 (10) 单击m的第40帧,按F6键插入一个关键帧。显示图层Test2,全选三个m元件,并调整位置如图14.79所示;单击m第50帧,按F6键插入一个关键帧,设置元件【行为】为【按钮】;单击m的第51帧,按F6键插入一个关键帧,设置元件【行为】为【图像】,方式为【单帧】;单击m的第60帧,按F6键插入一个关键帧。 (11) 重复步骤(10),设置m时间轴的第70、80、81和第90帧。 (12) 右击图层Test2的第10帧,选择【创建动画动作】。然后单击第20帧,按F6键插入一个关键帧,并将元件Test2移动到如图14.80所示的位置上。 图14.79 调整元件位置 图14.80 移动Test2元件 (13) 重复步骤(10),分别设置图层Test3和图层bottom的时间轴。设置后,时间轴如图14.81所示。 图14.81 时间轴 (14) 添加图层动作s,分别在时间轴的第20、30、50、60、80和第90帧插入关键帧。分别双击时间轴的第1、20、50和第80帧,在弹出的【动作–帧】窗口中输入“stop ();”;分别双击时间轴的第30、60和第90帧,在弹出的【动作–帧】窗口中输入如下代码: tellTarget ("|controller") { play ( ); } stop ( ); 此时的时间轴如图14.82所示。 图14.82 时间轴 (15) 按Ctrl+F8组合键,打开【创建新元件】对话框。 (16) 将元件命名为“control movie”,并选择元件的行为为【影片剪辑】。 (17) 在元件comtrol movie编辑窗口中,分别在时间轴的第1、2、10、11、20、21、30和第31帧插入关键帧。 (18) 选取时间轴的第1、10、20和第30帧,在【动作】面板中输入“stop();”,分别选取时间轴的第2、11、21和第31帧,在【动作】中输入如下代码: tellTarget ("|main") { gotoAndPlay (40); } stop ( ); 14.5.3 制作场景 (1) 在场景中,将图层命名为“Main”。按Ctrl+L组合键打开库,将元件main movie拖到场景中。 (2) 选取元件main movie,在【属性】面板的【名称】中为元件命名为“main”。 (3) 选取时间轴的第1帧,在弹出的【动作】面板中输入如下代码“stop();”。 (4) 在场景中,新建图层Controller,并将库中的元件control movie拖到层Controller中。 (5) 保存文件,按Ctrl+Enter组合键预览效果。 习 1. 填空题 (1) Flash动画制作完成后,生成影片的方法有两种:一种是________,一种是________。 (2) 为了保证影片在网上能够流畅地播出,应该尽量把动画中用到的图片等元素转换成________,尽量多用________,少用________。 (3) 减小音乐的体积,我们可以通过________的方法来对音乐进行压缩。 (4) 在时间轴的右上角,有一个________按钮,单击它可以切换不同的场景。 (5) Flash MX 2004提供了将动画里的任何一张图保存成图片的功能,将帧指示线拉到想要保存图像的位置上,然后单击________菜单中的________命令,可以将图像保存。 2. 选择题 (1) Flash中提供了四种声音播放的方式,选择( )的方式以后,不受时间轴的影响,声音会一直播放完。 A. 事件 B. 开始 C. 停止 D. 流型 (2) Flash可以导入很多种不同格式的声音文件,下列( )声音文件,在Flash当中不能导入。 A. MP3 B. Wav C. rm D. Affi (3) 让导入到Flash文档中的位图进行形状渐变,需要将它转换成矢量图,将位图转换成矢量图的方法是,选择( )菜单下的【转换位图为矢量图】命令,将位图转换成矢量图。 A. 修改 B. 插入 C. 编辑 D. 控制 (4) 在Flash里可以导入动画文件,其中一种是Flash动画,后缀名是( )。 A. .swf B. .png C. .gif D. .wav 3. 判断题 (1) Flash原始工作文件格式是*.fla。 ( ) (2) Flash里的每个场景都拥有自己单独的舞台和时间轴,把一个动画分成几个不同的场景,可以避免时间轴拉得过长,但不方便影片的管理。 ( ) (3) armFlag=0;是变量,作用是记忆按钮的状态,单击翅膀按钮时,如果翅膀在动的话,就停止,如果翅膀处于静止状态,就会让它动起来。 ( ) (4) 以下代码 on(rollOver){ gotoAndPlay(2); } 意思是鼠标跳到该按钮上面之后,就跳转到第2帧开始播放。 ( ) 4. 问答题 (1) 制作星光闪烁实例最基本的步骤有哪些? (2) 制作星光和动画鱼时,为什么要建立影片剪辑? (3) 为什么要单独把动画鱼的各个部件做成影片剪辑? (4) 制作金属球跟踪鼠标运动的实例中,为什么在场景中复制无数个动画元件,并将它们紧密地排列在一起? (5) 利用动作语言制作鼠标跟随效果时,使用了哪些基本的动作语言?
/
本文档为【Flash动画制作综合实例】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑, 图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
[版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。 本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。 网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。

历史搜索

    清空历史搜索