flash立体小方块拼图游戏的实现思路

系统 1704 0

YangPuXiao的这个帖子里提了一个关于立体小方格拼图的游戏:
http://bbs.actionscript3.cn/thread-17085-1-1.html
,这里给出一个基本实现的思路,以及程序流程和演示。
先来看一下实现后的效果,因为是临时做得所以代码不规范也没有做吸附算法,所有的东西也都是写在时间轴上面的。
还是按照我的惯例通过图文讲解主要环节的考虑,形象大使的还是我们的“葡萄MM“。
讲解
1、基本思路
小方格拼图由于他的每一个拼图外形都不会是规则的,可能是L型,可能是T型,所以我们无法把每一个部件作为独立的物体来处理遮挡关系。但是因为他的基本型是小方块,如果我们排序通过小方块来处理,那么一起都会非常简单了。可以用N中方法来处理小方块基本型的排序。
排序解决了那么我们解决拖动问题?我们需要拖动的不是一个小方块而是由许多小方块拼起来的拼图部件。想想我们在Flash cs3中经常用到的Ctrl+G群组功能,我们只要把不同的拼图部件作为一个组,拖动组里面的任何一个方块都将移动这个群组里面的所有小方块,然后在松开鼠标的时候解除群组。按照上面说得小方块来做一次遍历排序不就行了?
2、群组的实现
我们给每一个拼图部件设置一个拼图数组,数组里面的每一个元素记录这一个小方格的编号。同时,每一个小方格也都有一个属性记录了自己在哪一个组里面。这里例子里面用到了5个部件,所以我定义了5个数组来保存。

3、拖放群组任意一个成员移动群组的实现
这个其实很简单,一说就能明白了。我们定义了一个空的Sprite始终在场景的最上层,当我们拖动群组中某个成员的时候把这个群组中所有的对象都加入到这个空的Sprite里面。让这个Sprite跟着鼠标拖动就好了。停止拖动的时候,我们在把放到Sprite里面的这些对象取出来(相当于取消群组)再放回到场景里面,再把Sprite重新放在场景最上层。
因为刚刚拖动的是sprite,所以只有Sprite的坐标变化了,释放的时候需要把群组里面每一个对象的坐标调整到新坐标,同时重新把Sprite的坐标置为0,0. 
复制内容到剪贴板
代码:
这是拖放的关键代码:
function group(index:int)
{
//见下面的完整代码
}
function ungroup(index:int)
{
//见下面的完整代码
}
this.addEventListener(MouseEvent.MOUSE_DOWN,onmouseDown);
this.addEventListener(MouseEvent.MOUSE_UP,onmouseUp);
function onmouseDown(evt:MouseEvent)
{
clickGroupIndex=evt.target.name.substr(5);
group(int(clickGroupIndex));
sprite.startDrag();
alpha=0.5;
}
function onmouseUp(evt:MouseEvent)
{
      ungroup(int(clickGroupIndex));
sprite.stopDrag();
}

4、深度排序的实现
考虑到这只是个简单的例子,所以我通过这种方式来确定每个小方块的层级应该在上面还是下面。
规则:方块的屏幕y值越大则层级越高,如果Y值相等则X值越大层级越高。
我们先遍历一下场景中所有的方块都记录在同一个数组里面,然后为每个方块增加一个deep属性,最后通过数组的sort方法,根据deep属性排一次顺序。最后从第一个开始把排好序的数组中的每一个方块重新addChild一遍就OK了。
复制内容到剪贴板
代码:
function sortDeep(a,b)
{
if(a.deep>b.deep)
return 1;
else if(a.deep
block1.group=1;
block2.group=1;
block3.group=1;
block4.group=1;
block5.group=2;
block6.group=3;
block7.group=3;
block8.group=3;
block9.group=3;
block10.group=4;
block11.group=4;
block12.group=4;
block13.group=5;
block14.group=5;
block15.group=5;
block16.group=5;
this.addEventListener(MouseEvent.MOUSE_DOWN,onmouseDown);
this.addEventListener(MouseEvent.MOUSE_UP,onmouseUp);
checkDeep();
function onmouseDown(evt:MouseEvent)
{
clickGroupIndex=evt.target.name.substr(5);
group(int(clickGroupIndex));
sprite.startDrag();
alpha=0.5;
}
function onmouseUp(evt:MouseEvent)
{
ungroup(int(clickGroupIndex));
sprite.stopDrag();
alpha=1;
checkDeep();
}
function sortDeep(a,b)
{
if(a.deep>b.deep)
return 1;
else if(a.deep
本文转自:http://www.5uflash.com/flashjiaocheng/Flashyingyongkaifa/4678.html

flash立体小方块拼图游戏的实现思路


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论