flash制作动画.docx
《flash制作动画.docx》由会员分享，可在线阅读，更多相关《flash制作动画.docx（22页珍藏版）》请在冰豆网上搜索。
flash制作动画
课程设计报告书
课程名称：
《多媒体技术应用》课程设计
题目：
多媒体毕业纪念册
系名：
信息工程系
专业班级：
姓名：
学号：
指导教师:
2012年6月29日
课程设计任务书
学生姓名：
专业班级：
指导教师：
工作单位：
信息工程系
设计题目：
多媒体毕业纪念册
初始条件：
要求较全面地理解、掌握和综合运用所学的多媒体方面的理论知识，会用photoshop进行图片处理，会用flash制作简单动画，以及用flash来表达自己的感谢语祝福。
要求完成的主要任务：
设计“多媒体毕业纪念册”。
它集图像、文字、音乐等于一体，包括母校风情，恩师嘱托，同学资料与留言，师生合影及校园生活等。
把这些照片做成电子相册，集漂亮，动感，实惠，永久于一身。
主要任务：
1.完成整个程序的设计及组合，经教师检查及答辩；
2.写出规范的课程设计说明书；
3.课程设计结束后交设计说明书等文档。
4.文档雷同者按不及格处理；
5．课程设计报告采取统一格式。
设计报告撰写格式要求：
要求层次清楚、整洁规范、不得相互抄袭，凡正文内容有整段完全相同者一律以抄袭论处。
设计报告正文字数不少于0.2万字（不包括附录）。
第1级（章）题序和题名用黑体三号字，第2级（目）题序和题名用黑体小四号字，第3级（条）题序和题名用黑体小四号字，正文内容用宋体五号字（英文用新罗马体），多倍行距1.25。
报告内容一律使用A4打印纸计算机打印，页码在页下居中标明。
必须使用国家公布的规范字。
页面设置：
上空2.5cm，下空2.0cm，左空2.5cm，右空2.0cm（左装订）。
插图图面要整齐、美观，插图应与正文呼应，不能脱节。
每幅插图应有图序与图题，图序编号要连续，图序与图题间空一格且要放在插图下方居中处。
时间安排：
2012年6月25日布置课程设计任务；讲述设计目的、内容、时间安排与本次课程设计的要求查阅资料，学生进行分析及总体设计，理清设计思路；
2012年6月26日-28日按设计要求，查阅资料；进行设计及制作；
2012年6月29日提交课程设计报告及相关文档。
指导教师签字：
2012年6月25日
系主任签字：
2012年6月25日
目录
1设计需求
1.1设计目的···················································4
1.2设计思想···················································4
2概要设计······················································4
3详细设计
3.1开始界面的制作·············································4
3.2母校风情动画的制作·········································5
3.3校园生活动画的制作·········································10
3.4师生资料与留言的动画制作··································13
3.5师生合影动画的制作········································16
3.6最后结束界面的制作········································19
4设计总结·····················································21
参考文献·······················································21
1设计需求
1.1设计目的
高中毕业了，留下了很多照片，正好借这次课程设计将其整理一下，制作成动感影集，怀念一下当初的时光，整理一下当初的感情。
同时通过实践使同学们经历多媒体应用系统开发的全过程和受到一次综合训练，以便能较全面地理解、掌握和综合运用所学的知识。
结合具体的案例，理解并初步掌握常用多媒体软件的使用，利用多媒体计算机等设备进行音频与视频数据的获取和处理、图像处理与图像文件格式转换、超文本超媒体在交互式多媒体软件的应用。
1.2设计思想
将自己要设计的照片整理出来，并且寻找一些符合的图片下载下来。
照片主要分四大部分，其中包括母校风情，校园生活，师生资料与留言，师生合影。
它集图像、文字、音乐等于一体，集漂亮，动感，实惠，永久于一身。
2概要设计
设计中主要运用了补间，特效，引导，遮罩，按钮，简单代码等。
补间，就是让动画连贯起来，有动画补间和形状补间。
特效，就是照片或文字入或出并不那么单调，出现各种形式。
引导，就是按照自己设定的路线，让蝴蝶飞舞。
遮罩，就是显示遮罩层的内容。
有文字遮罩即制作闪烁文字，卷轴，模糊遮罩等。
按钮，就是控制动画的进程，其中还有个控制音乐的隐形按钮。
3详细设计
3.1开始界面的制作
首先，导入一张你需要的图片到库，新建元件，命名为“文字1”。
第二，在元件中输入文字“星梦园十班”，回到场景，新建图层，将文字1元件拖入到场景合适的位置。
第三，制作按钮1。
新建一个元件，命名为“按钮1”，属性为按钮，然后在元件中制作“play”按钮。
回到场景，新建图层，将按钮1拖入到场景合适的位置。
并在这一帧上加入代码stop（）;并在按钮上加入代码on（release）{play（）;}。
至此开始进入界面完成。
如下图
图3.1
3.2母校风情动画的制作
首先，将“大门”的图片导入到库，在场景中新建图层，将“大门”照片拖入到场景，并设置其大小，并将图拖到画布外面的左上角，在其后20帧处插入关键帧，将图拉入画布合适位置，中间加入动画补间。
并在其后10帧处插入延续帧。
第二，新建元件2，命名为“文字2”，在其中输入自己想要的文字，并单击右键设置其特效，设置为转换特效。
回到场景，将文字2元件拖入到场景，并放在合适的帧处，在其后加入延续帧。
具体如下图
图3.2.1
（进入画面的设置：
）
第三，新建元件，命名为“母校风情”，并在元件中制作以下步骤。
第四，在图层1上加入一张合适的底图，并在30帧处加入延续帧。
第五，新建图层，在第一帧加入“母校风情”文字，并设置变形特效。
第六，新建图层，在30帧处插入关键帧，然后将“按钮2”（即进入按钮）拖入到画布中，并在这一帧上加入代码stop（）;并在按钮上加入代码on（release）{play（）;}。
结果如下图
图3.2.2
导入所有需要的图片的图片到库
第七，新建图层，在31帧处插入关键帧，将所需照片拖入到画面外面，然后在51帧出插入关键帧，将照片拖入到画布的正中间，并在后面插入三个关键帧，在31帧到51帧处创建补间动画。
在74帧处插入关键帧，将照片移到画布外面，并在55到74帧处创建补间动画。
第八，新建图层，在55帧处插入关键帧，将所需照片拖入到画布的正中间，在74帧处插入帧，并在其后面插入3帧关键帧。
然后在98帧处插入关键帧，将照片移出到画布外面，在78帧到98帧处创建补间动画。
结果如下图
图3.2.3
第九，重复七八步骤，将所有需要的照片都制作好。
图3.2.4
图3.2.5
第十，新建图层，在第51帧输入文字，点右键“分离”，然后插入四个关键帧，在第68帧处插入关键帧，在适当位置写入下一个字，分离，在第55帧和第68帧之间创建形状补间，并在68帧后插入3关键帧。
得到如下图
图3.2.6
第十一，重复前面做完所有的字。
在最后一个字后插入四个关键帧，在最后一帧处写入文字，右键|“时间轴特效”|“转换”。
得到如下图
图3.2.7
母校风情元件即完成。
3.3校园生活动画的制作
第一，新建元件，命名为“校园生活”，并在元件中制作以下步骤。
第二，在图层1上加入一张合适的底图，并在30帧处加入延续帧。
第三，新建图层，在第一帧加入“校园生活”文字，并设置特效。
第四，新建图层，在30帧处插入关键帧，然后将“按钮2”（即进入按钮）拖入到画布中，并在这一帧上加入代码stop（）;并在按钮上加入代码on（release）{play（）;}。
结果如下图
图3.3.1
第五，新建元件，命名为画轴身，第一帧用矩形工具画底板，并调整大小。
新建图层2，然后将与这个主题相关的图片都拖入到画布中，并调整成一样的大小，然后在底板上排布，具体如下图
图3.3.2
第六，新建元件，命名为卷轴。
新建四个图层，图层1命名为“遮罩”。
图层遮罩层画一个跟画布一般大小，位置相同的矩形完全遮住。
在第55帧处插入关键帧，第1帧遮罩完全移开，在中间创建动作补间，遮罩层按右键选择遮罩。
图层2中将卷轴身元件拖入到画布合适的位置。
图层3，命名为“右轴”，用矩形工具画一矩形条，画两个圆制作轴，并复制，粘贴到新建的图层4上，图层4命名为“左轴”。
“右轴”图层在第55针处插入关键帧，将轴放在图片最右边，中间动作补间。
得到结果如下图
图3.3.3
图层4命名为“文字”，在第55帧处插入关键帧，将文字拖入到右轴的旁边，在340帧处插入关键帧，将文字的最后字放于左轴旁边，中间创建补间动画。
如图
图3.3.4
其各个图层顺序为：
图3.3.5
最后效果图为：
图3.3.6
在四个图层的257帧处都插入关键帧，在右轴层，遮罩层的296帧处插入关键帧，并在257帧到296帧之间创建动作补间，而左轴层和图层2在296帧处插入延续帧。
至此做成了卷轴打开又关闭的效果。
第七，回到校园生活元件，新建图层，在第31帧处插入关键帧，将卷轴元件拖入到画布中，在379帧处插入延续帧。
至此，校园生活动画制作完成。
3.4师生资料与留言的动画制作
第一，新建元件，命名为“师生资料与留言”，并在元件中制作以下步骤。
第二，在图层1上加入一张合适的底图，并在30帧处加入延续帧。
第三，新建图层，在第一帧加入“师生资料与留言”文字，并设置特效。
第四，新建图层，在30帧处插入关键帧，然后将“按钮2”（即进入按钮）拖入到画布中，并在这一帧上加入代码stop（）;并在按钮上加入代码on（release）{play（）;}。
结果如下图
图3.4.1
第五，新建四个图层，分别拖入四张图片，并设置为相同的大小，每个图层都在第40帧处插入关键帧，并设置补间，让其入；在第59帧处插入关键帧，并设置补间，让其出，具体如图
图3.4.2
第六，新建一图层，在第59帧处插入关键帧，拖入照片，并在107帧处插入延续帧，然后在108帧处插入关键帧，单击图片设置特效，如下图
图3.4.3
第七，按照步骤5，6的做法，分别作出与主题相关的照片或文字的动画。
第八，恩师嘱托的制作。
文字仿照上面步骤做，此处具体说引导的制作。
①新建一个元件，命名为蝴蝶，然后插入十个关键帧，在每一针上都画入一个蝴蝶的形态，让其连续起来后好像是扇动翅膀的效果，部分蝴蝶形态如下图
图3.4.4
②在元件“师生资料与留言”中新建图层，将“蝴蝶”元件拖入到舞台中，在第285帧处插入关键帧。
③添加引导层，第285帧插入关键帧绘制一个半心，然后将曲线的顶端对准元件“蝴蝶”的中心点，在引导层第348帧处插入关键帧，然后将元件“蝴蝶”中心对准曲线的尾端，如下图
图3.4.5
④在引导层和图片层的第249帧处都粘贴第285到第348处的帧，重复蝴蝶飞舞的动作，粘贴两次。
⑤将引导层的曲线半心翻转，重复步骤②③④制作另一半。
至此，师生资料与留言动画制作完成
3.5师生合影动画的制作
第一，新建元件，命名为“师生合影”，并在元件中制作以下步骤。
第二，在图层1上加入一张合适的底图，并在30帧处加入延续帧。
第三，闪烁文字动画的制作
①新建元件，命名为“文字5”，在图层１中第１帧输入需要的字“师生合影”并设置合适的大小，在第４０帧处插入延续帧。
②新建图层２，在第１帧处拖入一张图片，放于文字的左半边；
③再新建图层３，在第１帧处拖入另一张图片，放于文字的右半边。
在第４０帧处插入关键帧，将图层２，图层３中的图片左右交换位置，并都在中间创建动作补间。
④将图层１拖至图层２,３的上方，图层１点右键“遮罩”，并在普通图层点右键“属性”｜“被遮罩”。
效果如下图
图3.5.1
⑤将此元件拖入到“师生合影”元件中。
第四，新建图层，在30帧处插入关键帧，然后将“按钮2”（即进入按钮）拖入到画布中，并在这一帧上加入代码stop（）;并在按钮上加入代码on（release）{play（）;}。
结果如下图
图3.5.2
第五，用模糊遮罩显示照片，模糊遮罩具体做法如下：
1.建新文档:
550X400。
把二张图片图1、图2导入库。
2.、制作元件：
2.1、插入--新建元件，名：
图1。
类型：
影片剪辑。
把图片图1拖入舞台，居中对齐。
2.2回到场景1。
插入--新建元件，名：
图2。
类型：
影片剪辑。
把图片图2拖入舞台，居中对齐。
2.3回场景1。
插入--新建元件，名：
椭圆。
类型：
影片剪辑。
在椭圆编辑器中，使用椭圆工具（笔融无，填充色任意）绘制一个椭圆，宽65、高50。
居中对齐。
2.4回场景1。
插入--新建元件，名：
矩形。
类型：
影片剪辑。
在矩形编辑器中，使用矩形工具（笔融无，填充色任意）绘制一个矩形，宽10、高400。
居中对齐。
4个影片剪辑元件制作成功.
3、场景内元件与图层的关系及位置：
3.1、在场景1中建图层，层共4层。
从下到上排列为：
图1、图2、遮罩、AS。
并为图层改相对应的名称;
3.2点图1层第1帧，把图1元件拖入舞台，居中对齐。
在属性面板上输入实例名称：
p1，在“使用运行时位图缓存”前打上勾。
80帧插入帧。
3.3在图2层的第20帧插入关键帧，把图2元件从库里拖出来，居中对齐，在属性面板上输入实例名称：
p2，在“使用运行时位图缓存”前打上勾。
80帧插入帧。
3.4把图1层的第1帧复制到图2层的50帧上，把图2层的第20帧复制到图1层的50帧。
图1、图2层锁上。
4.遮罩层:
4.1、在遮罩层的第20帧插入关键帧，从库中把椭圆元件拖出舞台居中对齐。
在属性面板上输入实例名：
pu2。
打开滤镜面板设置模糊效果如下：
150;150；
4.2.在第40帧插入关键帧，用任意变形工具把矩形拉大复盖整个舞台。
在20~40帧内创建补间动画。
41帧插入1空白关键帧。
4.3.在50帧插入关键帧，从库里拖出矩形元件到舞台左侧，相对于舞台--垂直对齐。
打开属性面板输入实例名称：
pu1；
打开滤镜面板设置模糊效果：
4.4、80帧插入关键帧，用任意变形工具把矩形拉大复盖整个舞台。
50-80帧内创建补间动画。
5、代码
5.1在代码层的第20帧插入一个空白关键键，按F9打开动作面板，输入动作代码：
p2.setMask（pu2）;
5.2、在代码层的第50帧插入一个空白关键帧，按F9打开动作面板，输入动作代码p1.setMask（pu1）;
按照上面所说的方法将所有与此主题相关的照片都做成模糊遮罩，其中图片为下图
图3.5.3
图3.5.4
图3.5.5
至此，师生合影动画制作完成
3.6最后结束界面的制作
第一，在场景中新建四个图层，分别将底图，文字，按钮等拖入到图层。
第二，文字使用两次特效，具体如下
模糊：
图3.6.1
阴影
图3.6.2
第三，在1415帧处插入关键帧，然后将“按钮3”（即replay按钮）拖入到画布中，并在这一帧上加入代码stop（）;并在按钮上加入代码on（release）{
stopAllSounds（）;
gotoAndPlay
（1）;
}。
结果如下图
图3.6.3
第四，音乐的添加
①将编辑过的音乐导入到库，在场景中新建一个图层，命名为“音乐”，在下面“属性”面板中设置“同步”为“事件”“重复”。
②在库中选中音乐文件，右键|“链接”，标识符为“mymusic”。
选中音乐图层，将一跃文件拖入到场景中即可。
第五，隐形按钮的制作
①新建一个按钮元件，命名为“隐形按钮”，打开此元件。
②在“按下”插入关键帧，用多角星形工具画一个多角形，然后在“点击”上插入关键帧。
如下图
图3.6.4
③回到场景，将隐形按钮拖入到背景图片左下角，单击隐形按钮，按F9设置其代码为：
on（rollOver）
{mm.stop（）;
}
on（rollOut）{mm.start（mm.position/1000）;
}
on（release）{mm.start（）;
}
让隐形按钮全程控制音乐，在鼠标在它上面时，音乐停止；点击，音乐重新播放。
最后，选择好排列的顺序，将所作的flash动画串接在一个场景里即可。
4设计总结
改正想法：
因为是电子相册，所以会有很多照片，就想把一部分照片弄成相册那样的，并且自动一页一页的翻看。
同时，也可以加入一些链接，如同学老师的具体资料等。
心得体会：
这次多媒体课程设计真的让自己感受颇深。
最主要的就是意识到除了学书本上的东西外，一定要动手操作，具体的去实践一下，否则所有的都是纸上谈兵！
还有就是做flash一定要耐心和细心，可能就因为多一帧或少一帧那样动画就不能播放。
通过这次课程设计，具体的实践操作，发现自己只学了一点点，还有很多东西不知道，要想去制作更好的动画，还需要自己去多多学习，更加去多多练习。
参考文献
[1]薛为民，宋静华著，多媒体技术与应用，中国铁道出版社，2007.
[2]安小龙著，Flash动画艺术设计案例教程，清华大学出版社，2010.
设计过程及答辩回答问题记载：
（至少三个问题）
1.因要用按钮控制进入，为什么按钮没用就直接进入到下一动画了？
答：
要在按钮的那一帧上添加代码stop（）;
2.怎样制作隐形按钮？
答：
和制作按钮一样，但在其“弹起”和“指针经过”处不加入关键帧。
3.怎样在replay后，让前一个音乐停止，音乐重新开始播放？
答：
在replay按钮上添加代码：
on（release）{
stopAllSounds（）;
gotoAndPlay
（1）;
}
指导教师评语：
签名：
2012年6月29日
升级会员 