1、Flash 动画制作与创意【实验目的】 建立帧、元件、实例、场景、库、舞台、时间轴、图层、属性面板等概念的认识。 了解和掌握 Flash 动画中的形变动画、位移动画、逐帧动画。了解和掌握 Flash 动画中的引导线动画、遮罩动画。 掌握动画测试的基本方法。 掌握用 ActionScript 进行 Flash 简单编程。【实验内容】 拼图游戏策划做游戏首先脑子里先要有整个游戏的规划,拿笔画个流程简图,然后再下手。游戏流程的规划是很重要的, 做一个游戏前,草稿纸上来来回回要打个半天的草稿才开工,我一直认为游戏的规划部分是很难的,如果真等到全部想好了,做起来其实是个很轻松的过程,只是耗时间罢了。游戏
2、基本描述:将上面框内的散的小图片拉到下面平框内的相应位置,组成衣服正确的图片。【实验步骤】第一步:图片的准备工作 既然是拼图,当然首先就要有图片了,我找到的是一幅 320*240 象素的 jpg 图片,通过Fireworks 将其切割成 12 块(每块 80*80px),然后分别保存成 12 个 jpg 小图片备用,名称最好有一定规律,比如我将他们分别命名为 pic1pic12,当然你也可以利用其他图象处理工具来实现这一步。 第二步:建立 Flash 文件 打开今天的主角Flash,通过菜单 Modify Document.或 Ctrl+J 打开 Document Properties 面板(
3、由于盗匪使用的是 Flash MX,一些快捷键可能与 Flash 5 的有所不同,不过盗匪会尽量给出 Flash 5 中相应的快捷键的,这个在 Flash 5 中的快捷键是 Ctrl+M),将画面大小改为 400*600px,其他可以保持默认值。 第三步:制作用来判断位置的 Movie Clip 在场景中通过菜单 File Import 或 Ctrl+R 导入 12 块已经处理好的小图片,然后按照原图顺序摆放在场景的下半部,选中左上角第一块,选择菜单 Insert Convert to Symbol 或按 F8 键,在弹出的 Convert to symbol 面板中选择 Movie Clip
4、(以后简称 MC),控制点选择在图片中心(这一点很重要,Flash 5 中可能没有这个选项,不过好在 Flash 5 的默认值就是中心),name 为 check1(也可以根据自己的习惯取名),其余的图片用同样的方法处理。 然后选择菜单 Window Properties 或 Ctrl+F3,打开 Properties 面板,按顺序为这些图片分别填写 Instance Name 为 b1b12,以便以后在 Action 中调用.选中所有 MC(Ctrl+A),将他们的 Alpha 属性设置为 30,这样做只是为了使 MC 看上去模糊,让玩家不能清楚地辨认出是哪部分,以增大游戏难度。 第四步:制
5、作用来拖拽的 MC 这是比较重要的一步,我们将利用这个 MC 来实现图块的拖拽以及位置的判断,在这里我们运用了 MC 中嵌套 Button 的方法以实现代码重用,这是个很重要的方法,希望大家加以重视. 选择菜单 Insert New Symbol.或 Ctrl+F8 新建 Button(以下简称 BT),取名为button_body,确定后进入编辑界面,在 Timeline(时间线)中右键单击 Hit 帧,在快捷菜单中选择 New Keyframe 建立关键帧 ,选择矩形工具(R),绘制一个矩形,选择选取工具 (V),双击矩形,在 Properties 面板中将宽、高、X 坐标、Y 坐标分别设
6、置为 80、80、0、0;新建 MC 取名 button_action,确定后进入 MC 编辑窗口,Ctrl+L 打开 Library(库),将刚刚建立的button_body 拖进来,同样将 X、Y 坐标设置为(0,0). 下面开始为 BT(按钮)添加 AS,选中刚才拖进来的 button_body,通过菜单 Window Actions 或 F9 键(Flash 5 中为 Ctrl+Alt+A)打开 Actions 面板,利用快捷键Ctrl+Shift+E(Flash 5 中为 Ctrl+E,前提是选中了 Actions 面板)转换到 Expert Mode(专家模式,这个模式下编写 AS
7、 比较灵活,建议使用),填入下面的代码: on (press) /按下鼠标 startDrag(_parent, false, 50, 50, 350, 550);/使图块可以在一定范围内被拖拽 on (release) /释放鼠标 stopDrag();/停止拖拽 for (i=1; i =eval(“_root.b“+i)._x-40 and _parent._y =eval(“_root.b“+i)._y-40) /如果被拖拽的图块中心点进入某个判断位置的 MC 的范围内时 _parent._x = eval(“_root.b“+i)._x;/设置图块的坐标,使其吸附到相应的位置 _pa
8、rent._y = eval(“_root.b“+i)._y; 这样,拖拽组件 button_action 就制作好了,在下面的制作中将重复用到这个 MC. 第五步:制作被拖拽的图块 新建 MC,命名为 pic1(这个名称无关紧要),确定后进入编辑窗口,在 Library 中将button_action 拖入,设置坐标为(0,0),再从 Library 中将最初导入的图片 pic1.jpg 拖入,坐标(0,0),重复这个步骤,直到所有图块都拥有自己相应的 MC. 顺便再做一个按钮,命名为 button_back,用来在游戏完成后开始新的游戏. 第六步:游戏的完成工作 回到场景中,将 TimeL
9、ine 中已存在的层命名为“位置判断层“,点击 TimeLine 左下角的 Insert Layer 按钮 ,新建三个层,分别命名为“图块层“、“AS 层“和“按钮与提示层“.选择“图块层“,将 Library 中的 pic1pic12 这几个 MC 拖入该层。特别注意:这里是 MC,而不是图片,我们可以按住 Ctrl 键同时选择不连续的多个 Symbol。按顺序在 Properties 面板中分别填写 Instance Name 为 p1p12。 选择“按钮与提示层“,将第二帧设为关键帧(如果你使用的是 flash 5 请选择第四帧,并顺便用 F5 将“图块层“添加两帧内容帧),并在 Pro
10、perties 面板(flash 5 中为 Frame 面板)中填写 Frame Label 为“over“,选择文字工具(A),在中间位置写入胜利后的提示,如:“Good You Win !“,再拖入 button_back 到合适位置,并捆绑 AS: on(release) prevFrame();/回到前一帧,开始新游戏 /Flash 5 中应该是 gotoAndPlay(1) 现在进入冲刺阶段,选择“AS 层“,选择第一帧,捆绑 AS: stop();/flash 5 中请将这句去掉 for (i=1; i =12; i+) /游戏初始化 eval(“p“+i)._x = random
11、(240)+80;/随即设置图块的位置于场景上半部的一定区域内 eval(“p“+i)._y = random(160)+70; _root.onEnterFrame = function() /flash 5 中请去掉这句和最后一个“,将下面的 AS 捆绑到该层的第二帧,并在第三帧捆绑gotoAnfPlay(2) b = 0; for (j=1; j =12; j+) if (eval(“p“+j)._x = eval(“b“+j)._x and eval(“p“+j)._y = eval(“b“+j)._y) /判断图块是否在正确的位置上,如果是 b += 1;/变量加一 if (b =
12、12) /如果所有图块的位置都正确 gotoAndStop(“over“);/显示胜利信息 ; 动画测试游戏制作完成,游戏方法:将上面的散图片拼到下面的图片框内并且总结实验方法(100-500 字)这次课程实验制作很辛苦,因为组员人数较少,所以收集与制作的任务都是我们两个人的事情。我们两个在代码的编写上遇到了很多问题,很多代码都是参照网上的前辈们的代码改变过来的,虽有很多不同之处,但是在本质的共同点上我们还是不与否认,毕竟第一次制作 Flash 游戏,很多方面经验不足,需要借鉴前辈们。但是我们在游戏策划上的目标是一致的,以我们两暂时的水平只能制作这种容易,简单的小游戏,还需要多多练习才行。设计
13、心得体会组长: 这次课程设计给了我们很多锻炼,在组员较少的情况下完成了这份设计,虽然这个设计简单,而且缺点多,但是也凝聚了我们两个人的心血,虽然可能会评差,但是我们已经尽了自己的一份力。当然也需要多多学习,设计中的点点滴滴都是我的财富,让我为下次的制作有了很多的经验。经过这次的课程设计锻炼了我们的合作能力,通过合作我们把上课有些没弄懂的东西都充分的了解。为下次合作打下了坚实基础。这次课程设计给了我们很多锻炼,通过合作我们把上课有些没弄懂的东西都充分的了解。课程设计评分表班级 分组编号 1 组长题目 Flash 动画制作与创意组员及分工小组成绩(50%)小组成绩开发过程科学,能熟练运用所学的基本
14、知识和基本技能解决相关问题,符合软件开发流程。(10 分)文档层次清晰,正确、完整,技术用语准确,格式符合规范要求。(10 分)软件功能达到设计要求,能正确、稳定运行,界面美观大方,链接流畅。(8 分)团队具有分工、合作精神,具体表现为组长的领导能力,组员的合作精神,组员之间沟通交流情况。(8 分)课程设计过程管理文档完整详实,能明确体现设计进展情况,每位组员的工作情况(4 分)是否按时提交(5 分)各种必须提交文档(打印文档和电子文档)是否完备。(5 分)个人成绩(50%)个人成绩能按时到指定设计地点进行课程设计,不旷课,不迟到,不早退。工作量饱满。(20 分)课程设计报告中由此同学完成的部分完整、合理、正确(15 分)检查时能准确、详细地回答老师提问。(10 分)在报告中有个人总结和心得(5 分) 合计 综合成绩成绩等级王永 毕佳驹 杜鹏飞 郭霜瓅 刘时恒 注:按优(90-100 分)、良(80-89 分)、中(70-79 分)、及格(60-69 分)、不及格(60 分以下)五级评定成绩。指导教师:武汉科技大学课程设计名称:Flash 动画制作与创意班 级:组 长:成 员: