网站首页 手机版
 注册 登录
您现在的位置: 畅无忧设计 >> 媒体动画 >> Flash教程 >> Flash基础 >> 正文
最新文章
· 完整把握Flash动画设计的知识体系
· Flash8与javascript集成
· 第十七课 综合应用范例―幻彩图片
· 第十六课 时间轴特效应用范例―满天花
· 第十五课 混合模式应用范例―动画片头
· 第十四课 滤镜应用范例―水波荡漾
· 第十三课 行为和行为面板
· 第十二课 在Flash中应用视频
· 第十一课 在Flash中应用声音
· 第十课 按钮元件
热门文章
 第九课 自定义缓入/缓出动画范例―
 完整把握Flash动画设计的知识体系
 第一课 Flash8 工作环境
 第十六课 时间轴特效应用范例―满天
 第十四课 滤镜应用范例―水波荡漾
 第六课 动作补间动画
 第四课 逐帧动画
 第十五课 混合模式应用范例―动画片
 第二课 Flash8基础绘图工具
 第十课 按钮元件
相关文章
第十七课 综合应用范例―幻彩图片
第十六课 时间轴特效应用范例―满天花雨
第十五课 混合模式应用范例―动画片头
第十四课 滤镜应用范例―水波荡漾
第十三课 行为和行为面板
第十二课 在Flash中应用视频
第十一课 在Flash中应用声音
第十课 按钮元件
第九课 自定义缓入/缓出动画范例―逼真弹
第八课 引导路径动画
第七课 遮罩动画
第六课 动作补间动画
第五课 形状补间动画
第三课 绘图综合练习—情人节贺卡
第二课 Flash8基础绘图工具
第一课 Flash8 工作环境
Flash基础教程专题
第四课 逐帧动画
来源:闪客启航 更新时间:2009/5/2 3:09:12 阅读次数:
字体:[ ] 我要投稿

本节的知识点:
逐帧动画
的概念及四种逐帧动画制作形式。
实例中介绍了位图及gif动画的导入方法,利用洋葱皮工具移动多帧元件。

第四课素材

从本单元起,我们将逐渐给大家介绍Flash8.0中的五种常见的动画形式:逐帧动画、形状补间动画、动作补间动画、遮罩动画、引导线动画。
本节着重介绍逐帧动画(FrameBy Frame),这是一种常见的动画手法,它的原理是在“连续的关键帧”中分解动画动作,也就是每一帧中的内容不同,连续播放而成动画。
由于逐帧动画的帧序列内容不一样,不仅增加制作负担而且最终输出的文件量也很大,但它的优势也很明显:因为它相似与电影播放模式,很适合于表演很细腻的动画,如3D效果、人物或动物急剧转身等等效果。

1.逐帧动画的概念和在时间帧上的表现形式

在时间帧上逐帧绘制帧内容称为逐帧动画,由于是一帧一帧的画,所以逐帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容。
逐帧动画在时间帧上表现为连续出现的关键帧,如图3-2-1所示。
 
 
图 3-2-1 逐帧动画

2.创建逐帧动画的几种方法

(1)用导入的静态图片建立逐帧动画
用jpg、png等格式的静态图片连续导入Flash中,就会建立一段逐帧动画。
(2)绘制矢量逐帧动画
    用鼠标或压感笔在场景中一帧帧的画出帧内容。
(3)文字逐帧动画
    用文字作帧中的元件,实现文字跳跃、旋转等特效。
(4)导入序列图像
可以导入gif序列图像、swf动画文件或者利用第3方软件(如swish、swift 3D等)产生的动画序列。

3.绘图纸功能

(1)绘画纸的功能
    绘画纸是一个帮助定位和编辑动画的辅助功能,这个功能对制作逐帧动画特别有用。通常情况下,Flash 在舞台中一次只能显示动画序列的单个帧。使用绘画纸功能后,你就可以在舞台中一次查看两个或多个帧了。
如图3-2-2所示,这是使用绘画纸功能后的场景,可以看出,当前帧中内容用全彩色显示,其它帧内容以半透明显示,它使我们看起来好像所有帧内容是画在一张半透明的绘图纸上,这些内容相互层叠在一起。当然,这时你只能编辑当前帧的内容。
 
 
图3-2-2 同时显示多帧内容的变化
 
(2)绘图纸各个按钮的介绍
  1.  绘图纸外观按钮 按下此按钮后,在时间帧的上方,出现  绘图纸外观标记。拉动外观标记的两端,可以扩大或缩小显示范围。
  2.  绘图纸外观轮廓 按下此按钮后,场景中显示各帧内容的轮廓线,填充色消失,特别适合观察对象轮廓,另外可以节省系统资源,加快显示过程。3.
  3.  绘图纸显示多帧按钮,按下后可以显示全部帧内容,并且可以进行“多帧同时编辑”。
  4.  修改绘图纸标记 按下后,弹出菜单,菜单中有以下选项:
  “总是显示标记”选项会在时间轴标题中显示绘图纸外观标记,无论绘图纸外观是否打开。
“锚定绘图纸外观标记”选项会将绘图纸外观标记锁定在它们在时间轴标题中的当前位置。通常情况下,绘图纸外观范围是和当前帧的指针以及绘图纸外观标记相关的。通过锚定绘图纸外观标记,可以防止它们随当前帧的指针移动。
“绘图纸 2”选项会在当前帧的两边显示两个帧。
“绘图纸 5”选项会在当前帧的两边显示五个帧。
“绘制全部”选项会在当前帧的两边显示全部帧。
上面,我们全面介绍了逐帧动画的特点和创建方法,现在,我们来动手制作二个逐帧动画实例,以加深对逐帧动画的认识。

4.奔跑的豹子

   茫茫雪原上,有一只矫健的豹子在奔跑跳跃,这是一个利用导入连续位图而创建的逐帧动画,如图 3-2-3所示。
 
图 3-2-3 奔跑的豹子
 
1、 创建影片文档
执行【文件】|【新建】命令,在弹出的面板中选择【常规】|【Flash文档】选项后,点击【确定】按钮,新建一个影片文档,在【属性】面板上设置文件大小为400*260象素,【背景色】为白色,如图 3-2-4所示。
 
图 3-2-4 创建新文档
 
2创建背景图层
选择第一帧,执行【文件】|【导入到场景】命令,将本实例中的名为“雪景.bmp”图片导入到场景中。在第8帧按F5,加过渡帧使帧内容延续。
3、 导入gif动画
新建一层,选择第一帧,执行【文件】|【导入到场景】命令,将本教程中的“奔跑的豹子”系列图片导入。此时,会弹出一个对话框,如图3-2-5所示。
 
3-2-5 系列图片导入
 
选择【是】按钮,Flash 会自动把gif中的图片序列按序以逐帧形式导入场景的左上角,如图3-2-7所示。
3-2-7  导入的gif动画在场景的上方形成帧帧动画
 
如图3-2-8所示是导入后的动画序列,它们被Flash自动分配在8个关键帧中。
 
 
     
图 3-2-8 导入的8张图片
 
4 、调整对象位置
此时,时间帧区出现连续的关键帧,从左向右拉动播放头,就会看到一头勇猛的豹子在向前奔跑,但是,被导入的动画序列位置尚未处于我们需要的地方,缺省状况下,导入的对象被放在场景坐标“0,0”处,我们必须移动它们。
你当然可以一帧帧调整位置,完成一幅图片后记下其坐标值,再把其它图片设置成相同坐标值,如果你有足够耐性和时间,也无妨,那么,我们何不试试“多帧编辑”功能呢?
先把“雪景”图层加锁,然后按下时间轴面板下方的【绘图纸显示多帧】按钮  ,再单击【修改绘图纸标记】按钮 ,在弹出的菜单中选择【显示全部】选项,如图3-2-9所示。
图3-2-9 选择显示全部选项
 
最后执行【编辑】|【全选】命令,此时时间轴和场景效果如图3-2-10所示。
 
 
图3-2-10 选取多帧编辑
 
用鼠标左键按住场景左上方的豹子拖动,就可以一次把8帧中的图片一次全移动到场景中了。

5、 设置标题文字
在场景中新建一个图层,单击工具栏上的文字工具按钮  ,设置【属性】面板上的文本参数如下,【文本类型】为静态文本;【字体】为隶书;【字体大小】35;【颜色】为深蓝色。如图 3-2-11所示。
 
图 3-2-11 字体【属性】面板参数设置
 
在文本框输入“奔跑的豹子”五个字,居中放置。
6测试存盘
执行【控制】|【测试影片】命令,观察本例swf文件生成的动画有无问题,如果满意,执行【文件】|【保存】命令,将文件保存成“奔跑的豹子.fla”文件存盘,如果要导出Flash的播放文件,执行【导出】|【导出影片】命令保存成“奔跑的豹子.swf”文件。
  • 上一篇文章:
  • 下一篇文章:
  • 关于我们 - 联系我们 - 广告服务 - 在线投稿 - 友情链接 - 网站地图 - 版权声明
    CopyRight 2008-2010, CWYDESIGN.COM - 畅无忧设计, Inc. All Rights Reserved
    滇ICP备09005765号