doc92606
doc92606

Reputation: 701

Cocos2D Infinite Background Picture

I'm curious as to how to create an infinite background in cocos2d. For example lets say I was building an app with a man running from left to right, and I want him to run infinitely. Well in that case I would have to have an endless background so the man could keep running. I've continuously searched on this matter and have found nothing that actually works.

Any types of suggestions, answers, and tips are much appreciated.

Thanks

Upvotes: 4

Views: 2824

Answers (4)

bluestunt
bluestunt

Reputation: 479

Try this. It is very easily to implement and works well. Just follow the tutorial on the read me.

Upvotes: 0

Guru
Guru

Reputation: 22042

Try This:

 #define IS_IPAD (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
 #define MM_BG_SPEED_DUR       ( IS_IPAD ? (6.0f) : (2.0f) )



-(void)onEnter
{
    [super onEnter];
    [self initBackground];

    [self schedule: @selector(tick:)];
}


-(void)initBackground
{
   NSString *tex = @"BG/Background.png";//[self getThemeBG];

    mBG1 = [CCSprite spriteWithFile:tex];
    mBG1.position = ccp(s.width*0.5f,s.height*0.5f);
    [self addChild:mBG1 z:LAYER_BACKGROUND];

    mBG2 = [CCSprite spriteWithFile:tex];
    mBG2.position = ccp(s.width+s.width*0.5f,s.height*0.5f);

    mBG2.flipX = true;
    [self addChild:mBG2 z:LAYER_BACKGROUND];

}


-(void)scrollBackground:(ccTime)dt
{
    CGSize s = [[CCDirector sharedDirector] winSize];

    CGPoint pos1 = mBG1.position;
    CGPoint pos2 = mBG2.position;

    pos1.x -= MM_BG_SPEED_DUR;
    pos2.x -= MM_BG_SPEED_DUR;


    if(pos1.x <=-(s.width*0.5f) )
    {
        pos1.x = pos2.x + s.width;
    }

    if(pos2.x <=-(s.width*0.5f) )
    {
        pos2.x = pos1.x + s.width;
    }

    mBG1.position = pos1;
    mBG2.position = pos2;

}

-(void)tick:(ccTime)dt
{
    [self scrollBackground:dt];
}

Upvotes: 5

iiFreeman
iiFreeman

Reputation: 5175

CCTMXTiledMap can help you, but I'm afraid that you must handle end of map and add another manually. Check this tutorials how to use tiled maps in side-scrolling games, hope it will be useful for you:

http://www.raywenderlich.com/15230/how-to-make-a-platform-game-like-super-mario-brothers-part-1

Upvotes: 1

Brandon Lassiter
Brandon Lassiter

Reputation: 306

The easiest way would be to include two background images that mesh seamlessly together. (CCSprite would work fine for this) In your update method as soon as the first background is completely off of the screen move it back to the other side of the screen directly next to the second background and continually move both background images. Repeat this process for the second background as well.

Upvotes: 2

Related Questions