Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

I'm quite new to Cocos2d, does anyone know how to create a background that would be one fixed screen (no scrolling), with a small image just repeated to the whole size of the screen - depending on device?

The best way I can explain the look I'm after is something similar to repeating a small image for a website background.

Thank you in advance for any help :)

share|improve this question
    
Something like a tile map? and instead of different images, you just have one single image for every tile? use a nested for loop... I'm not the best with objective c, however i could give you an example in java and you can just convert it? –  Savlon Mar 2 '13 at 23:14

2 Answers 2

Since cocos2d is OpenGL based (sprites are just textured quads), you can create one large quad and modify the UV coordinates accordingly.

You don't have to mess with the UV coordinates yourself, cocos2d has some helper methods for that. In order to have an image repeat over the whole screen, you can do something like this:

// get the screen size
CGSize screenSize = [[CCDirector sharedDirector] winSize];

// create a sprite from file that will cover the whole screen
CCSprite* bg = [CCSprite spriteWithFile:@"image.png" 
    rect:CGRectMake(0, 0, screenSize.width, screenSize.height)];

// set texture parameters to repeat
ccTexParams params = {GL_LINEAR,GL_LINEAR,GL_REPEAT,GL_REPEAT};
[bg.texture setTexParameters:&params];

// position the quad at the center of the screen
[bg setPosition:ccp(screenSize.width * 0.5f, screenSize.height * 0.5f)];

Now you should have a sprite bg that covers the whole screen with the repeated texture from "image.png".

share|improve this answer
    
This isn't working it says assertion failure in and then the path leading to this function : code -(void) setTexParameters: (ccTexParams*) texParams { NSAssert( (width_ == ccNextPOT(width_) || texParams->wrapS == GL_CLAMP_TO_EDGE) && (height_ == ccNextPOT(height_) || texParams->wrapT == GL_CLAMP_TO_EDGE), @"GL_CLAMP_TO_EDGE should be used in NPOT dimensions");code –  Caroline Mar 3 '13 at 12:51
    
@Caroline looks like you're using a non-power of 2 texture. Try an image that has power of 2 dimensions, such as 32x32, 64x64, 128x128 etc. –  bummzack Mar 3 '13 at 12:58
    
I'm not getting any errors now but the image isn't showing up on screen because; CCTexture2D: Using RGB565 texture since image has no alpha :/ –  Caroline Mar 3 '13 at 13:26

Something along the lines of this...

NOTE: I have minimal knowledge of cocos2d/objective c

This is a nested for loop, If you would like to access data from each image at a later stage i'd suggest adding each tile to an array inside the nested for loop :) Hope this helps

    CGSize size = [[CCDirector sharedDirector] winSize];
    int TILE_SIZE = 57

    for (int y = 0; y < (size.height / TILE_SIZE); y++) {
        for (int x = 0; x < (size.width / TILE_SIZE); x++) {
            CCSprite *tile = [CCSprite spriteWithFile:@"Icon.png"];
            [tile setAnchorPoint:ccp(0, 0)];
            [tile setPosition:ccp(x * TILE_SIZE, y * TILE_SIZE)];
            [self addChild:tile];
        }
    }

The "57" in the set position method is the width and height of the image respectively.

If you want the images to fit perfectly in the screen then they will have to be resized accordingly

share|improve this answer
    
I think you should increment y and x by the tile size instead of doing y++ and x++. Otherwise you'll create way too many sprites. –  bummzack Mar 3 '13 at 10:31
    
oops! yeh or just divide the window size by the tile size –  Savlon Mar 3 '13 at 11:02
    
I tried this and only one image showed at the bottom corner, it didn't repeat it said; CCTexture2D: Using RGB565 texture since image has no alpha :/ –  Caroline Mar 3 '13 at 13:15
    
Ok, How big is your texture? and are you using CCSprite or CCTexture2D? –  Savlon Mar 3 '13 at 19:23

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.