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 :)

  • \$\begingroup\$ 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? \$\endgroup\$
    – Savlon
    Commented Mar 2, 2013 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
[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".

  • \$\begingroup\$ 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 \$\endgroup\$
    – Caroline
    Commented Mar 3, 2013 at 12:51
  • \$\begingroup\$ @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. \$\endgroup\$
    – bummzack
    Commented Mar 3, 2013 at 12:58
  • \$\begingroup\$ 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 :/ \$\endgroup\$
    – Caroline
    Commented Mar 3, 2013 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

  • \$\begingroup\$ 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. \$\endgroup\$
    – bummzack
    Commented Mar 3, 2013 at 10:31
  • \$\begingroup\$ oops! yeh or just divide the window size by the tile size \$\endgroup\$
    – Savlon
    Commented Mar 3, 2013 at 11:02
  • \$\begingroup\$ 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 :/ \$\endgroup\$
    – Caroline
    Commented Mar 3, 2013 at 13:15
  • \$\begingroup\$ Ok, How big is your texture? and are you using CCSprite or CCTexture2D? \$\endgroup\$
    – Savlon
    Commented Mar 3, 2013 at 19:23

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .