Background scroll

cocos2d-x C++
#1

Hi guys, Im new at this forum and ive just started using cocos2d. Im liking cocos very much, but i dont know how to create a scrolling backgrounds to my game. Im using cocos2d-x v3 c++ and I searched for some tutorials, but ive just found tutorials to scrolling background on the version 2 of cocos2d. Could anyone post a link of some tutorials related or explain how do i do this? Thanks!!

#2

Hey, see the cocos2d-x flappy bird tutorials by @SonarSystems on youtube.
They are good. Any you can see other tutorials on cocos2d-x v3.x by him. Youā€™ll really appreicate the work

1 Like
#3

As @catch_up said we have loads of tutorials. Here is the link: https://www.youtube.com/channel/UCkJYfCcenyjHr3DZ9JWHbkQ

#4

Hi, thanks for your response, Sonar Systems has a lot of good videos! But the background on the flappy tutorial is fixed D:

#5

Hey, you can implement your background in similarity to the pipesā€¦

Anyways, the simple logic is belowā€¦ Put this in update method:

Make Spritebg, and clone it (there is something like clone in cocos2d-x, just see it because there is not need to create same sprite again.)
Let say it SpritebgClone
Now:
Note: My logic has assumption that 1 sprite Spritebg is large enought to cover width of the screen. Otherwise, logic may vary. Also, if you want 2 different background sprites to move adjacently then just create a new sprite instead of SpritebgClone.

Here is logic

Spritebg->setPositionX()=0;
SpritebgClone->setPositionX()=Spritebg->getContentSize().width;

NOTE:I am assuming that their anchors are changed to 0,0

Now, put on update function to schedule.

So, here is pseudo logic. It should be same as pipes, I guess

Update
{

/**********/
if(Spritebg->getPositionX() >= -Spritebg->getContentSize().width)

{
int position=Spritebg.getPositionX()-speedX; // Note - is important because u are going left
// you may also use MoveBy But then logic would be different.
MoveTo Spritebg to left to coordinates to position
}

// Check whether Spritebg has gone out on the left side,
else if(Spritebg->getPositionX() <= -Spritebg->getContentSize().width) // Dont forget ** - sign here**
{
Spritebg->setPositionX()=Spritebg->getContentSize().width;
}
/***********/
if(SpritebgClone->getPositionX() >= -SpritebgClone->getContentSize().width)
{
int position=SpritebgClone.getPositionX()-speedX; // Note - is important because u are going left
MoveTo SpritebgClone to left with coordinates to position
}

//Check whether SpritebgClone has gone out on the left side.
else if(SpritebgClone ->getPositionX() <= -Spritebg->getContentSize().width)
{
SpritebgClone->setPositionX()=Spritebg->getContentSize().width;
}
/***********/
}

This should workā€¦ If youā€™ve any problem you can always ask :smile:

#6

Woahhh, thanks a lot man!! ill try to implement this code and post the results :D. By the way, do you know if cocos2d has a specific class to make the main camera follows my character?

#7

Hey, you want to go UNITY wayā€¦ :smile:

Anyways, yes cocos2d has camera classā€¦ now more better in v3.3(as mentioned in the latest cocos news)

I would say you to look at API for thisā€¦ Otherwise this is the implementation in cocos2dJS v3.x
You may have a look at it. and try to udnerstand and convert into c++. It should be nearly similar

http://www.cocos2d-x.org/docs/tutorial/framework/html5/parkour-game-with-javascript/chapter7/en

#8

Have a look at this