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