发新话题
打印

[软件技术] 闪了闪了──Flash动画制作一日通

把本帖网址贴到网络上任何地方,同样可以获得推广币和用户等级提升 详情点击这里
http://www.770921.com/viewthread.php? tid=1262&fromuid=0 复制本帖地址
8月活动:积分获大礼活动(实物奖励)
联盟论坛管理人员大招募!

闪了闪了──Flash动画制作一日通

来源:CFAN 

策划:柳絮飞
执笔:木头人  梦与梦寻

  (//引言)当你通晓静态图片的各种处理方法和技巧后,是否又有了让静态图片动起来的渴望?看着时下各种贺岁片风风火火的宣传,是否想过你自己也能自编自导?小小、流氓兔、三国英雄、小破孩……这些红透网络半边天的Flash明星的表演,在让你笑过之后,是否也产生了自己“闪”一把的冲动?自已“闪”,好难哦?其实不难!如果你对Flash这个宠然大物心存恐惧的话,不妨先闯闯CFan的江湖,那里正进行着一个震撼人心的赌约:零起点读者,只要一天就可以学会Flash制作,并能独立设计出多个精美的Flash作品……

  蒙面人:一天?你说只要一天!据我所知,Flash是很难学的,且不说它繁杂的菜单命令、各种功能的面板、丰富多样的工具,但只说它需要一定的绘画功底这一条,就足以吓倒一大片

  柳絮飞:会画画当然更好,没有绘画基础的人,也能做出精采的动画来,绝对没有问题。

  蒙面人:好,跟你赌了。如果你赢了,公费送你去苏杭玩三天;如果你输了,嘿嘿,你从此就得改名叫“柳絮不飞”。

  柳絮飞:公费送我去玩?你有什么权利,难道你是F……

  蒙面人:别管我是谁,正好有两个想学Flash的读者DD和读者MM要来,明天,你负责教会他们吧,要用最新的中文版Flash MX 2004,另外别忘了把用到的所有素材资源及最终文件放到http://www.newhua.com/200502/flash.rar中,我要请其他的读者朋友们来公证……

9:00~9:30  会转眼睛会吐泡泡的卡通鱼

  听说一天就能学会Flash,小美(读者MM)和阿宝(读者DD)都挺高兴,一大早就来找柳絮飞了。

  柳絮飞:鱼会转眼睛么?当然不会!不过卡通鱼会。我先通过这个例子让你们了解一些Flash MX 2004的基本常识,认识一些简单的绘图工具。当然,学习Flash并不一定非要会画画,但是熟悉一下Flash各种绘图工具的使用,对以后制作动画是非常有用的。这个练习做完了,我再带你们到Flash高手那里去学习更有趣的实例。

  第一步:默认情况下,启动Flash MX 2004(以下简称为Flash)时它会打开一个开始页,通过它可以快速创建或打开各种Flash项目,但对第一次学习Flash的人来说,暂且不要使用它,先单击选中开始页下方的“不再显示此对话框”项,会弹出一个对话框提示你如何再次启动开始页,按回车确定后,下次启动时它就不会再出现了。点击菜单命令“文件→新建”,在打开的新建窗口中点选“常规”标签下的“Flash文档”项,单击“确定”后即可创建一个新文档,现在就让我们来认识一下Flash MX 2004的主界面 (见图1,本图要保证文字清楚,可跨栏排)。

闪了闪了──flash动画制作一日通

 

来源:CFAN 

  舞台和工作区:中央的白色区域叫做舞台,只有舞台区域内的对象才能显示在最终动画中,舞台四周的灰色地带是工作区,它就像是舞台的后台一样,不会在最终动画中显示,在这里可以临时存放各种对象、道具等,以方便我们制作动画。

  属性面板:所有的工具都共享同一个面板区域,选择不同的工具时,属性面板里会随之改变为该工具的选项。
 
  时间轴:舞台的正上方即是时间轴窗口,它的左侧是图层窗格,它的右侧则是由许多的小格子组成,每个小格称着一帧。
 
  第二步:现在舞台上还空无一人,就让我们白手起家创建几个演员吧,本例的主角是一条会转眼睛会冒泡泡的卡通鱼。如图2所示步骤,用鼠标按住工具箱中的矩形工具不放,将弹出一个子工具箱,点选其中的多角星形工具,然后在其属性面板中点击“选项”,再从弹出的对话框中将多边形的边数设置为3。在舞台区按下鼠标左键不放并拖动,感觉拖出的三角形大小角度都合适的时候放开鼠标键即可。这个三角形就是卡通鱼的主体了,如果觉得它不够扁,可选择部分选取工具(快捷键A),用它点击一下三角形的边框将显示出三个锚点,拖动锚点即可调整三角形了。

闪了闪了──flash动画制作一日通


小提示

  将光标悬停在工具箱的某一个工具上时,会自动显示出该工具的名称及快捷键,按快捷键可直接跳转到相应的工具上。

  第三步:如果想画一条彩色的鱼,可改变它的填充色。如图3所示,在工具箱底部,单击“颜色”中的“填充色”图标,从弹出色盘中选择一种渐变色,然后点选颜料桶工具,再点击一下鱼的身体(即三角形内部)即可。在空白的地方再画一个小三角形,然后用选择工具全选它(即拖出一个虚线框框住小三角形)之后,拖移到大三角的后面作为卡通鱼的小尾巴。

闪了闪了──flash动画制作一日通


  第四步:接下来该给鱼画眼睛了,点击填充色图标将其设置为白色,然后点选椭圆工具,在舞台空白处拖动鼠标画一个圆圈,将填充色设置为黑色,在刚才的圆里面再画一个圆点,最后用选择工具框选画好的眼睛,再将其拖到合适的位置即可。

来源:CFAN 

小提示

  可以全选画好的卡通鱼,然后按Ctrl+C键复制后,再按Ctrl+V键粘贴并将它拖到其他合适的地方去,然后用任意变形工具全选新复制的鱼,此时选框周边会出现八个锚点,拖动锚点就可以改变复制鱼的大小及比例了,光标移到对角锚点的外侧,将出现一个带箭头的圆环,此时拖动可旋转鱼的角度,同样方法可以复制一群鱼(见图4)。

闪了闪了──flash动画制作一日通


  第五步:下面我们要让卡通鱼吐泡泡了。如图5所示,右击图层1的第30帧,从右键菜单中选择“插入关键帧”;在时间轴窗口左侧单击“插入图层”按钮插入一个新层(即图层2),点选它的第一帧,将填充色设置为白色,然后用椭圆工具在鱼的嘴边画一个小圆圈,右击图层2的第一帧,从右键菜单中选择“创建补间动画”,接着右击图层2的第30帧,选择“插入关键帧”;确保图层2的第30帧为选中状态,用选择工具全选刚才画的小圆圈,并将其移到上面适当的位置,再用任意变形工具将其稍稍放大。此时按下Ctrl+回车键预览一下效果,看,鱼儿是不是吐出了一个泡泡,由下往上,由小变大。同样的方法,你可以多建几个图层多画几个小圈,卡通鱼吐的泡泡就会越来越多了。

闪了闪了──flash动画制作一日通


  第六步:好了,第一个Flash动画就做完了。先点击“文件→保存”把源文件保存起来,以方便以后修改(后缀为“.fla”)。然后再点击“文件→导出→导出影片”,这里生成的才是真正的Flash动画(后缀为“.swf”),注意,在导出SWF文件时,版本最好选Flash Player6,这样未安装新的Flash播放器的用户也能看你制作的动画了。

Just Do It

★什么,卡通鱼的眼睛还没有转起来,其实它的原理与第五步中的吐泡泡是一样的,关键的一点是画卡通鱼的眼睛时,要在新建的图层里进行,不能跟鱼的身体在同一层。这个就请你们自己试试吧。

★Flash工具箱中的工具,像线条、套索、文本、椭圆、多边形、钢笔、铅笔、刷子、颜料桶、滴管、橡皮擦以及手形工具、缩放工具等,与其他图像处理软件(如Photoshop)中工具的使用方法大同小异,完全可以借鉴过来,举一反三。大家可以随便画一些图形,练练手。工具箱最下面的“选项”区是活动的,选取不同的工具时就会显示不同的选项,其中有许多出人意料的功能呢,一定要注意多试试哦。

来源:CFAN 

学习心得

  小美:双击图层的名称再输入字符,可以为图层改名,比如我就把图层1改成了“鱼”,图层2改成了“泡泡”。

  阿宝:1. Flash中的图形好像都是由两部分组成,一个是外框,一个是里面的填充色。比如画好一个圆形后,我用选择工具可以把图形的外框拖到一边去,同样也可以把里面的填充拖到一边。在工具箱的“颜色”区,上面的图标(即笔触颜色图标)控制边框颜色,中间的图标控制图形内部的填充颜色(即填充色图标),如果想画没有边框的图形,或者只要外框不要填充色,可先点选上面的笔触颜色图标(或下面的填充色图标),然后再点击第三行中间的那个图标(带红色斜杠的那个),即可去掉边框或填充色了。

闪了闪了──flash动画制作一日通


  2. 选择工具(黑箭头)与部分选取工具(白箭头)有着很大的区别,前者用来选取各种图形、对象,然后进行复制、移动、删除等操作,后者是用来编辑线框的,通过它拖动线框上的锚点可以将矩形、圆形等修改成任意形状。

9:30~10:30  瑞雪飘飘  E卡传情

  木头人:试想在宁静的原野,大雪飘然落下,炊烟袅袅升起,这是多美的一幅图画啊,在这幅图画中再加上浪漫的话语,就可以当成贺卡寄给自己的亲朋好友了。这个例子中,雪花下落效果是通过引导层动画实现的,下面我就给你们讲解一下。

一、添加背景

  一个好的背景对渲染整体气第二步:点击“文件→导入→导氛很重要,大家可以使用Flash提供的工具自己画,但是那样太累了,可以找一些现存的风景图片导入也行(本文所提供的资源包中包含本例中的背景图片,可在http://www.newhua.com/200502/flash.rar下载)。

  第一步:运行Flash MX 2004,点击菜单命令“文件→新建”创建一个新的Flash文档。

  入到库”,在导入对话框中找到并打开准备好的背景图片(本例中为“背景.png”)。如图6所示,从库面板中将“背景”元件拖入到场景内合适位置(如果库面板没有显示,可按下Ctrl+L键将其调出)。如果“背景”元件和当前舞台场景的大小不符,可使用任意变形工具(快捷键为Q)点选图形,再拖动四周的锚点调整其大小使其完全覆盖整个舞台场景。

二、雪花飘飘

  第一步:执行“插入→新建元件”命令(快捷键Ctrl+F8)插入一新元件,类型设置为“图形”,命名为“flower”后确定,如图7所示。

闪了闪了──flash动画制作一日通


  这时会打开元件编辑区,Flash文档默认的背景为白色,雪花也是白色,容易与背景混淆,可以执行“修改→文档”命令,在弹出对话框中点击“背景颜色”图标打开颜色盘,将背景设置为其他颜色(如黑色)后确定即可。

  在工具箱中单击填充色图标,从弹出的颜色盘中点选白色。接着单击刷子工具,再在工具箱最下方的“选项”区中单击第一个下拉按钮并选择小一点的笔刷,然后在元件编辑区的正中间(十字原点处)画一个不规则的白色圆点,一片雪花就做好了,圆点不能太大,否则就不像雪花了。

来源:CFAN 

  第二步:接下来要让雪花飘起来。执行“插入→新建元件”命令(快捷键Ctrl+F8)插入一新元件,类型设置为“影片剪辑”,命名为“fly”,确定后自动进入“fly”元件编辑区,在库面板中找到刚刚制作的“flower”元件(即雪花)并将它拖到“fly”编辑区中。

  第三步:在图层1的第60帧上点击右键并选择“插入关键帧”。再点击时间轴窗口左下角第二个图标(即“添加运动引导层”按钮,在“插入图层”按钮右侧),为“图层1”添加引导层,此引导层会被自动命名为“引导层:图层1”。
 
  第四步:在新增加的“引导层:图层1”的第1帧上,使用铅笔工具以雪花为起点画一条弯曲的曲线(这条曲线将做为雪花飘落的路径,注意:因为前面我们将背景设置成了黑色,所以这里应在工具箱中将笔触颜色设置为白色,否则铅笔画出的曲线看不到),然后右单击该层的第60帧并选择“插入关键帧”。点选图层1的第60帧,拖动雪花到曲线末尾的点上,接着在“图层1”的第1帧上点鼠标右键并选“创建补间动画”命令。按Ctrl+回车键预览一下效果,“雪花”是不是沿着曲线慢慢滑落了。

  单击“插入图层”按钮新建一个普通图层(将自动命名为“图层2”),注意,如果该图层不在最顶端,可使用鼠标拖动的方法将其放到最上层,然后单击“添加运动引导层”按钮在图层2之上再建一个引导层(自动命名为“引导层:图层2”)。按照上面的方法,再创建一个飘落的雪花。如此反复,可以建立多片雪花同时飘落的效果(见图8)。

闪了闪了──flash动画制作一日通


  第五步:点击编辑条上左侧的“场景1”按钮回到全局场景工作区,点击“插入图层”按钮,右击新图层中的第25帧并选择“插入关键帧”,将影片剪辑元件“fly”拖入场景上方位置,(因为雪是从天上飘落的……),再次拖入,再次拖入,一直拖N 次(N>20)。再分别在第55帧、第95帧、155帧等处右击选择“插入关键帧”命令并将“fly”元件多次拖入其中,注意拖到场景中的位置要产生一定位移变化,否则效果会很单调。好了,此时按下Ctrl+回车键,欣赏一下漫天雪飘的情景吧。是不是后半部分背景图片突然消失,变黑了?那是因为背景所在的图层1的帧数没有新增图层长的原因,可在图层1适当长度的帧上右击鼠标,再选“插入帧”命令即可。

三、文字部分

  既然要做贺卡,祝福的话肯定要说几句的,本例只简单加了一句“瑞雪兆丰年”,你完全可以替换成自己的话。

  第一步:按下Ctrl+F8键新建名为“文字”,类型为图形的元件,选择文字工具(快捷键为T)在场景中单击输入“瑞雪兆丰年”,并在属性面板中设置它的字体、大小、颜色等(你可随意设置),用选择工具框选住所有的文字后按下Ctrl+B键将其打散。

  第二步:点击编辑条左侧的“场景1”回到全局场景编辑区,将“文字”元件拖入,右击元件并从右键菜单中选择执行“时间轴特效→变形/转换→转换”命令。在打开的“转换”对话框中进行相应的设置,其中“效果持续时间、方向、移动减慢”等项默认的设置已经比较适合做特效了,当然你也可根据自己的意愿进行修改,修改后点击“确定”即可。

  好了。Flash动画贺卡制作成功了,点击“文件→保存”保存好源文件,再按下Ctrl+回车键先自己欣赏一下这预兆丰年的瑞雪吧。

Just do it!

★专业的全屏Flash

  有些Flash在播放时会自动全屏,显得又酷又专业,其实它实现起来很简单:

  用鼠标选择任意图层的第1帧,打开“动作→帧”面板,点击“+”选择“全局函数→浏览器/网络→fscommand”,输入“fscommand("fullscreen", true);” (不含中文双引号)便可实现全屏播放,试试吧。

★红叶飞舞

  你可以找一张秋日风景的图片,再找一个红叶的图片,借鉴本例中的方法制作一个红叶飞舞的秋景动画。

学习心得

  小美:可以点击“文件→发布设置”命令,在设置对话框的“格式”标签中,单击勾选“Windows 放映文件(.exe)”项,就可以生成EXE可执行文件了,这样我就不用担心收到贺卡的朋友的电脑中是否安装了Flash Player,或者是Flash Player版本太低而导致的不兼容问题了。勾选“Macintosh 放映文件”项还能把生成的贺卡发给使用苹果机的朋友看呢。

来源:CFAN 

小知识:

★Flash动画的类型

Flash动画基本上分三种类型。

  1. 逐帧动画(Frame by Frame):这是采用的传统动画的制作方式,是把要表现的动态分解成一个个的动作,然后一个动作一个动作的绘制,最后连续播放的时候就形成动画了。逐帧动画不仅制作费时,而且文件所占空间也非常大。

  2. 补间动画(Tweened):这种动画充分利用了电脑快速计算的优势,它只需要绘制出动画的开始动作及最后一个动作,之间的过程则由电脑自动计算得出,省时省力,文件所占空间也小。Flash中的补间动画又分为以下两种:

   动作补间(Motion Tweening):适合于做移动、缩放、旋转、自定义路径移动(本例中的雪花飘落即是使用的这个方法)、色彩渐变等动画,可应用于实例、群组、文字等对象。

   形状补间(Shape Tweening):它可以完成动作补间的大部分效果,它的最大特色则是形状渐变,比如从圆形过渡变成正方形等,但它只能应用于图形元件。

  3. 时间轴特效(Timeline effects):这是Flash MX 2004中新增的特性,它实际上是由一些预定义的脚本创建的,可以自动产生各种动画效果,而无须使用者手工操作。本例中显示的文字即是使用的这种方法。

★元件、实例、库

  打个比方来说,元件就是一个模具,实例就是用这个模具拓出来的一个个实际的物体,而库则是存放与管理各种元件的仓库。创建了一个元件之后,就可以在动画中的任意地方多次使用,所有的实例都只是元件的一个化身,是对元件的引用,每创建一个实例,软件只需要记录下它的尺寸、位置、比例、颜色等信息就可以了,所以创建再多的实例,也不会使文件变得很大。如本例在场景中拖放了N多个雪花剪辑,但实际上只是一个元件而已。

10:30~11:00  雪人笑了

  木头人:接下来的这个例子,就是形状补间动画的一个最好说明,我们将做一个会微笑的雪人,它的嘴开始的时候只是一个点,慢慢的变成咧嘴大笑。

  第一步:新建一个空白的Flash文档,执行“文件→导入→打开外部库”命令导入一张雪人图片,如果你没有合适的图片,可以下载本文所提供的资源包,导入其中的“微笑雪人.fla”文件。

  第二步:从库面板中将名为“雪人”的影片剪辑拖入场景中。你会发现这个雪人是没有嘴巴的,我们就来给它做一个咧开嘴巴笑的动画吧。

  第三步:点击时间轴左下方的“插入图层”按钮新建一图层,然后点击工具箱中的椭圆工具(快捷键为O)在雪人脸上合适的位置拖画出一个小椭圆作为雪人闭嘴时的样子(见图9)。

闪了闪了──flash动画制作一日通


  第四步:鼠标右键点击图层1的第40帧选择“插入帧”命令,再右击图层2的第40帧选择“插入空白关键帧”命令,并在这一帧上用工具箱中的铅笔工具画出一个大笑的嘴(封闭的口字形状)。

来源:CFAN 

  第五步:用鼠标左键点选图层2的第1帧,再在属性面板中,将“补间”项设置成“形状”,这时你会看到时间轴中出现了由第1帧通向第40帧的实心箭头。好了,一切搞定,按下Ctrl+回车键来欣赏一下雪人快乐的微笑吧(见图10)。

闪了闪了──flash动画制作一日通


学习心得

  小美:如图10所示,点选第一个绘图纸外观按钮,则前后相邻的几个帧变得就像是透明的胶片叠在了一起,这样在给雪人绘制两种状态的嘴形时很容易对上位置。在时间轴下其他几个不同类型的绘图纸外观按钮,也能很好地帮助我们对齐不同帧上的图形对象。

  阿宝:点选铅笔工具后,单击工具箱下方“选项”区中的下拉按钮可以为铅笔设置不同的状态,我在给雪人画微笑的嘴时,使用了中间的“平滑”,画出的线条柔和平滑多了。

13:30~14:30  欢迎进入Flash闪客世界

  木头人:站在城门前,两扇红漆大门牢牢地拦住了你的视线,单击右下角的机关按钮,城门向两旁慢慢打开,露出城内的风景……这个实例是对位移动画最好的说明,涉及到简单的ActionScript脚本。

  第一步:运行Flash,新建一个空白的Flash文档,在默认图层1的第1帧中通过“文件→导入→导入到舞台”命令将一幅故宫内城风景画导入到当前场景中,并在图层1的第70帧上右击,选择“插入帧”。

  第二步:点击“插入图层”按钮插入图层2,通过“文件→导入→导入到库”命令将素材文件(左侧、右侧城门的图片)导入库中,然后从库面板中将左侧城门图片拖到图层2第1帧的场景上。

  第三步:由于一个图层内同时能产生动画的只能有一个元件,所以我们还需要新建一个图层3,将右侧城门图片拖入图层3的第1帧场景中。调整两扇门的位置,使它们呈“关闭”状。

  第四步:点选任意图层的第1帧,然后点击打开“动作-帧”面板,在其中输入“stop();”,此为Flash内置的Action Script脚本,使影片在开始的时候不要自动播放。

  第五步:右击图层2的第2帧选择“插入关键帧”,这一帧中的大门不要动;再在第70帧插入关键帧,用鼠标点选图层2场景中的大门,利用鼠标将其向场景左侧移动,一直到显示出大门后面遮盖的背景为止。再用鼠标右击第2帧选择“创建补间动画“,打开这扇门的动画就创建成功了。以同样的方法将图层3中的城门也打开,不过方向相反。

  第六步:大门打开后,就需要停在两旁不要再动了。于是我们选择任意图层的第70帧,点击打开“动作-帧”面板在其中输入“stop();”。

来源:CFAN 

  第七步:点击“窗口→其它面板→公用库→按钮”打开Macromedia官方提供的按钮库,在库中选择一个自己喜欢的按钮,将它拖入图层2的第1帧中。用选择工具点选此按钮,打开“动作-按钮”面板,在面板中为它输入动作脚本:“on (release) {GotoAndPlay(2);}”(不含中文引号),这行代码的意思是当鼠标点击按钮时,立即播放第2帧,而第2帧开始正是前面我们制的开门动画。至此,城门洞开的动画就完成了,按Ctrl+回车键欣赏一下吧(见图11)。

闪了闪了──flash动画制作一日通


Just do it !

  开启城门的动画过程介绍给了大家,现在大家开动脑筋,打开Flash自己来试试如何再把城门关上。另外,可以再新建一个图层,在舞台之外(即工作区中)输入文字,如“欢迎来到Flash闪客世界!”,然后制作一个位移效果,使其在打开城门的时候,同时飞出欢迎词来。

学习心得

  小美:城门位移的补间动画有时会发生意想不到的情况,如城门大小发生了变化甚至发生了旋转,试了几次之后发发现,其实这是“关键帧”属性设置的问题,选择第1帧,点击打开属性面板,去除勾选“缩放”,并将“旋转”设置成“无”即可。

14:30~14:45 五分钟打造超酷闪客相册

  木头人:Flash MX 2004新增了“从模板创建”的功能,其中就含有“照片幻灯片放映”模板,让你花最少的时间做最专业的Flash相册,它不但有非常漂亮的相框,还具有前进、后退、自动播放、显示总体相片数目及当前所在位置、随意移动控制面板等多种功能。

  第一步:启动Flash MX 2004,点击“文件→新建”打开新建窗口,点击其上的“模板”标签,在“类别”中选择“照片幻灯片放映”,风格则选择“现代照片幻灯片放映”,确定后进入编辑窗口。

  第二步:可以看到FLash已经为我们准备好了几张图片,喜欢的话就保留,不喜欢就删除掉:选择最下面的名叫“Picture”图层,拖选该层中的所有帧,再右单击并选“删除帧”命令即可。

  第三步:想加入自己的靓照?很简单,执行“文件→导入→导入到库”命令,将所有准备好的照片导入。在“Picture”图层第1帧“插入空白关键帧”然后将第一张图片拖入到该帧场景中,第2帧“插入空白关键帧”将第二张图片导入,以此类推,有多少张照片就插入多少帧。

  第四步:为了保留漂亮的界面和常用操作按钮,将所有图层的长度设置与图片所在的图层一样长:在相应图层的相应帧上右单击并选择“插入帧”命令即可。

just do it !

  Flash内置有多个模板,好好的利用它们就可以轻松创建各种应用,比如向你的客户展示你们公司的产品或向学生演示讲义等,完全可以用Flash的“幻灯片演示文稿”模板来做。

来源:CFAN 

  与普通FLash编辑窗口不同的是,幻灯片编辑窗口分为左右两部分,左边是缩略图及幻灯片的结构,右边的场景称为“屏幕”,就是幻灯片的内容。左窗口的“Presentation”是幻灯片的背景图片,一般还有上下翻页的按钮,在右窗口中双击就可以进行修改,“Title”是幻灯片的标题,双击进行修改。“ContentHeader”是幻灯片的主体部分,下面的都是幻灯片的内容,可以根据需要进行修改添加。需要注意的是通过屏幕中时间轴创建的动画无法播放,需要动画演示时,必须将动画做成影片剪辑元件,然后从库中拖放到屏幕中就能正常播放了。

学习心得

  阿宝:本例中的第三步,一定要使用“插入空白关键帧”命令,否则会出现前后图片叠合的问题。

14:45~15:30 Q版星座测测你的事业与爱情

  木头人:想为自己的MM或朋友占卜一下2005年的运程么,发愁的是手边没有工具,难道信口开河?现在我们就来自己做一个星座占卜的Flash小工具(纯粹娱乐,不要信以为真哦)。这个例子涉及到一些简单的交互操作。

  第一步:首先要导入图片素材,用鼠标手绘12星座图片有点难度,可在本文提供的资源包中下载已经做好的Q版12星座图,通过“文件→导入→导入到库”命令将其导入库中,从库面板中将12星座图片按照1~12月的顺序依次排开,为了界面美观,我们还可以在小图片下映衬一张美丽的大图作为背景(见图12)。

闪了闪了──flash动画制作一日通


  第二步:为动画点缀一些小饰物可以使得界面活泼可爱,下面我们来制作一个闪烁的炫光。

  1. 按下Ctrl+F8键创建一名为“闪光”的影片剪辑,在元件编辑区内,点击椭圆工具,将“笔触颜色”设为无,填充色设为“放射状”,拖画出一正圆形;再利用铅笔工具和笔刷工具从圆心画出六条放射线,最终效果如图13所示。

闪了闪了──flash动画制作一日通

 

来源:CFAN 

  2.按下Ctrl+A键全选这些图形,接着按下Ctrl+G键将图形组合成一体。在第5帧中插入关键帧,利用任意变形工具将此图形缩小一半并旋转半周。

  3.鼠标右击第1帧选择执行“创建补间动画”命令,同样在第10帧插入关键帧,再利用变形工具将此图形还原成原来大小并旋转半周,右击第5帧创建补间动画。

  第三步:为了实现点击星座图片就跳转到运程说明场景的效果,我们需要在星座图片上方添加一个按钮,为了不使这个按钮覆盖住下面的图片,这个按钮需要做成半透明的。

  按下Ctrl+F8键创建一个按钮元件,在按钮编辑区内可以看到按钮的时间轴分为“弹起、指针经过、按下、点击”等四个状态,右击“弹起”帧并选择“插入关键帧”命令,使用矩形工具画一个与星座图片同样大小的长方形,将其填充色的Alpha值设为0%;再在“指针经过”帧插入关键帧,并将Alpha值改为30%,分别在“按下”和“点击”状态插入关键帧,这两帧可不修改。

闪了闪了──flash动画制作一日通


  第四步:在编辑条里点击“场景1”按钮回到主场景编辑区,将上面制作的“闪光”影片和按钮元件一一拖放到星座图片上。点选白羊星座图片上的按钮,再点击打开“动作-按钮”面板为它加入按钮动作:“on (release) {gotoAndStop(2);}”,这里的2代表白羊星座运程介绍所在的帧;然后再同样为其他星座图片上的按钮添加按钮动作跳转到适当的帧。

  第五步:在主场景第2帧插入关键帧并在其中为白羊星座添加2005年运程介绍,按照同样的方法为其他星座添加2005年运程介绍,注意要与星座图片上按钮的动作相对应。

  现在按下Ctrl+回车键预览一下,点选你所属的星座,看看你2005年的事业与爱情吧。

15:30~15:45  他人动画 巧为我用

木头人:

  学习Flash的最好办法就是看看别人的作品是如何做的,在网上下载到精彩的Flash动画时,不妨借助一些工具来分析它的内部结构。这里我给大家介绍一个国产的Flash分析软件“硕思闪客精灵”(下载地址:http://hn.onlinedown.net/soft/8546.htm)。

  第一步:启动硕思闪客精灵后,在左侧“Explorer”浏览窗格中选择存放有SWF文件的目录,这时会在下面的窗格中显示出此目录中的所有SWF文件。

  第二步:选择你想要分析的SWF文件,这时会在中间部分播放此文件,如果想要了解这个SWF文件的内部构造,可在右侧“Resource”窗格中点击该文件名前面的“+”号,软件便会以树形结构分门别类显示出SWF文件的内部结构来。

  第三步:直接点击工具栏中的“Export FLA”按钮,选择合适的保存位置即可将此文件导出成完整的FLA格式了。注意,如果是未注册版本,将不会导出其中的ActionScript脚。

TOP

发新话题