点击这里给我发消息 点击这里给我发消息
首页 > 行业资讯 > flash>详细内容

另一个种拼图游戏制作详解

添加时间:2010-1-5
    相关阅读: 软件 制作 优化
  最近一直致力于研究不使用任何其他软件将图片在FLASH MX里面进行任意的分割。
    主要用途:
1、制作拼图游戏。
2、制作图片动画效果。
    经过一段时间的研究,总结了一些体会特别在这里和大家一起分享。利用遮照或动态遮照可以很好的进行图片的分割,目前正在制作图片分割组件,完成后一定奉献给大家,希望各位多多提出宝贵的意见。
让我们先来看看效果: 点击开新窗口欣赏该FLASH动画![全屏欣赏]
定义场景的大小为:700*600
    一、制作基本的MC
    1、新建一个名为IMAGE的MC,放入将要被切割的图片(图片大小最好和场景大小一样)。 2、新建一个名为PZZLE的MC,绘制一个需要被切分成什么样形状的图形。如图:

3、新建一个名为PUZZLE PIECE的MC,将PZZLE和IMAGE两个MC放入。如图:

提醒:注意点的要对齐,即PZZLE的中心点和IMAGE的最左上角点与PUZZLE PIECE的中心对齐。
4、设置让PZZLE遮照IMAGE。
5、将该PUZZLE PIECE设置输入EXPORT标志为:PIECE 二、在主场景第1帧设置AS如下:

//初始化变量
var xx = 6;
var yy = 5;
var startX = 100;
var startY = 100;
//获取被分割图片大小和
var xy = xx*yy;
attachMovie("Piece", "P", 222);//捆绑库中输出名为PIECE的MC
var wi = P.Image._width;
var hi = P.Image._height;
P.removeMovieClip();
bg_mc.swapDepths(xy+2);
myname.swapDepths(xy+3);
_root.setMask(bg_mc);//这是增加的一个MC,用来遮照整个场景。
//获取分量
var xs = wi/(xx-1);
var ys = hi/(yy-1);
//定义拖动事件
piece_event = function(){//定义一个类
this.onPress = function(){
this.swapDepths(xy+1);
startDrag(this);
}
this.onRelease = function(){
if(this._parent._xmouse>startX && this._parent._xmouse<startX+wi && this._parent._ymouse>startY && this._parent._ymouse<startY+hi){
this._x = Math.round((this._x-startX)/xs)*xs+startX;
this._y = Math.round((this._y-startY)/ys)*ys+startY;
}
stopDrag();
}
//注册该类给piece对象
piece_event.prototype = new MovieClip();//将类继承MovieClip的属性和方法
Object.registerClass("Piece", piece_event);//注册类给输出标识为PIECE的MC
这样使每一个PIECE的MC都具有piece_event类的属性和方法
//复制图片,设置每个被分割图片位置
for(i=0; i<xy; i++){
var x = (i%xx)*xs;
var y = Math.floor(i/xx)*ys;
var p = attachMovie("Piece", "Piece"+i, i+1, {_x:startX+x, _y:startY+y});
p.Image._x-=x;
p.Image._y-=y;
p.Pzzle._xscale = xs;
p.Pzzle._yscale = ys;
}

三、总结:
1、利用动态复制可以实现动态的图片切割,对于制作拼图游戏是一种思路,这样
可以减少对图片的前期处理。
2、但对于大图片的复制会影响游戏的执行效率,建议运用在小的图片上。
3、关于类的运用在游戏中是很常见的,这样可以优化代码,提高工作效率。 本文作者:
咨询热线:020-85648757 85648755 85648616 0755-27912581 客服:020-85648756 0755-27912581 业务传真:020-32579052
广州市网景网络科技有限公司 Copyright◎2003-2008 Veelink.com. All Rights Reserved.
广州商务地址:广东省广州市黄埔大道中203号(海景园区)海景花园C栋501室
= 深圳商务地址:深圳市宝源路华丰宝源大厦606
研发中心:广东广州市天河软件园海景园区 粤ICP备05103322号 工商注册