Game Development Stack Exchange is a question and answer site for professional and independent game developers. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

This question already has an answer here:

I have used cocos2d-x to develop a game for iPhone 4, iPhone 4s, iPhone 5 with different screen sizes (3.5 inch and 4 inch)

First, my resource are designed for iPhone 4 and iPhone 4s with 3.5 inch screen size.

So if I want to use for iPhone 5 with 4 inch screen size. what should I do?

share|improve this question

marked as duplicate by Anko, Trevor Powell, Josh Petrie Jan 6 '15 at 18:21

This question was marked as an exact duplicate of an existing question.

I think you mean iPhone 4 and iPhone 5? The iOS Version has nothing to do with screen size. – bummzack Jul 7 '14 at 7:09

A simple solution is that using [[CCDirector sharedDirector] convertToUI] and not using it. If you want to place align top, using convertToUI or else using normal ccp(x, y). Also you need to write a method to resize the area that need to fill up the screen;

Another good option is to use the CocosBuilder to create the user interface; Can know more at the following URL:

share|improve this answer

cocos2D-x 2.x and 3.x have very easy solution for multi-resolution problem ( either iDevices or Android devices) As you can see in Multi-resolution support document.

In fact you just need to set your DesignResolution and then just imagine your target device will has this resolution.

If target device really has this resolution ( or any other with same ratio) cocos2d will handle to fix screen and your game looks same in all devices.

And when ratio of target device is different, you have many option ( policy) to manage that.

For example if you use Exact fit policy, cocos2d will force your game ( and design) to fit target device screen (without that black boarder).

Exact fit

The entire application is visible in the specified area without trying to preserve the original aspect ratio. Distortion can occur, and the application may appear stretched or compressed.

For more detail just take a look at the official wiki.

Beside all above word, I found This Link (from V-Play engine) and Its Safe Zone definition really interesting and I highly recommend you to use recommended-resolution-value of this page for your work as I did.

Although this link is from another engine but the description helps you understand everything better. Here is a map between this page terms to cocos2d-x terms:

V-Play::letterbox => Cocos2dx::Show All

V-Play::ZoomToBiggerSide => Cocos2dx::NoBorder

How about required image size ?

As you know the different size of image is not about game-look in different resolutions and you can publish your game with one size for each asset and your game/app looks good in all resolution with above description for resolution Policies.

But we need multiple image-size for each asset, to optimize memory usage. in this case ( as cocso2dx solution) we check device size and mark appropriate set of image ( each image set is in one folder with same-structure/different-size like HDR/HD/SD) as default folder of resource:

    CCSize frameSize = pEGLView->getFrameSize();

    if (frameSize.height > mediumResource.size.height)
        searchPath.push_back(; //mark HDR default
        pDirector->setContentScaleFactor(largeResource.size.height/designResolutionSize.height); //handle scaling because of different between our programming-design-resolution and artist-design-canvase-resolution
    else ...
share|improve this answer

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