Cocos2d-x《雷电大战》(1)-双层地图无限滚动

Cocos2d-x 前端之家
前端之家收集整理的这篇文章主要介绍了Cocos2d-x《雷电大战》(1)-双层地图无限滚动，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
本文要实现飞机射击游戏中的地图无限滚动的功能，这里分为两个层，一个层无限向下滚动，一个层无限向上滚动，这样子结合起来效果就非常有层次感，也非常逼真，这里我把地图层都写成一个类，自己把地图改下，就可以成为你自己的了！下面，我们开始吧

先来看看效果：



Cocos2d-x版本：3.4

工程环境：VS30213

一、实现思路

其实就是两张图片，然后同时一起向下（向上）滚动，当一张图片完全出视野后，就把它调到最上面。形成两个图片交替出现，不过，一般为游戏中我们都感觉像是一张图片，那是因为两张图片的头尾连接处是连起来的。原理我画了些图：

二、代码

1、无限向下滚动BackLayerDown类

头文件：

[cpp] view plain @L_502_1@
  1. #ifndef__BackLayerDown_H__@H_301_79@
  2. #define__BackLayerDown_H__@H_301_79@
  3. /**@H_301_79@
  4. *功能實現無限地圖向下滾動@H_301_79@
  5. *作者林炳文（ling20081005@126.com博客：http://blog.csdn.net/evankaka）@H_301_79@
  6. *時間2015.2.27@H_301_79@
  7. */@H_301_79@
  8. #include"cocos2d.h"@H_301_79@
  9. #defineMAP_1_Tag1//宏定义两个Map的Tag@H_301_79@
  10. #defineMAP_2_Tag2@H_301_79@
  11. classBackLayerDown:publiccocos2d::Layer@H_301_79@
  12. {@H_301_79@
  13. public:@H_301_79@
  14. virtualboolinit();@H_301_79@
  15. CREATE_FUNC(BackLayerDown);@H_301_79@
  16. private:@H_301_79@
  17. voidupdate(floattime);@H_301_79@
  18. virtualvoidonExit();@H_301_79@
  19. };@H_301_79@
  20. @H_301_79@
  21. #endif//__BackLayerDown_H__@H_301_79@

实现文件：
[cpp] view plain @L_502_1@
  1. #include"BackLayerDown.h"@H_301_79@
  2. @H_301_79@
  3. USING_NS_CC;@H_301_79@
  4. @H_301_79@
  5. @H_301_79@
  6. boolBackLayerDown::init()@H_301_79@
  7. {@H_301_79@
  8. @H_301_79@
  9. if(!Layer::init())@H_301_79@
  10. {@H_301_79@
  11. returnfalse;@H_301_79@
  12. }@H_301_79@
  13. @H_301_79@
  14. SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
  15. Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
  16. @H_301_79@
  17. Sprite*map1=Sprite::create("back3_1.png");@H_301_79@
  18. Sprite*map2=Sprite::create("back3_2.png");@H_301_79@
  19. map1->setPosition(Vec2(visibleSize.width/2+origin.x,visibleSize.height/2+origin.y));@H_301_79@
  20. map2->setPosition(Vec2(visibleSize.width/2+origin.x,visibleSize.height+origin.y+map2->getContentSize().height/2));@H_301_79@
  21. this->addChild(map1,MAP_1_Tag);@H_301_79@
  22. this->addChild(map2,MAP_2_Tag);@H_301_79@
  23. this->scheduleUpdate();@H_301_79@
  24. @H_301_79@
  25. @H_301_79@
  26. returntrue;@H_301_79@
  27. }@H_301_79@
  28. @H_301_79@
  29. //移動并判斷背景@H_301_79@
  30. voidBackLayerDown::update(floattime)@H_301_79@
  31. {@H_301_79@
  32. SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
  33. Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
  34. @H_301_79@
  35. Sprite*temMap1=(Sprite*)this->getChildByTag(MAP_1_Tag);@H_301_79@
  36. Sprite*temMap2=(Sprite*)this->getChildByTag(MAP_2_Tag);@H_301_79@
  37. @H_301_79@
  38. temMap1->setPositionY(temMap1->getPositionY()-1);@H_301_79@
  39. temMap2->setPositionY(temMap2->getPositionY()-1);@H_301_79@
  40. @H_301_79@
  41. if(temMap1->getPositionY()+temMap1->getContentSize().height/2<=origin.y)@H_301_79@
  42. {@H_301_79@
  43. floatoffset=temMap1->getPositionY()+temMap1->getContentSize().height/2-origin.y;@H_301_79@
  44. temMap1->setPosition(Vec2(visibleSize.width/2+origin.x,temMap1->getContentSize().height/2+origin.y+visibleSize.height+offset));@H_301_79@
  45. }@H_301_79@
  46. @H_301_79@
  47. if(temMap2->getPositionY()+temMap2->getContentSize().height/2<=origin.x)@H_301_79@
  48. {@H_301_79@
  49. floatoffset=temMap2->getPositionY()+temMap2->getContentSize().height/2-origin.y;@H_301_79@
  50. temMap2->setPosition(Vec2(visibleSize.width/2+origin.x,temMap2->getContentSize().height/2+origin.y+visibleSize.height+offset));@H_301_79@
  51. }@H_301_79@
  52. }@H_301_79@
  53. @H_301_79@
  54. voidBackLayerDown::onExit()@H_301_79@
  55. {@H_301_79@
  56. this->unscheduleUpdate();@H_301_79@
  57. Layer::onExit();@H_301_79@
  58. }@H_301_79@


2、无限向上滚动BackLayerUp类

头文件：

[cpp] view plain @L_502_1@
  1. #ifndef__BackLayerUp_H__@H_301_79@
  2. #define__BackLayerUp_H__@H_301_79@
  3. /**@H_301_79@
  4. *功能實現無限地圖向上滾動@H_301_79@
  5. *作者林炳文（ling20081005@126.com博客：http://blog.csdn.net/evankaka）@H_301_79@
  6. *時間2015.2.27@H_301_79@
  7. */@H_301_79@
  8. #include"cocos2d.h"@H_301_79@
  9. #defineMAP_1_Tag1//宏定义两个Map的Tag@H_301_79@
  10. #defineMAP_2_Tag2@H_301_79@
  11. classBackLayerUp:publiccocos2d::Layer@H_301_79@
  12. {@H_301_79@
  13. public:@H_301_79@
  14. virtualboolinit();@H_301_79@
  15. CREATE_FUNC(BackLayerUp);@H_301_79@
  16. private:@H_301_79@
  17. voidupdate(floattime);@H_301_79@
  18. virtualvoidonExit();@H_301_79@
  19. };@H_301_79@
  20. @H_301_79@
  21. #endif//__BackLayerUp_H__@H_301_79@

实现文件：
[cpp] view plain @L_502_1@
  1. #include"BackLayerUp.h"@H_301_79@
  2. @H_301_79@
  3. USING_NS_CC;@H_301_79@
  4. @H_301_79@
  5. @H_301_79@
  6. boolBackLayerUp::init()@H_301_79@
  7. {@H_301_79@
  8. @H_301_79@
  9. if(!Layer::init())@H_301_79@
  10. {@H_301_79@
  11. returnfalse;@H_301_79@
  12. }@H_301_79@
  13. @H_301_79@
  14. SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
  15. Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
  16. @H_301_79@
  17. Sprite*map1=Sprite::create("back4_2.png");@H_301_79@
  18. Sprite*map2=Sprite::create("back4_1.png");@H_301_79@
  19. map1->setPosition(Vec2(visibleSize.width/2+origin.x,origin.y-map2->getContentSize().height/2));@H_301_79@
  20. this->addChild(map1,MAP_2_Tag);@H_301_79@
  21. this->scheduleUpdate();@H_301_79@
  22. @H_301_79@
  23. @H_301_79@
  24. returntrue;@H_301_79@
  25. }@H_301_79@
  26. @H_301_79@
  27. //移動并判斷背景@H_301_79@
  28. voidBackLayerUp::update(floattime)@H_301_79@
  29. {@H_301_79@
  30. SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
  31. Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
  32. @H_301_79@
  33. Sprite*temMap1=(Sprite*)this->getChildByTag(MAP_1_Tag);@H_301_79@
  34. Sprite*temMap2=(Sprite*)this->getChildByTag(MAP_2_Tag);@H_301_79@
  35. @H_301_79@
  36. temMap1->setPositionY(temMap1->getPositionY()+1);@H_301_79@
  37. temMap2->setPositionY(temMap2->getPositionY()+1);@H_301_79@
  38. @H_301_79@
  39. if(temMap1->getPositionY()-temMap1->getContentSize().height/2>=visibleSize.height)@H_301_79@
  40. {@H_301_79@
  41. floatoffset=temMap1->getPositionY()-temMap1->getContentSize().height/2-visibleSize.height;@H_301_79@
  42. temMap1->setPosition(Vec2(visibleSize.width/2+origin.x,-temMap1->getContentSize().height/2-origin.y-offset));@H_301_79@
  43. }@H_301_79@
  44. @H_301_79@
  45. if(temMap2->getPositionY()-temMap2->getContentSize().height/2>=visibleSize.height)@H_301_79@
  46. {@H_301_79@
  47. floatoffset=temMap2->getPositionY()-temMap2->getContentSize().height/2-visibleSize.height;@H_301_79@
  48. temMap2->setPosition(Vec2(visibleSize.width/2+origin.x,-temMap2->getContentSize().height/2-origin.y-offset));@H_301_79@
  49. }@H_301_79@
  50. }@H_301_79@
  51. @H_301_79@
  52. voidBackLayerUp::onExit()@H_301_79@
  53. {@H_301_79@
  54. this->unscheduleUpdate();@H_301_79@
  55. Layer::onExit();@H_301_79@
  56. }@H_301_79@

3、说明

其实这两个类可以写在一起的，但是这里我为了能让不同的需要分开，把它们分别写开了，要注意上面判断的方法，无限向下和无限向上判断方法是不样的，而且，这里为了防止出现黑边，要记得设置位置时要加上一定的偏移量，如上面函数中的offset,这里非常重要，如果没边上这个东东，有可能两张图片在切换时，有出现黑边。

三、使用方法

在要用到的地方，把头文件加上

   1: #include "BackLayerDown.h"
   2: #include "BackLayerUp.h"

然后在工程的init()函数添加：

1: Size visibleSize = Director::getInstance()->getVisibleSize(); 
   2: Point origin = Director::getInstance()->getVisibleOrigin();
   3: //这是地面图层
   4: this->addChild(BackLayerUp::create());
   5: //这是白云图层
   6: this->addChild(BackLayerDown::create());
   7: 
   8: //加个飞机
   9: Sprite *airplane_sprite = Sprite::create("air1.png");
  10: airplane_sprite->setPosition(Vec2(visibleSize.width / 2,visibleSize.height/ 5));
  11: this->addChild(airplane_sprite);

效果：


林炳文Evankaka原创作品。转载请注明出处http://www.jb51.cc/tag/http://blog.csdn.net/evankaka

猜你在找的Cocos2d-x相关文章

创建自定义的Cocos2d-x场景
操作步骤 1、创建cocos2d-x工程 2、新建 Scene1.cpp Scene1.h Scene1.h代码 #ifndef __SCE...
给vs2010安装上cocos2d-x的模版
开发环境：OS(WINDOWS 8.1 X64 企业版) cocos2d-x 2.2.1 vs2010 想给vs安装上cocos的模版，...
Python创建Cocos2d-x 2.2方法
把创建项目做成一个批处理，当创建项目时可以省时省力很多。 操作步骤 1、在 E:cocos2d-x-...
cocos2dx 物理碰撞
https://www.cnblogs.com/JiaoQing/p/3906780.html 四个响应函数 1 EventListenerPhysics...
cocos2d-js 自定义事件监听派发
转载于 http://www.cnblogs.com/kenkofox/p/3926797.html 熟悉js的dom事件或者flash事件的...
cocos常用 实用 公共函数 lua代码
公共资源加载，缓存retain；防止被自动销毁 2. 数字滚动递增；用于得奖后，总金币跳动增加...
cocos creator box2d
title Map 使用box2d var sfloors = this.tiledMap.getObjectGroup(‘Special_Floor‘).g...
（转）让quick-cocos2d-x支持加密的plist文件
前篇：quick-cocos2d-x图片资源加密 在前篇里面，我们实现了图片资源的加密，但还没有实现...
（转）quick-cocos2d-x图片资源加密(续)
摘要: 对在quick-cocos2d-x上实现的资源加密方法的补充 前篇： quick-cocos2d-x图片资源加...
Cocos Creator 动态改变sprite图片
首先将存放图片最外层文件夹命名为resources 　　 changeBj: function(){ 　　　　var url...
iOSAndroidSwiftHybridCocos2d-xFlutterXcodeSilverlightcocoaCordova
调试桥筛选栏假异步不会丢失AndPermissio权限申请抽屉式systemUI信号栏多行排列跨多行显示viewmode数据共享录制语音视频通话多行显示Studio3.5拉伸控件望远镜发动态走势图点赞控件显示牌冷启动v3签名v2签名v1签名本地html外接键盘流式标签