基于FLASH动画的图片展示系统设计与开发毕业论文.doc

《基于FLASH动画的图片展示系统设计与开发毕业论文.doc》由会员分享，可在线阅读，更多相关《基于FLASH动画的图片展示系统设计与开发毕业论文.doc（17页珍藏版）》请在三一办公上搜索。

1、 基于FLASH动画的图片展示系统设计与开发作者 姓 名 系（院）教育信息技术与传媒学院 专业 教育技术学（软件方向） 年级 X 级 学号 学 号 指导教师 老 师 日期 X年X月X日 学生诚信承诺书本人郑重承诺：所呈交的论文是我个人在导师指导下进行的研究工作及取得的研究成果。尽我所知，除了文中特别加以标注和致谢的地方外，论文中不包含其他人已经发表或撰写的研究成果，也不包含为获得安阳师范学院或其他教育机构的学位或证书所使用过的材料。所有合作者对本研究所做的任何贡献均已在论文中作了明确的说明并表示了谢意。签名： 日期： 论文使用授权说明本人完全了解安阳师范学院有关保留、使用学位论文的规定，即：学

2、校有权保留送交论文的复印件，允许论文被查阅和借阅；学校可以公布论文的全部或部分内容，可以采用影印、缩印或其他复制手段保存论文。签名： 导师签名： 日期： 基于FLASH动画的图片展示系统设计与开发 摘要：笔者以介绍五种典型的图片展示系统及应注意的地方来说明flash动画在图片展示方面的实际效用。这五种flash动画分别是“按钮效果”、“翻书效果”、“电子相册效果”、“模糊效果”、“缓冲放大与缩小效果”。本文将主要从设计思路、技术类型、制作流程、注意事项四个方面分别分析每种动画效果。关键词：图片展示；flash动画；设计思路；技术类型；制作流程；注意事项1 引言 目前的图片展示系统随处可见，大到

3、一个个的网站设计，小到一个个的图标展现，都可以看到图片展示的艺术与技巧，每种方法都有自己的优点，Flash是特别适用于创建通过Internet提供的内容，因为它的文件非常小。Flash是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。 FLASH是一款很好的制作动画的软件，FLASH可以制作丰富多彩的矢量动画，并且用它可以将音乐、声效、动画以及富有新意的界面融合在一起，以制作出高品质的动画效果，由它制作出的作品，图文并茂、声色俱全，并可以根据

4、自己的特点进行编辑，可以制作出具有个人特点的动画。2 “按钮效果”的flash动画2.1 设计思路 “按钮效果”的flash动画实现的主要功能是：点击画面左边分散不等的小图片，即可播放该图片。这样左边分散不等的小图片就像一个按钮一样，点击即可得到触发的事件。这种图片展示效果使人能够控制图片的展示过程。2.2 技术类型 “按钮效果”的flash动画主要运用影片剪辑的动画效果，点击类似按钮功能的小图片连接图片实现播放，同时，小图片上应写上相应的触发代码，实现图片被按钮控制的展示效果。2.3 制作流程1、 素材准备：准备7张图片，用PS处理成：550*400像素。2、制作影片剪辑：2-1、新建影片剪

5、辑，命名为“元件1”，第一帧处将准备好的“图片1”拖入，上锁。2-2、新建影片剪辑，分别命名为“元件2” 、“元件3” 、“元件4” 、“元件5” 、“元件6” 、“元件7” ，并做与影片剪辑“元件1”相同的步骤。3、 编辑场景3-1、进入场景，在舞台点击右键，选择“文档属性” ，背景颜色为：#000000。3-2、图层自下而上是：图片1、图片2、图片3、图片4、图片5、图片6、图片7、代码、按钮、音乐10个图层。如图1：图1 “按钮效果”flash动画的图层3-3、“图片1”图层第1帧将“元件1”拖入，并将其缩小旋转，置于舞台左侧。第20帧处插入关键帧，将“元件1”放大到正好铺满舞台，创建补

6、间动画。上锁。3-4、“图片2”图层第1帧将“元件2”拖入，并将其缩小旋转，置于舞台左侧。第20帧处插入帧，第40帧处插入关键帧，将“元件2”放大到正好铺满舞台，创建补间动画。上锁。3-5、“图片3” 、“图片4” 、“图片5” 、“图片6” 、“图片7”依次往后推20帧，创建动画。3-6、代码图层第20帧、第40帧、第60帧、第80帧、第100帧、第120帧、第140帧处，打开动作面板，均写入语句：stop();3-7、将图层“图片1” 、“图片2” 、“图片3” 、“图片4” 、“图片5” 、“图片6” 、“图片7”的第1帧复制，均粘贴到“按钮”图层的第1帧处，并调整位置使其与原来的位置重

7、叠，并点击右键“转换为元件”，将其转换为按钮元件，并分别命名为“按钮1” 、“按钮2” 、“按钮3” 、“按钮4” 、“按钮5” 、“按钮6” 、“按钮7” 。3-8、打开“按钮1”的动作面板，输入语句：on(press) gotoAndPlay(1);依次类推，打开“按钮2” 、“按钮3” 、“按钮4” 、“按钮5” 、“按钮6” 、“按钮7”的动作面板，分别输入语句：on(press)gotoAndPlay(21);on(press)gotoAndPlay(41);on(press)gotoAndPlay(61);on(press)gotoAndPlay(81);on(press)goto

8、AndPlay(101);on(press)gotoAndPlay(121);3-9、音乐图层，延长至140帧，将库中准备好的音乐拖入舞台，上锁。2.4注意事项 “按钮效果”的flash动画主要是用按钮及按钮上的代码来控制图片的播放，即点击小图片，便可播放该图片，因此，动画帧数的设置及按钮代码的编写非常重要，只有正确制作才能实现相应的效果。3 “翻书效果”的flash动画3.1 设计思路 “翻书效果”的flash动画实现的主要功能是：点击播放按钮，即可像翻书一样一张张的观看图片，实现一种别样的图片展示效果。3.2 技术类型 “翻书效果”的flash动画主要运用影片剪辑的动画效果、图形的形状动画

9、效果，以及遮罩图层效果。同时，在场景中图层上写上相应的代码。3.3 制作流程1、素材准备：1-1、准备20张图片，用PS处理成：200*150像素。1-2、准备1张背景图片，PS处理成：600*450像素。1-3、荷花的动画。1-4、新建位图文件夹，将位图全部导入。2、制作“页”影片剪辑元件2-1、制作“封面” 影片剪辑元件，插入新建元件影片剪辑名为“封面”。2-2、新建五个图层，自下至上分别是：背景色、边线、花边、字、动画5个图层。如图2：图2 “封面”影片剪辑的图层2-3、背景色第1帧用矩形工具，无笔触，画一矩形：240*320，颜色：#333300，全居中。2-4、新建花边图案影片剪辑，

10、图层第1帧画花边图案，颜色：#666600，复制多枚排列如图3：图3 花边2-5、边线图层第1帧用矩形工具，笔触设为：1，颜色为：#000000，填充色关闭，画一矩形，选中右边线和下边线颜色换成#999900，选中全部边线转为图片元件名为“页线” 。2-6、字图层第1帧用文本工具写上“花之韵”字体：楷体_GB2312，大小35。颜色#996600。2-7、动画图层第1帧将库中准备好的荷花动画拖入，放在右下角的位置后，调整大小，如图4： 图4 封面3、制作“首页” 影片剪辑元件，将库中“封面”直接复制改名为“首页”3-1、双击进入“首页”编辑场面，自下至上分别是：背景色、边线、花边、字4个图层，

11、删除动画图层。3-2、打开字图层，写上字。如图5：图5 首页4、制作“封底” 影片剪辑元件，将库中“首页”直接复制改名为“封底” 。 4-1、双击进入“封底”编辑场面，自下至上分别是：背景色、边线、花边、文字、遮罩图片、遮罩文字6个图层。如图6：图6 “封底”影片剪辑的图层4-2、文字第一帧写上谢谢观赏和自己的名字。字体颜色#999900，适当调整位置。 4-3、遮罩文字第1帧用文本工具写上谢谢观赏，字体颜色#999900。4-4、遮片图片第1帧用矩形工具画一矩形，笔触无，线形填充左色标：#000000，Alpha值为0，中色标：#FFFFFF， Alpha值为100，右色标：#000000，

12、Alpha值为0，打开变形面板旋转到适当角度。20帧插入关键帧，第一帧矩形放在字的左边，20帧放在字的右边，回到第1帧创建形状补间，所有图层延长到20帧。在遮罩文字图层右键设为遮罩。最后效果如图7： 图7 封底5、 制作“页1” 影片剪辑元件，将库中“首页”直接复制改名为“页1” 。5-1、双击进入“页1”编辑场面，自下至上分别是：背景色、边线、花边、图案4个图层。5-2、图案图层中将文字和图片删除，将库中准备好的位图拖入全居中，并在图片下方写上“1”的页码，颜色#999900。如图8：图8 页15-3、接下来制作“页2” 、“页3”依此类推一直至“页20” 。6、制作“翻封面”影片剪辑元件。

13、6-1、插入影片剪辑元件名为“翻封面”新建8个图层，自下而上分别是：页1、光1、封面、高光2、遮罩1、首页、遮罩2、高光3、高光3遮罩共9个图。如图9：图9 “翻封面”影片剪辑的图层6-2、页1图层第1帧将库中“页1”影片剪辑元件拖入，左对齐、垂直中齐，X值：0；Y值：-150，延长至55帧，上锁。6-3、光1图层第1帧用矩形工具画一矩形，无笔触，填充为线性。打开颜色面板，中间添加一个色码：从左至右的色码依次为：#010101,Alpha值为0，#F9F9F9，Alpha值为25，#000000，Alpha值为0，矩形大小设为宽240，高320，X值为0，Y值为-150。设置如图10：图10

14、光16-4、封面图层第1帧将“封面”页影片剪辑元件放入，X值为0，Y值为-150。第28帧延长帧，第29帧插入空白关键帧，图层上锁。6-5、高光2图层点高光1图片右键复制，点高光2后点场景右键粘贴到当前位置。第28帧延长帧，第29帧插入空白关键帧，图层上锁。6-6、遮罩1图层第1帧用矩形工具，笔触无，填充色随意，画一矩形遮片宽240高320，X值为0，Y值为-150，右下角用线条划一斜线去掉小角。如图11： 第10帧、第20帧、第28帧插入关键帧，在第10帧处用线条工具划一斜线后去掉右下部分及线条，如图12。第20帧处也用线条工具划一斜线后去掉右下部分及线条，如图13。第28帧处用变形工具把遮

15、片调成宽166.5高392.5，X值为0，Y值为-242.5，再用线条工具画二条斜线。去掉下部分和左上部分，选中遮罩1图层创建形状补间，第55帧延长帧，删除第28帧后的形状补间。如图14： 图11 第1帧 图12 第10帧 图13 第20帧 图14 第28帧 6-7、首页图层第一帧将库中“首页”影片剪辑元件拖入，X值为225，Y值为135，打开变形工具把“首页”影片剪辑元件的注册点移到页的右下角，“首页”影片剪辑元件的左下角与“封面”影片剪辑元件的右下角交叉摆放，如图15，第10、20、40帧插入关键帧，第10帧移动“首页”影片剪辑元件右下角与“封面”影片剪辑元件的左下角对齐，如图16。第20

16、帧移动“首页”影片剪辑元件左上角与“封面”影片剪辑元件的右上角对齐，如图17，第40帧“首页”影片剪辑元件垂直中齐、右对齐，第55帧延长帧。如图18： 图15 第1帧 图16 第10帧 图17 第20帧 图18 第40帧6-8、遮罩2图层打开标尺，在“页”的底部和“页”的左面各拖一标尺线，第1帧用矩形工具，笔触无，画一矩形，笔触无，填充颜色随意，画一正方矩形大小16*16。放在封面页的右下角用线条工具斜角对斜角画一直线删除下半部并删除直线。也可用黑剪头选择工具放在矩形右下角，待鼠标出现小三角符号时向上推。如图19：第10帧插入空白关键帧，用矩形工具，笔触无，画一矩形，笔触无，填充颜色随意，画一

17、正方矩形大小240*240。用线条工具斜角对斜角画一直线删除下半部并删除直线。也可用黑剪头选择工具放在矩形右下角，待鼠标出现小三角符号时向上推。如图20：第20帧插入空白关键帧，用矩形工具，笔触无，画一矩形，笔触无，填充颜色随意，画一正方矩形大小300*240，X值为 -50，Y值为-145。把矩形左下角移到“封面”页上左下角压在竖标尺与横标尺之间，打开变形工具旋转-12度，调整好位置使矩形覆盖整个“首页”，用黑剪头选择工具放在矩形右下角，待鼠标出现小三角符号时向上推。或用直线工具划线删除。如图21：第21帧（如图22）、第28帧（如图23）、第33帧（如图24）分别插入关键帧，用黑剪头选择工

18、具放在矩形上，待鼠标出现小三角符号时，调整矩形。第40帧插入空白关键帧，用矩形工具，笔触无，画一矩形，笔触无，填充颜色随意，画一正方矩形大小258*462，把矩形右下角移到“页1”页上左下角压在竖标尺与横标尺之间，用黑剪头选择工具放在矩形的右上角上，待鼠标出现小三角符号时，调整矩形。第55帧延长帧。如图25： 图19 第1帧 图20 第10帧 图21 第20帧 图22 第21帧 图23 第28帧 图24 第33帧 图25 第40帧6-9、高光3图层做法和遮罩2的做法一样，第1 帧、第10帧（插入空白关键帧）、第20帧（插入空白关键帧）第21帧（插入关键帧）、第28帧（插入关键帧）、第33帧（插

19、入关键帧）、第40帧（插入空白关键帧），第55帧延长帧。不同地方是矩形用线形填充，笔触无，从左至右的色码依次为：#010101,Alpha值为0，#F9F9F9， Alpha值为25，#000000，Alpha值为0。6-10、高光3遮罩图层，做法与首页图层基本一样，第一帧用矩形工具，笔触无，画一矩形宽240，高320，打开变形工具把矩形的注册点移到右下角，矩形的左下角与“封面”影片剪辑元件的右下角交叉摆放，第10、20、40帧插入关键帧，第10帧移动矩形右下角与“页1”影片剪辑元件的左下角对齐。第20帧移动矩形左上角与“页1”影片剪辑元件的右上角对齐。第40帧矩形垂直中齐、右对齐，第55 帧

20、延长帧。7、制作“翻页3”影片剪辑元件，库中直接复制“翻封面”改名为“翻页3” ，双击进入编辑场景。7-1、增加和调整图层，从第1层开始，页1图层改为页3图层，在页3图层上增加首页图层，在光1图层上增加光1左、封面图层改为页1，首页图层改为页 2，自下而上分别是：页3、首页、光1、光1左、光1左遮罩、页1、高光2、遮罩1、页2、遮罩2、高光3、高光3遮罩共12个图。如图26：图26 “翻页3”影片剪辑的图层7-2、页3图层上（直接复制过来时是页1）增加首页图层，打开页3图层的锁，点第1帧后点场景中的图元件，点右键交换元件换成“页3”影片剪辑元件。点首页图层第1帧从库中拖入“首页”影片剪辑元件，

21、调整到适当位置。第50帧延长帧。7-3、光1图层上增加光1左图层，点光1图层第一帧复制帧粘帖到光1左图层第1帧，最后调整其到适当位置。7-4、页1图层（复制时是封面）点第1帧、点场景图元件，点右键交换元件换成“页1” ，延长帧至28帧，29帧插入空白关键帧。7-5、页2图层（复制时是首页）点第1帧、10帧、20帧、40帧，点场景图元件，点右键交换元件换成“页2” ，延长帧至55。这样“翻页3”影片剪辑元件就完成了。7-6、制作其它翻页影片剪辑元件，库中直接复制“翻页3” 影片剪辑元件改名为“翻页5” ，双击进入编辑，页3图层改为页5同时交换元件，首页图层改为页2同时交换元件，页1图层改为页3同

22、时交换元件，页2图层改为页4图层同时交换元件。最后库中直接复制“翻页5”改为“翻页7”修改方法同上，依此类推制作“翻页9” 、“翻页11” 、“翻页13” 、“翻页15” 、 “翻页17” 、“翻页19” 。只要掌握每图层交换元件时页数间隔1位，如页1交换页3、页2交换页4。8、制作“翻封底”影片剪辑元件，从库中直接复制“翻页19” ，双击进入编辑，按上面方法交换元件，所有图层延长到110帧。在最上面的图层（高光3遮罩层）的110帧上插入空白关键帧，点右键进入动作面板添加stop();代码。9、场景组合9-1、进入场景编辑，新建5个图层自下而上分别是：背景、按钮、文字、遮罩图片、文字遮罩、翻书

23、效果、音乐、代码共8个图层。如图27：图27 “翻书效果”flash动画图层9-2、背景图层。插入新建元件名：背景，类型：影片剪辑，将库中准备好的背景图片拖入，放到适当的位置。9-3、按钮图层，从公共库中选择合适的按钮放到舞台中，点中按钮打开动作面板，输入语句：on(press)play();_root.fs.play();9-4、在文字图层写上“花之韵” ，并放在合适的位置，延长至660帧，上锁。9-5、复制文字图层第1帧，粘贴到文字遮罩图层第1帧处，延长至660帧，上锁。9-6、在遮罩图片图层上，选取大小合适的图片，使第1帧处在文字左边，第20帧处在文字右边，并创建补间动画。复制这20帧动

24、画至660帧处，上锁。9-7、翻书效果图层第1帧将库中“翻封面”影片剪辑元件拖入场景把放至合适位置，实例名称写上fs,第55帧插上关键帧，右键点场景中元件交换元件换成“翻页3” ，第110帧插入关键帧交换元件“翻页5” ，依此类推在第165、220、275、330、385、440、 495、550插入关键帧，交换元件分别为“翻页7” 、“翻页9” 、“翻页11” 、“翻页13” 、“翻页15” 、“翻页17” 、“翻页19” 、“翻封底” 。9-8、音乐图层第1帧选中导入的音。延长帧至660帧，上锁。9-9、代码图层第1帧打开动作面板，输入语句：stop ();_root.fs.stop();

25、上锁，保存。3.4 注意事项 “翻书效果”的flash动画在制作过程中，灵活运用了遮罩层和形状不见动画，因此，需认真分析遮罩层和被遮罩层之间的关系，同时，还要区分形状补间和动画补间，以免出错。4 “电子相册效果”的flash动画4.1 设计思路 “电子相册效果”的flash动画实现的主要功能是：图片之间用遮罩层实现切换，逐渐过渡，同时，能够使它们像一个电子相册一样播放一张张的图片，实现图片展示效果。4.2 技术类型 “电子相册效果”的flash动画主要运用影片剪辑的编辑以及遮罩层的运用，使图片之间切换流畅，图片展示效果更好。4.3 制作流程1、素材准备1-1、准备11张图片，用PS处理成：55

26、0*400像素。1-2、准备1张背景图片，用PS处理成：600*450像素。2、编辑场景2-1、进入场景，在舞台点击右键，选择“文档属性” ，尺寸：宽600，高450.2-2、图层自下而上是：背景、相框、首页、梅花颂、遮罩1、图片2、图片3、遮罩3、图片4、遮罩4、图片5、遮罩5、图片6、遮罩6、图片7、遮罩7、图片8、图片9、图片10、遮罩10、图片11、尾页文字、尾页、遮罩文字、音乐25个图层。如图28： 图28 “电子相册效果”flash动画图层2-3、背景图层将背景图片拖入场景，X：0；Y:0；帧延长至280帧，上锁。2-4、相框图层用矩形工具，笔触颜色#999933；大小：7；宽：5

27、50；高：400。选中底边线和右侧边线，颜色#993300。2-5、首页图层第1帧，把图片1拖入场景，X：25；Y:25；第20帧，将该图片放大，第40帧处，将图片还原至第1帧处大小，创建补间动画，上锁。2-6、梅花颂图层，第1帧将“梅花颂”三字置于舞台外，第20帧，将这三个字置于舞台右侧，第40帧处，将这三个字置于舞台左侧，创建补间动画，上锁。2-7、遮罩1图层用矩形工具，笔触颜色#FF0000，宽：550；高：400，右键设置为遮罩层，上锁。2-8、新建影片剪辑“图片2”，图层2图层第40帧，将“图片2”拖入，X：25；Y:25；Alpha为10%，第60帧，Alpha为100%，上锁。2

28、-9、图片3图层将图片3拖入场景，X：25；Y:25；遮罩3图层第60帧，用矩形工具，笔触无，填充#FF0000，宽：550；高：400，X：-525；Y:25，第80帧，X：25；Y:25，创建补间动画，右键设置为遮罩层，上锁。2-10、图片4、遮罩4、图片5、遮罩5、图片6、遮罩6、图片7、遮罩7、图片10、遮罩10均根据不同的图片设置如图片3、遮罩3的遮罩。2-11、图片8、图片9通过图片位置变换，放大缩小来设置。2-12、尾页文字、遮罩文字图层均写“谢谢观赏” ，位置相同。2-13、尾页图层第240帧处，图片处在文字左侧，第260帧处，图片处在文字右侧，创建补间动画。第260至280帧

29、处，复制第240帧到260帧的动画。2-14、音乐图层将音乐拖入场景中，帧延长至280帧，上锁。4.4注意事项 “电子相册效果”的flash动画主要运用遮罩层来变换图层切换效果，因此，需正确处理遮罩层与被遮罩层之间的关系，实现更好的图片展示效果。5 “模糊效果”的flash动画5.1 设计思路 “模糊效果”的flash动画实现的主要功能是：当鼠标放在相应的数字上，与数字相对应的图片就会转到最前方来，同时，由模糊变为清晰。这是一种由动态与模糊渐变相结合的图片展示方式。5.2 技术类型 “模糊效果”的flash动画主要运用影片剪辑、按钮的编辑以及相应的代码等效果，鼠标经过按钮，即可触发相应的事件，

30、实现图片展示效果。5.3 制作流程1、素材准备：准备4张图片，用PS处理成：600*450像素。2、制作影片剪辑：2-1、新建影片剪辑，命名为“图片1”，第一帧处将准备好的图片“1”拖入，X：0；Y：0；上锁。2-2、新建影片剪辑，分别命名为“图片2” 、“图片3” 、“图片4” ，并做与影片剪辑“图片1”相同的步骤。3、制作按钮元件：3-1、新建按钮元件，命名为“元件1”，进入元件1，自下而上分别是：按钮背景、文字2个图层。如图29：图29 “元件1”按钮的图层3-2、按钮背景图层弹起帧处，用矩形工具，笔触颜色#00cc33，大小为3，填充颜色#003300，Alpha值为0，画一个50*5

31、0的矩形，X：0；Y：0。指针经过帧处，将填充颜色改为#003300，Alpha值为100。3-3、文字图层弹起帧处，写上“1” ，字体：楷体_GB2312，大小：30，颜色：#000000。指针经过帧处，字体：楷体_GB2312，大小：30，颜色：#FFFFFF。3-4、新建按钮元件，分别命名为“元件2” 、“元件3” 、“元件4” ，并做与“元件1”相同的步骤。4、编辑场景4-1、进入场景，在舞台点击右键，选择“文档属性” ，背景颜色为：#CCFFFF。4-2、图层自下而上是：图层1，图层2,两个图层。4-3、将4个影片剪辑和4个元件拖入场景中，放在相应的位置。如图30： 图30 “模糊效

32、果”flash动画场景4-4、影片剪辑“图片1” 、“图片2” 、“图片3” 、“图片4” 的实例名称分别为p1、p2、p3、p4。元件“元件1” 、“元件2” 、“元件3” 、“元件4” 的实例名称分别为p1_btn、p2_btn、p3_btn、p4_btn。4-5、打开图层“图层2”的动作面板，输入语句：/椭圆短半轴var H = 100;/椭圆长半轴var W = 170;/定义弧度的增量nvar n = 0;/定义椭圆的中心坐标var cenX = Stage.width/2-50;var cenY = Stage.height/2-100;/通过函数Move使3个mc位于椭圆上fun

33、ction Move() for (i=1; i=4; i+) /得到每个mc的弧度radian = 2*i*Math.PI/4;temp = thisp+i;/设置mc的坐标temp._x = cenX+Math.sin(n+radian)*W;temp._y = cenY+Math.cos(n+radian)*H;/函数setPosition设置当单击按钮是mc的移动情况function setPosition() for (k=1; k=0) max -= 3;mc.filters = new BlurFilter(max, max, 1); else delete this.onEnt

34、erFrame;Move();setPosition();5.4 注意事项 “模糊效果” 的flash动画主要是用代码来展示图片，实现图片的模糊渐变和动态过程，因此，制作过程中，需特别注意代码及数据的应用，深入理解才能达到理想的效果。6 “缓冲放大与缩小”的flash动画6.1 设计思路“缓冲放大与缩小”的flash动画实现的主要功能是：当按下鼠标拖动图片时，图片能够缓冲放大并移到最前面，当鼠标松开时，图片则缓冲缩小。这是一种自由控制的图片展示效果，我们能够随意的拖动并欣赏图片。6.2 技术类型 “缓冲放大与缩小”的flash动画主要运用影片剪辑的编辑以及相应的代码等效果，鼠标随意拖拽图片，图

35、片跟着鼠标移动位置并逐渐放大，以此来实现图片展示的效果。6.3 制作流程1、素材准备：准备10张图片，用PS处理成：600*450像素。2、制作影片剪辑：2-1、新建影片剪辑，命名为“pic0_mc”，第一帧处将准备好的图片1拖入，改变宽为120，高位90；X：0，Y：0；上锁。2-2、新建影片剪辑，分别命名为“pic1_mc” 、“pic2_mc” 、“pic3_mc” 、“pic4_mc” 、“pic5_mc” 、“pic6_mc” 、“pic7_mc” 、“pic8_mc” 、“pic9_mc” 并做与影片剪辑“pic0_mc” 相同的步骤。3、编辑场景3-1、进入场景，在舞台点击右键，

36、选择“文档属性” ，背景颜色为：#CCFFFF。3-2、图层只有“图层1”一个图层。3-3、将10个影片剪辑拖入场景中，放在相应的位置。如图31： 图31 “缓冲放大与缩小” flash动画场景 3-4、影片剪辑“pic0_mc” 、“pic1_mc” 、“pic2_mc” 、“pic3_mc” 、“pic4_mc” 、“pic5_mc” 、“pic6_mc” 、“pic7_mc” 、“pic8_mc” 、“pic9_mc”的实例名称分别为pic0_mc、pic1_mc、pic2_mc、pic3_mc、pic4_mc、pic5_mc、pic6_mc、pic7_mc 、pic8_mc 、pic9

37、_mc。3-5、打开图层“图层1”的动作面板，输入语句：for (var d:Number = 0; d=400) delete this.onEnterFrame;thispic+d+_mc.onRelease = function() stopDrag();this.onEnterFrame = function() this._xscale -= (this._xscale-100)/4;this._yscale -= (this._yscale-100)/4;if (this._xscale=100) delete this.onEnterFrame;6.4 注意事项 “缓冲放大与缩小

38、”的flash动画主要是用代码编写来展示图片，实现图片跟随鼠标拖动并放大与缩小的动画效果，因此，在制作过程中，代码及数据是特别重要的，只有灵活运用才能达到更好的图片展示效果。7 结束语FLASH是个很强大的制作动画软件，笔者毕业论文设计仅仅用到了这款软件的一小部分。关于图片展示的软件与方法有很多，每种方式都有自己独特的优势，用FLASH制作的图片展示系统更多的体现了图片切换之间的动感，使图片播放流畅，而且它还能实现镶嵌式的多方面、全方位的展示。在毕业设计的整个过程中，笔者收获的不仅仅是一篇完整的毕业作品，而且收获了许多经验，虽然困难很多，但是只要认真思考、勤学好问，就能学到许多知识。学海无涯，

39、希望在以后的过程当中，笔者能够继续努力学习，为将来的生活和事业打下坚实的基础。参考文献1王树伟,杨章玉.FLASH MX教程M.电子工业出版社,2005.2张世军,杨小顺,高明伟,关昕.FLASH 5 案例教程M.北京科海集团公司,2004.3程凤娟,王定,陈笑.flash max 2004 宝典M.电子工业出版社,2004.4黄汗兵.Show good 创作宝典之FLASH MX 教学课件与互动游戏M.人民邮电出版社,2005.5黄冈,于林.Macromedia Flash MX 标准教程M.北京希望电子出版社,2004.6孙志义.中文版Flash 8实例与操作M.航空工业出版社,2010.

40、7苏金国,荆涛.Flash ActionScript 3.0动画高级教程M.人民邮电出版社,2010.8袁媛.Flash动画创意设计M.电子工业出版社,2009.Based on the FLASH animation picture display system design and development Abstract:The author introduces five kinds of typical image display system,and should pay attention to the place to illustrate the flash animatio

41、n in the picture show in terms of actual effectiveness.The five flash animation arebutton effect,book effect,electronic album effect,blur,buffer amplifier and narrowing effect.This article mainly from the design,type of technology,production process,note four aspects analysis each kind of animation effects.Key words:image display;flash animation;design;technology;production process;matters needing attention