(SOLVED)Background image is not covering full screen on android device in coco2dx v3.3

Hi to everyone,
This is my first topic and I really need help with multiple resolutions in Android.
I’ve already read the tutorials in the Learn page about multi resolutions, and all the theory about setDesignResolutionSize(float, float, ResolutionPolicy) and setContentScaleFactor(DesignResolution.widht / ScreenResolution.with). I also searched this topic on forum but didn’t get any success.

Please post code for multiple screen resolution in android.

Thanks

Why don’t you post your code and screen shot?

bool AppDelegate::applicationDidFinishLaunching() {
//initialize director
auto director = Director::getInstance();
auto glview = director->getOpenGLView();

if(!glview) {
    glview = GLViewImpl::create("My Game");
    director->setOpenGLView(glview);

glview->setDesignResolutionSize(480,320,ResolutionPolicy::EXACT_FIT);
// this line is working fine on win32 but not working on android devices.

}

// turn on display FPS
director->setDisplayStats(true);

// set FPS. the default value is 1.0/60 if you don't call this
director->setAnimationInterval(1.0 / 60);

// create a scene. it's an autorelease object
auto scene = MainMenu::createScene();

// run
director->runWithScene(scene);

return true;

}

i am using the following code for displaying the background image -

Size visibleSize = Director::getInstance()->getVisibleSize();
Vec2 origin = Director::getInstance()->getVisibleOrigin();


auto bg = Sprite::create("menubg.png");
bg->setPosition(Vec2(origin.x + visibleSize.width / 2, origin.y + visibleSize.height / 2));
this->addChild(bg);

Background image is not covering hole screen on 800x480 resolution device. but on 480x320 resolution device full image is not visible only center part of image is covering hole screen of device. My Background image resolution is 800x480.

What exactly are you trying to achieve? Do you just want to make the background image fill the screen?

yes exactly .

To make the image fit the screen no matter what the resolution is, you need to scale the image. To scale the image to perfectly fit the screen:

bg->setScale(visibleSize.width / bg->getContentSize().width, visibleSize.height / bg->getContentSize().height);

Or, to fill the screen but keep the same aspect ratio for the picture (so it doesn’t look squashed):

float scale = MAX(visibleSize.width / bg->getContentSize().width, visibleSize.height / bg->getContentSize().height);
bg->setScale(scale);

Or, to expand the image until either the left/right sides first touch the edge of the screen or the top/bottom sides do (which may give you black bars):

float scale = MIN(visibleSize.width / bg->getContentSize().width, visibleSize.height / bg->getContentSize().height);
bg->setScale(scale);
2 Likes

thanks for your reply . I’m trying it. I will tell you result.

Great it is working.

Thank you grimfate.

I want to scale all the resources of my game according to device screen size.

How can I do it ?

Please tell me.

setContentScaleFactor() is supposed to be used for that. Just choose a design size you want to work with and set the content scale factor based on that.

ok.

In AppDelegate() I write the following code -

static cocos2d::CCSize designResolutionSize = cocos2d::CCSizeMake(800, 480);
bool AppDelegate::applicationDidFinishLaunching() {
Size visibleSize = Director::getInstance()->getVisibleSize();

Vec2 origin = Director::getInstance()->getVisibleOrigin();

// initialize director
auto director = Director::getInstance();
auto glview = director->getOpenGLView();
if(!glview) {
glview = GLViewImpl::create(“My Game”);
director->setOpenGLView(glview);
}

Size visibleSize2 = glview->getFrameSize();

glview->setDesignResolutionSize(visibleSize2.width,visibleSize2.height,ResolutionPolicy::EXACT_FIT);
director->setContentScaleFactor(visibleSize2.height/designResolutionSize.height);

But its not working can you help me please.

all my game resource are designed according to screen size of 800x480.

Try changing

glview->setDesignResolutionSize(visibleSize2.width,visibleSize2.height,ResolutionPolicy::EXACT_FIT);

to

glview->setDesignResolutionSize(designResolutionSize.width,designResolutionSize.height,ResolutionPolicy::EXACT_FIT);

ok. let me try it.

thanks

This is the DesignResolutionSize.
and you don’t have to set director->setContentScaleFactor();

ok it’s working…fine.
Thank you very very much.