Two minutes for you to understand cocos2dx's screen adaptation policy

The cocos2dx screen adaptation policy has been sorted out. This article applies to developers who want to quickly understand cocos2dx adaptation.

Let's assume that the development is based on 854*480 screens. Of course, this is what cocos2dx says (Design Resolution ).

First, we will introduce several common functions of cocos2dx:

-> SetFrameSize () // sets the win32 simulator resolution.

I. Prepare image resources

Prepare a 854*480 image. Here, I use a red line to show the four sides of the image to make sure that the image cannot be fully displayed.

2. directly use three adaptation policies

// KResolutionNoBorder // kResolutionShowAll 854*480 visible (for example, on a 960*640 screen)

The above three principles will not be repeated here, detailed can refer to here: http://www.ityran.com/archives/4809

Since we are developing a game based on 854*480, we will set the design resolution to 854*480 here.

pEGLView->setDesignResolutionSize(854 ,480 ,kResolutionNoBorder);

View results

Next, we will set the win32 simulator resolution to 960*640. Let's take a look at the effect of the three adaptation policies.

Effect:

pEGLView->setDesignResolutionSize(854 ,480 ,kResolutionExactFit);

We can see that due to the stretching of the adaptation policy, both the x and y directions are filled and the screen size is not exceeded, but the image is distorted compared with the two pictures below.

KResolutionNoBorderEffect:

pEGLView->setDesignResolutionSize(854 ,480 ,kResolutionNoBorder);

It can also be seen that the red strokes on the left and right are gone. Because the screen ratio is different from the design ratio, the adaptation policy can fill the screen, but the source image exceeds the screen.

KResolutionShowAllEffect:

pEGLView->setDesignResolutionSize(854 ,480 ,kResolutionShowAll);

Here, this policy makes all the content of the design resolution visible, but because the actual screen ratio and the design resolution ratio are inconsistent, black edges may occur.

Iv. Explanation of resource resolution

For a game, multiple sets of image resources involve the use of different image resources at different screen resolutions. Simply put, the large screen uses a large image and the small screen uses a small image.

At the same time, because the image resource aspect ratio and the designed resolution aspect ratio may be different, you also need to scale the image resources according to a certain proportion.

See http://www.ityran.com/archives/4809 for details

The above is a simple introduction to cocos2dx resolution adaptation, which is suitable for you to quickly understand the entire set of adaptation policies. For more detailed principles, refer to the link provided in the article.