Problems with Multiple Resolutions / ContentScaleFactor


Hi all,

i have a beginners question about setting the ContentScaleFactor.

I have a default Layout in FullHD (1080x1920), so i set

           1920, ResolutionPolicy::NO_BORDER);

then I check the actual resolution of the device and apply it to the scaleFactor

Size frameSize = glview->getFrameSize();
float scaleFactor;

//iphone 6 Plus
if(frameSize.height == 1920)
    scaleFactor = 1;
//iphone 6
else if(frameSize.height == 1334)
    scaleFactor = 1334/designResolutionSize.height;
//iphone 5
if(frameSize.height == 1136)
    scaleFactor = 1136/designResolutionSize.height;
    //iphone 4
else if(frameSize.height ==960)
    scaleFactor = 960/designResolutionSize.height;

and set the ContentScaleFactor according to this


So for my iPhone5 i got a contentScaleFactor of 0.591667, which is correct I guess.

When I now add a BackgroundSprite with an original size of 1080x1920 i expected that the contentScaleFactor gets automatically applied to it like 10800.591667 and 19200.591667, so the result should be something like 640x1134 for the Sprite.

Sprite * sprite = Sprite::create("bg.jpg");
sprite->setAnchorPoint(Vec2(0, 0));// Anchor Point

But instead it seems to add the half on top of the original size. So the sprite is way too big.

printf("contentWidth: %f\n", sprite->getContentSize().width); //result: 1825.352173
printf("contentHeight: %f\n", sprite->getContentSize().height); //result: 3245.070557

I know there is something I may missunderstood, could anybody help?



No idea why, but if you swap numbers around, e.g. scaleFactor = designResolutionSize.height/1136;, it should give you the correct result.

Maybe the scale factor is the size of the screen compared to the design size, so if you get a number less than 1, that means it is smaller than the design size so it scale everything up to match it? If that makes sense haha


You actually probably don’t want to use setContentScaleFactor, though it exists in the engine so you are free to use it if it works for you. Unless I’m mistaken it’s an old artifact from porting from cocos2d-iPhone where contentScaleFactor is the same ratio used for retina iOS graphics scaling.

When developing iOS apps the device actually sets the content scale factor automatically at 1 for non-retina and 2 for retina. So that’s the reason it’s the opposite what you thought. What you are setting is the amount of scaling that should be applied to non-retina graphics (designed for 480x320 screen resolution).


Hm, ok. I just followed tutorials like

But if I don’t use the scaleFactor, what is the proper way to scale the sprites? If i just remove it, the sprite stays in it’s original size.
I know it’s not recommend to scale everything for performance and memory reasons, but in this case its just a prototype and i think i’ll save time by scaling than storing different Layouts.


If you use one type of image resources,
pEGLView->setDesignResolutionSize(designResolutionSize.width, designResolutionSize.height, kResolutionNoBorder)
you can just use this line instead of setScaleFactor


This still seems to be a really confusing issue 1 year on.
The templates for v3.10 still include both contentScaleFactor AND designResolution.

From what I understand contentScaleFactor feels completely contradictory to designResolution. DesignResolution defines one resolution at which the game is designed and scaled up/down on a device basis. ContentScaleFactor then confuses this by scaling assets and making them no longer fit/align to positions intended in the DesignResolution.
DesignResolution therefore becomes almost redundant since it is not obeyed fully.

Could it possibly be clearer to completely split the two and document that it’s not easy to use both together?
I faced the same problems where changing resolution had Labels and images scale incorrectly with a designresolution set which was fixed by removing any references to contentscalefactor


I am also facing same problems. Have a look at my test cases and please provide solution.