注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

清风的博客

我为人人,人人为我。

 
 
 

日志

 
 

flash 美女拼图游戏  

2014-04-20 16:50:22|  分类: 【flash教程】 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
拼图的方法有多种,flash8以前使用的是图片在flash内部先分割为几块,再进行拼图游戏制作。
由于flash8有了位图类,所以,可以通过它来制作拼图游戏,这样就省去了分割之事(实际上只是将分割之苦交与程序去完成,还是需要分割的,:lol )。
闲话少说,言归正传。
1.打开flash,设置其长与宽分别是940*400,背景为黑色的"拼拼美女.fla"文件,见图1。 flash 美女拼图游戏 - 清风 - 清风的博客 1.jpg
下载 (9.08 KB)
2007-12-25 21:02
2.准备几张图片,长与宽不要差大多了就行。(我用了6张,500*345左右的),将它们分别导入到flash里,见图2。 flash 美女拼图游戏 - 清风 - 清风的博客 2.jpg
下载 (25.4 KB)
2007-12-25 21:02
打开库面板,分别为图片链接名为image1,image2,... image6,见图3。 flash 美女拼图游戏 - 清风 - 清风的博客 3.jpg
下载 (46.35 KB)
2007-12-25 21:02
3."拼拼美女.fla"文件共有3帧,见图4。 flash 美女拼图游戏 - 清风 - 清风的博客 4.jpg
下载 (18.73 KB)
2007-12-25 21:02
第一帧上的代码是:
stop();
//==   库中图片链接名
var imag_array:Array = ["image1", "image2", "image3", "image4", "image5", "image6"];
//````  打乱排列 ```````````````````````````````````````
imag_array.sort(function () {
        return Math.round(Math.random()) ? 1 : -1;
});
//=== walk  决定是否拼完了所有图片
var walk:Boolean = true;
//===   缓动类,图片产生运动特效 水平 垂直和旋转运动
import mx.transitions.Tween;
import mx.transitions.easing.*;
function img_mc_tween(target:MovieClip, xstart:Number, xend:Number, ystart:Number, yend:Number) {
        var myTweenx:Tween = new Tween(target, "_x", Strong.easeOut, xstart, xend, 1, true);
        var myTweeny:Tween = new Tween(target, "_y", Strong.easeOut, ystart, yend, 1, true);
        var myTweenr:Tween = new Tween(target, "_rotation", Strong.easeOut, 0, 360, 1, true);
}
//===   loading 检测
onEnterFrame = function () {
        var l:Number = _root.getBytesLoaded();
        var t:Number = _root.getBytesTotal();
        var p:Number = Math.round(l/t)*100;
        load_txt.text = "loading: "+p+"%";
        if (l == t) {
                delete onEnterFrame;
                this.play();
        }
};
复制代码
第2帧上是空的,留着它是为第3帧上的代码服务的
第3帧上的代码:
stop();
//导入位图等类
import flash.display.BitmapData;
import flash.filters.*;
import flash.geom.Rectangle;
import flash.geom.Point;
//   初始切割水平与垂直数,以及递增量
if (index == undefined && num == undefined) {
        index = 0;
        var n:Number = 4;
        num = n;
} else {
        //  最多水平与垂直数切割12刀
        if (num<14) {
                num += 2;
        }
        //  取库中图片                                               
        index += 1;
        if (index>Number(imag_array.length-1)) {
                timeBar_mc._visible = false;
                时间条背景._visible = false;
                walk = false;
                gameOver_txt.text = "你是拼图高手!";
                now_txt.text = "";
                gameover();
        }
}
now_txt.text = index+1+" / "+imag_array.length;
var finish_array:Array = new Array(num*num);
var bmp:BitmapData = BitmapData.loadBitmap(imag_array[index]);
var filter:BevelFilter = new BevelFilter(2, 45);
var w:Number = bmp.width/num;
var h:Number = bmp.height/num;
//====================
//===  样图  ======================================================================
showImage = this.createEmptyMovieClip("showImage", -5);
showImage.attachBitmap(bmp, -4);
showImage.filters = [new ConvolutionFilter(3, 3, [-2, -1, 0, -1, 1, 1, 0, 1, 2]), new ColorMatrixFilter([-1, 0, 0, 0, 255, 0, -1, 0, 0, 255, 0, 0, -1, 0, 255, 0, 0, 0, 1, 0])];
//浮雕  底片效果,颜色反转
var x0:Number = Stage.width/2-showImage._width/2;
showImage._x = x0;
showImage._y = 10;
showImage._alpha = 40;
var w0:Number = showImage._width;
var init_array:Array = [];
//==============  各张小图片的坐标   ======================================================
var xy_array:Array = [];
for (var i:Number = 0; i<num; i++) {
        for (var j:Number = 0; j<num; j++) {
                xy_array.push([x0+i*w, j*h]);
        }
}
//====================  画背景方格  ===================================================
this.createEmptyMovieClip("viewLine_mc", -1);
with (viewLine_mc) {
        lineStyle(1, 0x669933, 80);
        moveTo(0, 0);
        lineTo(w, 0);
        lineTo(w, h);
        lineTo(0, h);
        lineTo(0, 0);
        _visible = false;
}
for (var i:Number = 0; i<num*num; i++) {
        init_array.push([i, 1]);
        viewLine_mc.duplicateMovieClip("view"+i, i, {_x:xy_array[i][0], _y:10+xy_array[i][1]});
}
//===================
//=====  图片分割   ======================================================================================
for (var i:Number = 0; i<num*num; i++) {
        this["b"+i] = new BitmapData(w, h);
        this["b"+i].copyPixels(bmp, new Rectangle(xy_array[i][0]-x0, xy_array[i][1], w, h), new Point(0, 0));
        this["mc"+i] = this.createEmptyMovieClip("mc"+i, this.getNextHighestDepth());
        this["mc"+i].attachBitmap(this["b"+i], this.getNextHighestDepth());
        this["mc"+i].no = 0;
        this["mc"+i]._x = xy_array[i][0];
        this["mc"+i]._y = 10+xy_array[i][1];
        this["mc"+i].filters = [filter];
        //======  图片产生运动特效
        img_mc_tween(this["mc"+i], 10+xy_array[i][0], random(2) == 1 ? 10+random(160-w/2) : x0+w0+10+random(160-w/2), 10+xy_array[i][1], 10+random(bmp.height-h));
        //=====
        this["mc"+i].onPress = function() {
                d = this.getDepth();
                this.swapDepths(_root.getNextHighestDepth());
                this.startDrag();
        };
        this["mc"+i].onRelease = this["mc"+i].onReleaseOutside=function () {
                var n = this._name.substr(2, 3);
                var temNum:Number = 0;
                if (this.hitTest(_root["view"+n])) {
                        this._x = _root["view"+n]._x;
                        this._y = _root["view"+n]._y;
                        // ==  对象属性变1,表示放对了
                        this.no = 1;
                        finish_array[n] = [n, 1];
                        //  判断是否结束
                        for (var i:Number = 0; i<num*num; i++) {
                                if (finish_array[i][1] != undefined) {
                                        temNum += Number(finish_array[i][1]);
                                }
                                //====  如果两个二元数组中的元素一一对应了 ,游戏结束,重新出图                                                                                                   
                                if (temNum == num*num && init_array[i][0] == finish_array[i][0] && init_array[i][1] == finish_array[i][1]) {
                                        gameover();
                                }
                        }
                } else {
                        //======  图片产生运动特效
                        img_mc_tween(this, this._x, random(2) == 1 ? 10+random(160-w/2) : x0+w0+10+random(160-w/2), this._y, 10+random(bmp.height-h));
                }
                this.swapDepths(d);
                this.stopDrag();
        };
}
//=======  时间表
var s:Number = 0;
timeBar_mc._xscale = 100;
function runTimer() {
        s += 1;
        //300 =五分钟
        timeBar_mc._xscale = 100-100*(s/300);
        //=====                                                                                                                             
        if (timeBar_mc._xscale<=1) {
                gameover();
        }
}
var ID:Number;
if (walk) {
        ID = setInterval(runTimer, 1000);
}
//====  gameover                                                         
function gameover() {
        clearInterval(ID);
        for (var i:Number = 0; i<num*num; i++) {
                _root.bmp.dispose();
                _root["b"+i].dispose();
                _root["mc"+i].removeMovieClip();
                viewLine_mc.removeMovieClip();
                _root["view"+i].removeMovieClip();
        }
        timeBar_mc._xscale = 0;
        if (walk) {
                gotoAndPlay(2);
        }
}
复制代码拼拼美女.swf (179.87 KB) 拼拼美女.fla (218 KB)

 

  评论这张
 
阅读(12)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017