收藏本站
 
设为主页
     您的位置:首页资源库动画制作Flash教程
== 资 源 搜 索 ==
 
高级搜索
== 学 习 资 源 ==
操 作 系 统
Windows DOS
Linux Unix
Novell OS/2
办 公 软 件
Word Excel
Access Powerpoint
Outlook Wps
媒 体 处 理
网页制作 动画制作
图片处理 视频处理
媒体播放 音频处理
课件制作 其它……
网 络 工 具
网页浏览 下载工具
FTP 工具 邮件工具
网络安全 服 务 器
联络聊天 其它……
工 具 软 件
压缩工具 系统工具
文件工具 磁盘工具
病毒防治 阅读工具
测试工具 程序设计
== 素 材 资 源 ==
GIF动画 Flash动画
按钮图库 图标图库
线条图库 背景图库
创意图库 音频素材
== 教 程 下 载 ==

FLASH入门动画

幸运鸟
新闪光时代

第五节 延伸的直线

这一节我们将来学习渐变动画的另一种形式,即形状渐变动画。我们先来学习做上面这个直线伸长的简单动画,之后我们稍加变化,做一个更有趣的直线伸长动画。

Flash新建一个文件,按Ctrl-M对电影的属性作一个调整,将其设置为狭长的矩形(如宽Width设为400,高Height设为50),将背景色设为蓝色。

用铅笔工具或直线工具画一条横向的短线,长度如右图所示:。 注意要画一条笔直的横线,可以按住Shift键,再用铅笔工具或直线工具横向拖动鼠标即可,因为按住Shift键以后,线条只能沿水平,竖直及45度角方向变化。

然后我们在第40帧上按F6插入一关键帧,或按F7插入一空帧(当在这一帧上绘制图形后,该帧会成为关键帧)。确定这一帧为当前帧,我们将在这一帧上绘制一条更长的直线,有两种方法可以实现这一点。

一种是按下F7插入空帧后,点击时间轴窗口下方洋葱皮按钮的左边第一个,即。这时我们发现第1帧的短横线以灰色显示出来。我们就以它为基准,用铅笔工具绘制一条长直线,直线左端与短横线左端对齐。

另一种方法要简单一些,在第40帧按下F6插入一关键帧后,第40帧会具有和第1帧相同的内容,即一条短横线,我们只需要对它加一下工就可以了。选中绘图工具栏中的箭头工具,移动鼠标到短横线的右端,鼠标形状如右图:。点住鼠标左键并向右拖动,直到直线足够长为止。

选用这两种方法之一做好第40帧的直线。下面我们就要设置帧属性让直线动起来。用鼠标点击时间轴上的第1帧,然后通过Ctrl+F弹出帧面板将其中的补间动画选项进行设置,选择形状变化如下图所示,回车确定。这时在第1帧和第40帧之间出现一个实箭头,背景变为淡绿色,表明是形状渐变动画。

Ctrl-Enter看一下效果,应该和上面所示一样的。

         

现在我们来变个花样,做一个环绕矩形四条边伸长的直线。大家能猜一猜这个动画是怎么做的吗?其实有了本节开头直线伸长动画的基础,这个动画一点也不难做。

我们对刚刚做好的直线伸长的动画加一加工。首先按Ctrl-M对电影属性作一个调整,将其高度(Height)设置为150。为了缩短动画时间,我们按下Ctrl键把鼠标移到第40帧上,发现鼠标这时变成黑色,如右图所示:。把第40帧向左拖动到第20帧位置松开鼠标,这时动画时间缩短了一半,发现直线延伸变快了。

点时间轴窗口下的新建一个层,在新层的第21帧按F6插入一个关键帧。按下洋葱皮按钮,这时原先层上的直线用灰色显示出来:。我们从这条线的最右端开始向下画一条短竖线:。在新层的第30帧按F6插入一个关键帧,该帧具有和第21帧相同的内容。用上面讲过的方法把这一帧的竖线拉长到合适的长度,同上面动画中的竖线长度差不多。然后,点击第21帧并通过Ctrl+F弹出帧面板,按刚才讲过的方法把补间动画设置为形状渐变动画。按Ctrl-Enter看一下效果,应如下图所示:

我们发现这并不是我们想得到的结果,我们希望直线不断延伸,而不是分段延伸。得到这个显示结果是因为横向直线延伸的动画在第20帧以后就终止了,在第21帧到第30帧之间,也就是竖线延伸时横向直线层上没有内容。为了弥补这一点,我们在横向直线延伸动画所在层的第30帧上按下F5键,使该层在第21帧到第30帧之间仍保留第20帧,也就是最近的一个关键帧上的内容,这样在第21帧到第30帧之间,横向的直线将一直被显示出来。再按Ctrl-Enter看一下效果,发现直线先是横向延伸,到了右端顶点后转为竖向延伸,这才是我们需要的结果。

现在再做其它两条边的直线延伸就变得很简单了,再新建两个层,一条边一个,方法和上面讲过的一样,我在这里就不再多说了。做好后的时间轴应如下图所示。

好了,欣赏一下我们做的动画吧。体会一下运动渐变动画和形体渐变动画的区别。下一节课中我们还将继续介绍形状渐变动画其它的应用。

[上一页] [下一页]


Copyright © 2001-2002 东莞中学信息技术科 All Rights Reserved
IE4.0 or later / 800*600  For The Best View