连连看算法--cocos2d-x 环境下开发

Cocos2d-x 2019-05-18

先上一张图给大家看看

当大家看到这张图片的时候会看到周围一圈对号，这个是我做标记用的，当然 真正的开发游戏过程中 这些对号是不存在的。我这里想给大家说明的是 假如我们的 地图是14*8的 那么其实真正的地图布局应该是16*10 为什么要这么做呢 那是因为我们要让我们所有的路线都从我们规定的方格内经过，不能越界。如果你是14*8 的那么当四边上有可以连通的时候 就要做大量的判断来处理。那么为什么我们不避免这些问题呢。这样我们在规划路线的时候 就不存在了特殊的情况。
不知道大家是否明白我说的什么意思。如果不懂的话可以给我留言我会给大家回复 解答。
关于图片的生成我这里说一下 如何保证所有的图片 都是成对出现呢 这里有个前提条件就是我们的地图布局一定要成偶数。那么我们在生出图片的 我们每一次取出一张图片生成两个一模一样的 这样就保证地图里面所有的图片肯定是成对出现的。
主要代码是这样的

[cpp] view plain copy
  1. inttotalcout=this->row*this->cloum;
  2. CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("point.plist","point.png");
  3. CCArray*temparry=CCArray::create();
  4. //一次生成两张一样的
  5. for(inti=0;i<totalcout/2;i++){
  6. intnum=CCRANDOM_0_1()*35;//因为是图片的张数是从0到36张所以随机从0到35
  7. CustomSprite*phit1=CustomSprite::createWithSpritePicIndex(num,CCSize(picWidth,picHeight));
  8. CustomSprite*phit2=CustomSprite::createWithSpritePicIndex(num,picHeight));
  9. temparry->addObject(phit1);
  10. temparry->addObject(phit2);
  11. }

是不是很简单啊
至于如何把生成的东西给打乱。这个cocos2d-x 提供了很好用的方法那就是从数组中取出的时候 可以随机去取出。
下面把整个地图布局的方法给贴出来
copy
    boolLLKmapLayer::setUpdateView(){
  1. boolisRet=false;
  2. do{
  3. //得到需要的总张数//一定要是偶数
  4. }
  6. inti=0;i<row+2;i++){
  7. intj=0;j<this->cloum+2;j++){
  9. if((i==0)||(j==0)||(j==cloum+1)||(i==row+1)){
  10. CustomSprite*temp=CustomSprite::createWithSpritePicIndex(0,0); background-color:inherit">temp->displayCustome();
  11. temp->setX(j);
  12. temp->setY(i);
  13. temp->setAnchorPoint(ccp(0,0));
  14. temp->setPosition(ccp(45*(j-1),51*(i-1)));
  15. this->addChild(temp);
  16. this->totalArray->addObject(temp);
  17. }else{
  18. CustomSprite*phit=(CustomSprite*)temparry->randomObject();
  19. temparry->removeObject(phit,false);
  20. phit->setAnchorPoint(ccp(0,0); background-color:inherit">phit->setPosition(ccp(45*(j-1),153); word-wrap:normal; border:none; background-color:inherit">this->addChild(phit);
  21. llkArray->addObject(phit);
  22. phit->setX(j);
  23. phit->setY(i);
  24. this->totalArray->addObject(phit);
  25. }
  26. isRet=true;
  27. while(0);
  28. returnisRet;
  29. 是不是很少的代码就实现了这个功能了。
    下面就开始我们今天的重头戏 那就是连连看的主要算法
    首先先说明最简单 那就是一线贯通。


    大家看到我画的红线 是连连看中最简单的 两种连接方式
    只要两张图片 处于同一水平线或者同一垂直线如果两张图片中没有别的图片间隔就代表可以连通消除了
    主要代码

    copy

    //这个是横向检测
  1. CCArray*LLKAlgorithm::horizon(cocos2d::CCArray*llkArray,cocos2d::CCArray*hitArray){
  2. CustomSprite*hit1=(CustomSprite*)hitArray->objectAtIndex(0);//取出第一个
  3. CustomSprite*hit2=(CustomSprite*)hitArray->objectAtIndex(1);//取出第二个
  4. intx1=hit1->getX();//得到第一个X坐标
  5. intx2=hit2->getX();//得到第二个X坐标
  6. boolisda=x1>x2?true:false;//得出那个坐标肯后
  7. inttemp=isda?x1-x2:x2-x1;//获取两个两个点之间的间隔
  8. CCArray*temparray=CCArray::create();//记录两个点之间所经过的点
  9. if(temp==1){//表示两个是相邻的两个
  10. temparray->addObject(hit1);
  11. temparray->addObject(hit2);
  12. else{
  13. if(isda){
  14. temparray->addObject(hit1);
  15. temparray->addObject(hit2);
  16. inti=1;i<temp;i++){
  17. CustomSprite*hitteim=LLKAlgorithm::getCustByXandY(llkArray,x1-i,hit2->getY());
  18. //如果是已经消除的那么就可以继续查询
  19. if(!hitteim->getIsEliminate()){
  20. LLKAlgorithm::removeAllArray(temparray,153); word-wrap:normal; border:none; background-color:inherit">break;
  21. temparray->addObject(hitteim);
  22. returntemparray;
  23. //这个是纵向检测
  24. CCArray*LLKAlgorithm::vertical(cocos2d::CCArray*llkArray,87); background-color:inherit">inty1=hit1->getY();//得到第一个Y坐标
  25. inty2=hit2->getY();//得到第二个Y坐标
  26. boolisda=y1>y2?inttemp=isda?y1-y2:y2-y1;returntemparray;
  27. 其中返回的 array 就是两个图片的之间的路径包含两张图片在内。

    对于两张图片是否可以垂直相连或者横向相连这个我不用多讲大家都应该明白怎么去做。
    下面讲解一个拐角相连的情况
    首先我先上张图
    看到这张图片的时候大家先看蓝色矩形框里面 是两张可以经过一个拐角消除的图片但是怎么确定两张图片可以经过一个拐角就可以连接呢
    大家有没有发现 这两个张图片刚好是矩形的两个对角顶点 。也就是说围绕着两张图片我们可以画出一个最小的矩形，而矩形的其中两个顶点就是这两张图片。
    好大家如果理解了这里 我们就说下面的，如果不理解好好的想一下。既然已知矩形的 其中两个顶点，那么另外两个顶点的坐标也就轻松的计算出来。就是我们看到的两个绿色的框。
    我们先拿出最上面的那个绿色的矩形框，我们发现他不是一个空白或者说已经消除的一个图片 。那么这个顶点是不符合规则的。我们看下面的那个绿色矩形框。 我们惊奇的发现 他竟然和我们选择的那两张（蓝色框）图片能直接连通 也就是通过这个绿色的矩形框（已经消除掉的） 我们可以把他转化成 一个横向可以连通和一个纵向可以连通的。
    看到这里有的人或许已经恍然大悟了。其实我们要向知道两个点是否可以经过一个拐角相连，我们首先要确定两个图片的坐标点是可以画出一个矩形的并且这个矩形的两个对角顶点就是你选中的两张图片。（必须是对角）然后我们找出这两个矩形另外两个顶点的坐标，找到时候首先要确定找到这个顶点必须是已经消除的掉的一个空白在哪里，或者说没有阻碍物。如果找到一个这样的顶点，那么只要这个顶点能和我们刚开始选择的那两张图片 形成一个纵向的连通和一个横向的连通 那么就说明这两个点可以经过一个拐角进行相连。
    简单一点说就是 两个拐角的==想办法转成===》一个纵向连通+一个横向连通。
    说到这里不知道大家是否已经明白我所表达的意思。
    主要代码实现

    copy
    CCArray*LLKAlgorithm::oneCorner(cocos2d::CCArray*llkArray,cocos2d::CCArray*hitArray){
  1. //取出第一个
  2. //取出第二个
  3. intx1=hit1->getX();
  4. intx2=hit2->getX();
  5. inty1=hit1->getY();
  6. inty2=hit2->getY();
  7. boolisXg=x1>x2?//如果是true表示hit1在hit2的后面
  8. boolisYg=y1>y2?//如果是true表示hit1在hit2的上面
  9. //下面我们计算出矩形的另外的两个重点
  10. //先计算出在矩形上面所对应的
  11. inttemx=0;
  12. inttemy=0;
  13. //求取最上面的哪一个对应的坐标点
  14. if(isYg){
  15. temy=hit1->getY();
  16. temx=hit2->getX();
  17. temy=hit2->getY();
  18. temx=hit1->getX();
  19. //记录两个点之间所经过的点
  20. CustomSprite*hity=LLKAlgorithm::getCustByXandY(llkArray,temx,temy);//得到最上面的那个对应的矩形顶点的精灵图片
  21. CCArray*tempHit=CCArray::create();
  22. //顶点必须是已经消除的要不肯定不能贯通
  23. if(hity->getIsEliminate()){
  24. tempHit->addObject(hity);
  25. tempHit->addObject(isYg?hit1:hit2);
  26. CCArray*temx=LLKAlgorithm::horizon(llkArray,tempHit);//获取X方向上是否可以连通
  27. if(temx->count()>0){//表示可以连通
  28. temparray->addObjectsFromArray(temx);
  29. LLKAlgorithm::removeAllArray(tempHit,0); background-color:inherit">tempHit->addObject(isYg?hit2:hit1);
  30. CCArray*temy=LLKAlgorithm::vertical(llkArray,tempHit);
  31. if(temy->count()>0){
  32. temparray->removeObject(hity,153); word-wrap:normal; border:none; background-color:inherit">false);
  33. temparray->addObjectsFromArray(temy);
  34. //表示上面的路走不通
  35. if(temparray->count()==0){
  36. //获取X方向矩形所对应的的点
  37. //temx=isXg?hit1->getX():hit2->getX();
  38. //temy=isXg?hit2->getY():hit1->getY();
  39. temy=hit2->getY();
  40. temx=hit1->getX();
  41. temy=hit1->getY();
  42. temx=hit2->getX();
  43. CustomSprite*hitx=LLKAlgorithm::getCustByXandY(llkArray,0); background-color:inherit">//得到最上面的那个对应的矩形顶点的精灵图片
  44. if(hitx->getIsEliminate()){
  45. tempHit->addObject(hitx);
  46. tempHit->addObject(isYg?hit2:hit1);
  47. //获取X方向上是否可以连通
  48. //表示可以连通
  49. temparray->addObjectsFromArray(temx);
  50. tempHit->addObject(isYg?hit1:hit2);
  51. if(temy->count()>0){
  52. temparray->removeObject(hitx,0); background-color:inherit">temparray->addObjectsFromArray(temy);
  53. 下面我们说下拐两角 可以相连的。
    大家看看蓝色区域内的是我选择的两张图片。从图中我们看出这两张图片是可以经过两个拐角相连的。
    那么如何知道可以经过两个拐角可以 可以相连的 我相信通过上面那一个拐角的算法 大家或许就可以猜出来了。这里我详细说明一下 首先我们拿出一个点那么就像这个点的上下左右去找，找到一个 可以经过一个拐角和另外一个点相连的。经过一个拐角的算法请看上面那个讲解。首先找到的这个点可以和我们拿出的这个点纵向相连或者横向相连 。（但是必须保证这个点已经没有别的图片占位置或者说是一个空白）。如果能找到这样的一个点那么就可以说明我们开始选择的两个图片是可以经过两个拐角进行相连的。
    总体来说 可以这样理解两个拐角==转化成===》（一个横向相连/纵向相连）+ 一个拐角可以相连的
    一个拐角的看上面的解释。
    主要实现代码

    copy

    CCArray*LLKAlgorithm::twoCorner(cocos2d::CCArray*llkArray,87); background-color:inherit">boolisjiance=//这个主要来表示是否走了一个拐角的判断
  1. //先获取当前X的最大是多少y的最大是多少
  2. CustomSprite*lastCutom=(CustomSprite*)llkArray->lastObject();
  3. intmax=lastCutom->getX();
  4. intmay=lastCutom->getY();
  5. //随便拿出一个点向他的四个方向出发看看能否和另外一个变成一个拐角相连
  6. //这里我们就拿出取出的第一个点吧hit1
  7. //得到第1个Y坐标
  8. //首先向左检测
  9. CCArray*temphit=CCArray::create();
  10. temphit->addObject(hit2);
  11. inti=(x1-1);i>=0;i--){
  12. CustomSprite*tepcou=LLKAlgorithm::getCustByXandY(llkArray,i,y1);
  13. if(tepcou->getIsEliminate()){
  14. //判断看能否组成一个矩形
  15. temparray->addObject(tepcou);
  16. if(tepcou->getX()==hit2->getX()||hit2->getY()==tepcou->getY()){
  17. continue;
  18. isjiance=true;
  19. temphit->addObject(tepcou);
  20. CCArray*temparr=LLKAlgorithm::oneCorner(llkArray,temphit);
  21. if(temparr->count()>0){
  22. temparray->addObjectsFromArray(temparr);
  23. if(i==0){
  24. temphit->removeLastObject(break;
  25. if(isjiance==false){
  26. false;
  27. //向右检测
  28. inti=(x1+1);i<=max;i++){
  29. if(tepcou->getIsEliminate()){
  30. //判断看能否组成一个矩形
  31. temparray->addObject(tepcou);
  32. if(tepcou->getX()==hit2->getX()||hit2->getY()==tepcou->getY()){
  33. if(i==max){
  34. false){
  35. //向下检测
  36. inti=(y1-1);i>=0;i--){
  37. //向上检测
  38. inti=(y1+1);i<=may;i++){
  39. if(i==may){
  40. if(temparray->count()>0){
  41. returntemparray;

写到这里连连看的算法基本算是已经完成了
我在网上看了很多方法感觉不太容易理解，这个是我自己想出来的。感觉很通俗易懂，其实就是化繁为简。我最麻烦的变成最简单。不过连连看的算法有很多种。不如著名的A* 寻路算法就可以。不过我感觉那个给大家讲解其实会很麻烦，有希望了解了解的同学可以在百度上上搜索一下A* 寻路算法。
其实我子所以写这个练练看看的算法是交大家以后学习中的一种思路，有些同学一开始把问题弄得很复杂导致一时半会想不通，我建议刚开始考虑情况的时候从最简单的开始考虑。到繁琐的阶段的时候看看能不能转化成 简单的方式。中国人其实都喜欢大事化小 小事化了哈哈。 本章讲解结束。 至于重新布局+自动查找 等算法我会慢慢加进去 希望大家耐心等待。
另外给大家说下以后我所有的博客首发地址将会是天地会的论坛，由于我是他们哪里的原创管理。所以我以后在发布博客首发地址将会天地会感兴趣的同学可以关注一下

http://bbs.9ria.com/forum.php?mod=forumdisplay&fid=318



我给本算法起名字交错化繁为简 算法。
如果没有看懂的同学可给我留言，我给给大家仔细讲解一下
源码下载

相关文章

如何使用CCRenderTexture创建动态纹理 Cocos2d-x 2 1 4
    本文实践自 RayWenderlich、Ali Hafizji 的文章《...
Cocos-code-ide使用入门学习
Cocos-code-ide使用入门学习地点：杭州滨江邮箱：appdevzw@1...
Cocos2D-x-3.0 编译(Win7)
第一次開始用手游引擎挺激动！！！进入正题。下载资源1：从C...
Cocos2d-x 2 0 在Windows平台下的使用
    Cocos2d-x是一款强大的基于OpenGLES的跨平台游戏开发...
quick-cocos2d-x实例之挑战记忆极限设计文档
1.  来源 QuickV3sample项目中的2048样例游戏，以及最近《...
Cocos2d-x 3 X CMake MinGW版本编译运行
   Cocos2d-x3.x已经支持使用CMake来进行构建了，这里尝试...