CCSpriteFrame rectInPixels on retina device

Question

I am creating an explosion sprite animation with the following code, the image is 440x440 pixels (a 4x4 grid of 110x110 pixel frames), with a -hd image of 880x880 (which is being loaded on the retina device);

CCTexture *explosionTexture = [CCTexture textureWithFile:@"explosion.png"];
NSMutableArray *frames = [NSMutableArray array];
int frameCount = 0;
for (int y = 0; y < 4; y++) {
    for (int x = 0; x < 4; x++) {
        CCSpriteFrame *frame = [CCSpriteFrame frameWithTexture:explosionTexture
                                                  rectInPixels:CGRectMake(x*110, y*110, 110, 110)
                                                       rotated:NO
                                                        offset:CGPointZero
                                                  originalSize:CGSizeMake(440, 440)];
        [frames addObject:frame];
        frameCount++;
        if (frameCount == 14) break;
    }
}

This works fine on non retina iPhone but when i test on retina iPhone the rect is wrong (each frame is 1/4 the size it should be)

I have put the frame.rect and the x / y from the for loops in an NSLog and it shows this on the retina device;

2014-05-09 23:22:10.872 SimpleGame[4131:70b] x:0, y:0
2014-05-09 23:22:10.872 SimpleGame[4131:70b] frame.rect:{{0, 0}, {55, 55}}
2014-05-09 23:22:10.873 SimpleGame[4131:70b] x:1, y:0
2014-05-09 23:22:10.873 SimpleGame[4131:70b] frame.rect:{{55, 0}, {55, 55}}
2014-05-09 23:22:10.874 SimpleGame[4131:70b] x:2, y:0
2014-05-09 23:22:10.874 SimpleGame[4131:70b] frame.rect:{{110, 0}, {55, 55}}

and this on the non retina device;

2014-05-09 23:22:10.872 SimpleGame[4131:70b] x:0, y:0
2014-05-09 23:22:10.872 SimpleGame[4131:70b] frame.rect:{{0, 0}, {110, 110}}
2014-05-09 23:22:10.873 SimpleGame[4131:70b] x:1, y:0
2014-05-09 23:22:10.873 SimpleGame[4131:70b] frame.rect:{{110, 0}, {110, 110}}
2014-05-09 23:22:10.874 SimpleGame[4131:70b] x:2, y:0
2014-05-09 23:22:10.874 SimpleGame[4131:70b] frame.rect:{{220, 0}, {110, 110}}

The docs do say (and is obvious by the name) rectInPixels is calculated in pixels (not points). Is this correct? if so this seems completely counter intuitive and unhelpful to me, why not simply calculate in points? so how do i calculate the correct rect for retina and non-retina?

This is really confusing me as i'm positive this was working as is a day ago and all I have changed since it was working is the dimensions of the image.

It's late so I may just be missing something really obvious but I can not seem to figure this out so any help would be greatly appreciated!

Answer 1

The frame rect you log is in points again, so this is actually correct based on your code. What you are missing is to multiply the pixel size with contentScale to create actual pixel coordinates and size for Retina textures:

CGFloat texScale = explosionTexture.contentScale;
CGRect rectInPixels = CGRectMake(x*110*texScale, y*110*texScale, 110*texScale, 110*texScale);

This is assuming that you have a 2x scaled texture with -hd suffix (explosion-hd.png). If you only have one image the code above won't change anything because you would be using the same texture on a display that has 4x as many pixels, therefore the texture would appear to be half as big as on non-retina devices.