Multi resolution Support for Cocos Studio 2 problem solved! :D

Never used cocos studio

But , I always get problems with multi resolutions

Anyway i was using texturepacker to make spritesheet , for most devices

The problem with android devices, they are many and have different screen size

I will give your solution a try… Thanks for share

it works good for my background image but buttons are not correct any suggestions ?

what do u mean by not correct like not scaled correctly or placed correctly?

it is not placed correctly. It does not care if Position is in Pixel or Percent. I’m using Coco Studio v2.2.5 and cocos2d-x 3.4. Here is how I load my cab.

glview->setDesignResolutionSize( 1242, 2208, ResolutionPolicy::NO_BORDER );

cocos2d::FileUtils::getInstance()->addSearchPath("res");
auto menu = cocos2d::CSLoader::createNode("menu_start_scene.csb");

auto t = glview->getFrameSize();
auto size = Director :: getInstance () -> getVisibleSize ();
auto scene = cocos2d::Scene::create();
menu-> setContentSize (size);
cocos2d::ui::Helper::doLayout(menu);
scene->addChild(menu);

Instead of NO_BORDER use FIXED_HEIGHT for portrait or FIXED_WIDTH for landscape

i did. buttons are still glued to left side instead of centered. Here are my settings in CocoStudio


And here is my scene tree in CocoStudio

did u try unpinning the buttons

yes. it moves the button close to the right side. maybe my designResolution is wrong. Where do i configure designRes in CocoStudio ?

top left out can choose different design resolutions

choosing a custom design resolution solved some issues.
Position and Size need to be in Pixel. Percent seems not to work.
Is it possible to scale subnodes ?
I have a compound object (see scene tree image). this compound object has an image and a text. This node seems not to scale properly.
Oh and anchor points require to be (0,0)

@iChris might be unrelated but in the editor you seem to have used commas (,) instead of dots (.) between all your positions, anchor points etc. Maybe that’s not a problem. But all the ones in mine have . dots and floats require dots after the number (floating point) eg. 50.0f. It might be parsing the data wrong if it’s got a comma in the number. Just a guess.

1 Like

@UKDeveloper99 this seems to be a localize thing my keyboard is set to german layout and uses commas. Editor displays a 0,5 0,5 anchor point centered and all default values using commas. I will check it anyway. Thanks for that hint

@HUTHUT Could you provide a example project via github for example? That would help other users extremely.

I tried your approach and it perfectly positions the nodes (i think). Looks like this (FIXED_WIDTH)

Am I right that the background-image(s) should be made “bigger” to support every possible resolution and the “main aspect” should be placed according to portrait/landscape (for portrait top to bottom, landscape left to right)? Does anyone have a good knowledge of how big the size the background image should have for landscape and portrait? Just trying to get best practice :slight_smile:

I’ll put up an example project later tonight and i found out it works with android devices too and i’ll put that on a readme on github and yes the background images should be bigger to support every device but I’m still learning more and trying to find the best practice as well. Cocos Studio is new and theres more i still don’t about it.

1 Like

Hey guys i added an in-depth tutorial about what i know so far about multi resolution with an example project and some android configuration here: https://github.com/HUTHUTGames/Cocos-Studio-2-Multi-Resolution-Support

I hope it helps guys :smile:

1 Like

Thanks for sharing your solution but I tried your code and it doesn’t work for me. I can’t replace these lines in AppDelegate.cpp:


if(!glview){
        glview = GLViewImpl::createWithRect("CocosProject", Rect(0, 0, 640, 960));
        director->setOpenGLView(glview);
    }
    director->getOpenGLView()->setDesignResolutionSize( 640, 960, ResolutionPolicy::NO_BORDER )

with:


auto glview = director->getOpenGLView();
    // set design resolution to same resolution as what you published it in Cocos Studio and use FIXED_WIDTH for landscape & FIXED_HEIGHT for portrait
    glview->setDesignResolutionSize(960,640, ResolutionPolicy::FIXED_WIDTH);


because it produces a memory access violation:
1 Like

Funny node: CocoStudio on OS X does not accept coma as separator. It parses comas correctly but I’m not able to enter dots which are parsed as grouping separator. 0.5 -> 5000
Solution is to switch language to english.

What version of cocos2dx are you using? I’m using 3.4 and I don’t believe your code works for nobody…

I’m using 3.6 and working in Xcode. And your AppDelegate.cpp is way different from the one I posted on Github :smile:

Thanks @HUTHUT I will try with 3.6 :slight_smile: