先来看看效果:
Cocos2d-x版本:3.4
工程环境:VS30213
一、实现思路
其实就是两张图片,然后同时一起向下(向上)滚动,当一张图片完全出视野后,就把它调到最上面。形成两个图片交替出现,不过,一般为游戏中我们都感觉像是一张图片,那是因为两张图片的头尾连接处是连起来的。原理我画了些图:
二、代码
1、无限向下滚动BackLayerDown类
头文件:
- #ifndef__BackLayerDown_H__@H_301_79@
- #define__BackLayerDown_H__@H_301_79@
- /**@H_301_79@
- *功能實現無限地圖向下滾動@H_301_79@
- *作者林炳文(ling20081005@126.com博客:http://blog.csdn.net/evankaka)@H_301_79@
- *時間2015.2.27@H_301_79@
- */@H_301_79@
- #include"cocos2d.h"@H_301_79@
- #defineMAP_1_Tag1//宏定义两个Map的Tag@H_301_79@
- #defineMAP_2_Tag2@H_301_79@
- classBackLayerDown:publiccocos2d::Layer@H_301_79@
- {@H_301_79@
- public:@H_301_79@
- virtualboolinit();@H_301_79@
- CREATE_FUNC(BackLayerDown);@H_301_79@
- private:@H_301_79@
- voidupdate(floattime);@H_301_79@
- virtualvoidonExit();@H_301_79@
- };@H_301_79@
- @H_301_79@
- #endif//__BackLayerDown_H__@H_301_79@
实现文件:
- #include"BackLayerDown.h"@H_301_79@
- @H_301_79@
- USING_NS_CC;@H_301_79@
- @H_301_79@
- @H_301_79@
- boolBackLayerDown::init()@H_301_79@
- {@H_301_79@
- @H_301_79@
- if(!Layer::init())@H_301_79@
- {@H_301_79@
- returnfalse;@H_301_79@
- }@H_301_79@
- @H_301_79@
- SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
- Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
- @H_301_79@
- Sprite*map1=Sprite::create("back3_1.png");@H_301_79@
- Sprite*map2=Sprite::create("back3_2.png");@H_301_79@
- map1->setPosition(Vec2(visibleSize.width/2+origin.x,visibleSize.height/2+origin.y));@H_301_79@
- map2->setPosition(Vec2(visibleSize.width/2+origin.x,visibleSize.height+origin.y+map2->getContentSize().height/2));@H_301_79@
- this->addChild(map1,MAP_1_Tag);@H_301_79@
- this->addChild(map2,MAP_2_Tag);@H_301_79@
- this->scheduleUpdate();@H_301_79@
- @H_301_79@
- @H_301_79@
- returntrue;@H_301_79@
- }@H_301_79@
- @H_301_79@
- //移動并判斷背景@H_301_79@
- voidBackLayerDown::update(floattime)@H_301_79@
- {@H_301_79@
- SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
- Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
- @H_301_79@
- Sprite*temMap1=(Sprite*)this->getChildByTag(MAP_1_Tag);@H_301_79@
- Sprite*temMap2=(Sprite*)this->getChildByTag(MAP_2_Tag);@H_301_79@
- @H_301_79@
- temMap1->setPositionY(temMap1->getPositionY()-1);@H_301_79@
- temMap2->setPositionY(temMap2->getPositionY()-1);@H_301_79@
- @H_301_79@
- if(temMap1->getPositionY()+temMap1->getContentSize().height/2<=origin.y)@H_301_79@
- {@H_301_79@
- floatoffset=temMap1->getPositionY()+temMap1->getContentSize().height/2-origin.y;@H_301_79@
- temMap1->setPosition(Vec2(visibleSize.width/2+origin.x,temMap1->getContentSize().height/2+origin.y+visibleSize.height+offset));@H_301_79@
- }@H_301_79@
- @H_301_79@
- if(temMap2->getPositionY()+temMap2->getContentSize().height/2<=origin.x)@H_301_79@
- {@H_301_79@
- floatoffset=temMap2->getPositionY()+temMap2->getContentSize().height/2-origin.y;@H_301_79@
- temMap2->setPosition(Vec2(visibleSize.width/2+origin.x,temMap2->getContentSize().height/2+origin.y+visibleSize.height+offset));@H_301_79@
- }@H_301_79@
- }@H_301_79@
- @H_301_79@
- voidBackLayerDown::onExit()@H_301_79@
- {@H_301_79@
- this->unscheduleUpdate();@H_301_79@
- Layer::onExit();@H_301_79@
- }@H_301_79@
2、无限向上滚动BackLayerUp类
头文件:
- #ifndef__BackLayerUp_H__@H_301_79@
- #define__BackLayerUp_H__@H_301_79@
- /**@H_301_79@
- *功能實現無限地圖向上滾動@H_301_79@
- *作者林炳文(ling20081005@126.com博客:http://blog.csdn.net/evankaka)@H_301_79@
- *時間2015.2.27@H_301_79@
- */@H_301_79@
- #include"cocos2d.h"@H_301_79@
- #defineMAP_1_Tag1//宏定义两个Map的Tag@H_301_79@
- #defineMAP_2_Tag2@H_301_79@
- classBackLayerUp:publiccocos2d::Layer@H_301_79@
- {@H_301_79@
- public:@H_301_79@
- virtualboolinit();@H_301_79@
- CREATE_FUNC(BackLayerUp);@H_301_79@
- private:@H_301_79@
- voidupdate(floattime);@H_301_79@
- virtualvoidonExit();@H_301_79@
- };@H_301_79@
- @H_301_79@
- #endif//__BackLayerUp_H__@H_301_79@
实现文件:
- #include"BackLayerUp.h"@H_301_79@
- @H_301_79@
- USING_NS_CC;@H_301_79@
- @H_301_79@
- @H_301_79@
- boolBackLayerUp::init()@H_301_79@
- {@H_301_79@
- @H_301_79@
- if(!Layer::init())@H_301_79@
- {@H_301_79@
- returnfalse;@H_301_79@
- }@H_301_79@
- @H_301_79@
- SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
- Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
- @H_301_79@
- Sprite*map1=Sprite::create("back4_2.png");@H_301_79@
- Sprite*map2=Sprite::create("back4_1.png");@H_301_79@
- map1->setPosition(Vec2(visibleSize.width/2+origin.x,origin.y-map2->getContentSize().height/2));@H_301_79@
- this->addChild(map1,MAP_2_Tag);@H_301_79@
- this->scheduleUpdate();@H_301_79@
- @H_301_79@
- @H_301_79@
- returntrue;@H_301_79@
- }@H_301_79@
- @H_301_79@
- //移動并判斷背景@H_301_79@
- voidBackLayerUp::update(floattime)@H_301_79@
- {@H_301_79@
- SizevisibleSize=Director::getInstance()->getVisibleSize();@H_301_79@
- Pointorigin=Director::getInstance()->getVisibleOrigin();@H_301_79@
- @H_301_79@
- Sprite*temMap1=(Sprite*)this->getChildByTag(MAP_1_Tag);@H_301_79@
- Sprite*temMap2=(Sprite*)this->getChildByTag(MAP_2_Tag);@H_301_79@
- @H_301_79@
- temMap1->setPositionY(temMap1->getPositionY()+1);@H_301_79@
- temMap2->setPositionY(temMap2->getPositionY()+1);@H_301_79@
- @H_301_79@
- if(temMap1->getPositionY()-temMap1->getContentSize().height/2>=visibleSize.height)@H_301_79@
- {@H_301_79@
- floatoffset=temMap1->getPositionY()-temMap1->getContentSize().height/2-visibleSize.height;@H_301_79@
- temMap1->setPosition(Vec2(visibleSize.width/2+origin.x,-temMap1->getContentSize().height/2-origin.y-offset));@H_301_79@
- }@H_301_79@
- @H_301_79@
- if(temMap2->getPositionY()-temMap2->getContentSize().height/2>=visibleSize.height)@H_301_79@
- {@H_301_79@
- floatoffset=temMap2->getPositionY()-temMap2->getContentSize().height/2-visibleSize.height;@H_301_79@
- temMap2->setPosition(Vec2(visibleSize.width/2+origin.x,-temMap2->getContentSize().height/2-origin.y-offset));@H_301_79@
- }@H_301_79@
- }@H_301_79@
- @H_301_79@
- voidBackLayerUp::onExit()@H_301_79@
- {@H_301_79@
- this->unscheduleUpdate();@H_301_79@
- Layer::onExit();@H_301_79@
- }@H_301_79@
3、说明
其实这两个类可以写在一起的,但是这里我为了能让不同的需要分开,把它们分别写开了,要注意上面判断的方法,无限向下和无限向上判断方法是不样的,而且,这里为了防止出现黑边,要记得设置位置时要加上一定的偏移量,如上面函数中的offset,这里非常重要,如果没边上这个东东,有可能两张图片在切换时,有出现黑边。
三、使用方法
1: #include "BackLayerDown.h"
2: #include "BackLayerUp.h"
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);