FLASH CS4 设计拼图游戏

FLASH CS4 设计拼图游戏在本例拼图游戏中，如果拖动的小图片处于正确位置的附近时，释放鼠标即会将图片吸附到该位置上。

当所有的小图片都放置在正确位置时（即拼合成为一张完整的图像），就会提示游戏胜利。

另外，本游戏采用的是外部图片，游戏者可以自定义所要进行拼图的图片，以增强游戏的可玩性。

Flash拼图游戏如图13-24所示。

图13-24 Flash拼图游戏设计过程：（1）新建588×442像素的空白文档，在舞台中制作开始游戏界面，如图13-25所示。

图13-25 制作开始游戏界面（2）新建“猴子”影片剪辑元件，在舞台中制作两只猴子，并将其转换为影片剪辑。

然后，制作猴子上下飘动的动画，如图13-26所示。

图13-26 制作猴子上下飘动动画（3）返回场景，将“猴子”影片剪辑元件拖至舞台中，并为其绘制阴影，如图16-27所示。

图13-27 拖入猴子影片剪辑（4）新建“开始游戏”按钮元件，在舞台中制作按钮弹起、经过和按下的形状，并分别将其转换为影片剪辑元件，如图13-28所示。

图13-28 制作开始游戏按钮（5）返回场景，将“开始游戏”按钮元件拖至舞台的右下角，并设置其【实例名称】为Play_Btn，如图13-29所示。

图13-30 拖入开始游戏按钮（6）新建“背景”影片剪辑元件，在舞台中绘制一个渐变矩形，并在其左上角输入puzzleGame文字。

然后，将该影片剪辑元件导出为bg自定义类，如图13-31所示。

图13-31 制作游戏背景（7）新建“计时器”影片剪辑，在舞台中制作计时器界面，并设置“时间进度条”影片剪辑和动态文本的【实例名称】分别为timebar和Time_txt。

然后，将该影片剪辑导出为time_mc类，如图13-32所示。

图13-32 制作计时器（8）新建“计分器”影片剪辑，在舞台中制作计分器背景，并在其上插入一个动态文本，设置其【实例名称】为Score_txt。

然后，将该影片剪辑元件导出为score_mc，如图13-33所示。

图13-33 制作计分器（9）新建“卡通[游戏进行时]”影片剪辑元件，在舞台中制作卡通人物加油的动画。

然后，将该影片剪辑导出为player类，如图13-34所示。

图13-34 卡通人物加油动画（10）新建“卡通[游戏胜利时]”影片剪辑元件，在舞台中制作卡通人物胜利的动画，并将其导出为winner类，如图13-35所示。

图13-35 制作卡通人物胜利动画（11）新建“卡通[游戏失败时]”影片剪辑，在舞台中制作卡通人物失败的动画，并将其导出为falser类，如图13-36所示。

图13-36 制作卡通人物失败动画（12）在相同的文件夹中新建名称为Game的ActionScript文件。

然后在该文件中，使用import语句导入所需的类，以及创建Game自定义类和主函数。

代码如下所示：package{import flash.display.Sprite;import flash.display.MovieClip;import flash.display.Bitmap;import flash.display.BitmapData;import flash.events.MouseEvent;import flash.text.TextField;import flash.events.Event;import flash.display.Loader;import .URLRequest;import flash.geom.Rectangle;import flash.geom.Point;import flash.events.TimerEvent;import flash.utils.Timer;public class Game extends Sprite{public function Game():void{Play_Btn.addEventListener(MouseEvent.CLICK,playGame)//侦听开始按钮的单击事件，调用playGame()函数开始游戏}}}（13）创建delAll（）函数，以循环的方式将开始游戏界面中的所有对象删除。

代码如下所示：private function delAll():void{var num:int = this.numChildren;//获取舞台中存在对象的个数while(num != 0){//如果个数不为0this.removeChildAt(0);//删除舞台最底层的对象num--;}}（14）创建loadMC（）函数，将游戏背景图像显示到舞台中，并开始加载外部的拼图图像。

代码如下所示：private function loadMC():void{var BG:bg = new bg();//实例化背景图像对象BG.x = 0;BG.y = 0;//定义背景图像的位置addChild(BG);//将背景图像显示在舞台中var url:String = "img.jpg"; //外部图片的地址var req:URLRequest = new URLRequest(url);//创建URLRequest对象，捕获单个HTTP请求中的所有信息loader = new Loader(); //创建URLLoader对象loader.load(req); //开始加载外部图片loader.contentLoaderInfo.addEventListener(PLETE,onComplete);//侦听加载外部图像完成事件}（15）创建onComplete（）函数，读取加载图片的宽、高等相关信息。

然后，以位图图像的形式显示在舞台中。

代码如下所示：public function onComplete(event:Event):void{picW = loader.width;picH = loader.height;//获取图像的宽度和高度picBD = new BitmapData(picW,picH);//根据加载图像的高宽创建BitmapData对象var bitmap:Bitmap=new Bitmap(picBD);//创建位图图像picBD.draw(loader.content,null,null,null,null,true); //将加载的图片内容绘制到创建位图图像上bitmap.alpha=0FLASH CS4;mySprite = new Sprite();mySprite.addChild(bitmap);mySprite.x=10;mySprite.y=30;stage.addChild(mySprite);//将位图图像显示在舞台中copyPixel();//调用copyPixel()函数，将图像裁切成小图片}（16）创建copyPixel（）函数，用于将加载的大图片裁切成指定数目的小图片，并侦听这些小图片的鼠标按下和释放事件。

代码如下所示：private function copyPixel():void{var n:int = 3; //拼图的横纵向块数massWidth = Math.round(picW/n);massHeight = Math.round(picH/n);//定义小图片的宽和高leaveNum = n * n; //拼图的总块数var massBD:BitmapData;var massBitmap:Bitmap;var massSprite:Sprite;for(var i=0;i<n;i++){for(var j=0;j<n;j++){massBD = new BitmapData(massWidth,massHeight);//创建小图片的位图图像massBD.copyPixels(picBD,new Rectangle(i*massWidth,j*massHeight,massWidth,massHeight), new Point(0,0));//根据坐标和大小复制图像位图中的矩形区域至小图片上massBitmap=new Bitmap(massBD);massSprite=new Sprite();massSprite.x=stage.stageWidth-225+Math.random()*100;massSprite.y=stage.stageHeight-350+Math.random()*150; //定义小图片显示的位置massSprite.addEventListener(MouseEvent.MOUSE_DOWN,massDown);//侦听小图片的鼠标按下事件，调用massDown()函数拖动小图片massSprite.addEventListener(MouseEvent.MOUSE_UP,massUp);//侦听小图片的鼠标释放事件,调用massUp()函数停止拖动="MS"+i+j;//定义小图片的名称massSprite.addChild(massBitmap)//将小图片加入可交互显示对象中mySprite.addChild(massSprite);//将小图片加入到mySprite容器中}}}（17）分别创建massDown（）和massUp（）函数，用于开始拖动和停止拖动小图片。

其中，massUp（）函数还将判断是否达到游戏胜利的条件。

代码如下所示：function massDown(event:MouseEvent){event.target.startDrag(); //开始拖动图片mySprite.addChild(Sprite(event.target));//让拖动的图片显示在最上面}function massUp(event:MouseEvent){event.target.stopDrag(); //停止拖动图片var pici=Number(.charAt(2));var picj=Number(.charAt(3));//获取小图片名称中的位置标识if(Math.abs(event.target.x-pici*massWidth)<=20&&Math.abs(event.target.y-picj*massHeight)<=20){ //如果放置小图片的坐标与正确位置的坐标小于等于20event.target.removeEventListener(MouseEvent.MOUSE_UP,massUp);event.target.removeEventListener(MouseEvent.MOUSE_DOWN,massDown);//删除侦听小图片的鼠标按下和释放事件event.target.x=pici*massWidth;event.target.y=picj*massHeight;//小图片吸附到正确的位置score+=10;Score_MC.score_txt.text = score.toString();//分数加10，并显示在计分器中leaveNum--; //小图片剩余个数减1if(leaveNum<=0){//如果剩余的小图片个数小于等于0removeChild(Player);var Winner:winner = new winner();//实例化胜利卡通人物Winner.x = stage.stageWidth - Winner.width/2-10;Winner.y = 75;//定义胜利卡通人物的位置addChild(Winner);//将卡通人显示在舞台中myTimer.removeEventListener(TimerEvent.TIMER,startTime);myTimer.reset();//停止计时，并初始化计时器var Over:over = new over();//实例化结束对象Over.x = -Over.width;Over.y = stage.stageHeight/2;addChild(Over);Over.addEventListener(Event.ENTER_FRAME,moveTo);}}}（18）创建moveTo（）函数，将游戏胜利的提示信息以加速度的形式显示在舞台中。