understanding the multi resolution support in axmol

[ghost]

hello innovator, hope you all are good, now can any one please help me to understand multi device support in adxe. i do have lots of pngs in my that project. so i could have to setup that way where i can easily able to work for sprites, menus, and ui as well. i have gone through the resolution policies which having there in documentation. but still confused which i have to use and how i do setup. thanks in advance everyone.

[DelinWorks]

Hi, what do you exactly want to achieve? it's really not clear what you want.
If you want to treat some objects as world objects and some as UI objects that follow the camera then you can do so by making a node follow the scenes camera and attach objects to it.

But first you want to set the design resolution to something like 720p so that the scene scale nicely on different screens, but then UI objects would look distorted! no worries you can use this function that makes it so that a node doesn't chase the design resolutions size:

inline void setNodeIgnoreDesignScale(cocos2d::Node* node) {
    Size actualFrameSize = Director::getInstance()->getOpenGLView()->getFrameSize();
    Size actualWinSize = Director::getInstance()->getWinSizeInPixels();
    if (Darkness::getInstance()->windowPolicy == ResolutionPolicy::SHOW_ALL && actualFrameSize.x >= actualWinSize.x)
        node->setScaleX(actualWinSize.width / actualFrameSize.width);
    if (Darkness::getInstance()->windowPolicy == ResolutionPolicy::SHOW_ALL && actualFrameSize.y >= actualWinSize.y)
        node->setScaleY(actualWinSize.height / actualFrameSize.height);
}

If you go to high resolutions (like 4K) UI will look very small because it chases the screen size, you can fix this by multiplying the UI's node size that we created before by some threshold (in this example if it goes over 1080p then it increases the size 133%)

inline void setNodeScaleFHD(cocos2d::Node* node)
{
    f32 res = Director::getInstance()->getOpenGLView()->getFrameSize().width +
        Director::getInstance()->getOpenGLView()->getFrameSize().height;

    if (res > 3001) {
        node->setScale(node->getScale() + (1.0f / 3.0f));
    }
}

This is what good and fluent UI looks with these function

See how the UI follows a size no matter what the window size is :)

Okay so resolution policies are a bit complicated but hear me out
EXACT_FIT, SHOW_ALL, FIXED_HEIGHT and FIXED_WIDTH are your only friends!

First of all EXACT_FIT makes it so that the screen is stretched according to your design resolution
My design Resolution is 720x1280 (16:9 aspect ratio) now if my screen size was to follow that ratio then everything will look good (ie. 768x1366 or 1080x1920 are still 16:9 so no stretching will occur)
But when it's different, then the engine will make it follow that aspect ratio no matter what
Example:

See! that is not what 720x1280 looks like so it's been stretched, this won't look too bad on wide screens like android and you could get away with it But in this case it does.

Second is FIXED_HEIGHT and FIXED_WIDTH these are what MOST games use
they make the resolution follow a single size axis

FIXED_HEIGHT makes the Y axis follow the design resolution's height which looks like this:

But with FIXED_WIDTH it's the opposite! it makes X axis follow the design resolution's width which looks like this:

SHOW_ALL crops the screen and makes it follow the design resolution truly, but that causes cropping

The area that was cropped is left black! the functions I mentioned above take care of the screen being cropped and scale UI elements for you!

Hope this clarifies things :) don't be afraid to ask!

[realgearinc]

Also add NO_BORDER to your Resolution Policies.

[ghost]

@DelinWorks we have done something. still we are doing. thanks for your extensive replay.