Hi,
I’m trying to have the cocos canvas resize with the browser size. (PC/Chrome/Firefox)
Like for example have the canvas have an auto width of 80% of the browser size.
When I expand the browser size the canvas/content does not size up.
When I shrink the browser size the canvas/content does size down.
(note the for the sizing to even work the page must go to fullscreen (just press the button in the image to go fullscreen and back).
It is not clear to me how that is supposed to work or even if it is supposed to work.
Attached is a simple sample.
Nicolas
HelloHTML5World_NICO_FULLSCREEN.rar.zip (530.3 KB)
Hi, Nicolas
Please check out the documentation of Resolution Policy: http://cocos2d-x.org/docs/manual/framework/html5/resolution-policy-design/en
The doc explained precisely the behavior of new resolution policy design in version 2.2.2.
In your sample, you have wrapped your game canvas into a div and you don’t control your div with css or any other things. That’s why your canvas’ size is getting messed up, you can control the size of your div or just remove it, then the adaptation will perform well. Again, I can’t explain all behavior here, please read the doc.
If you have any suggestion or question about the doc, please repost.
Huabin
ok thanks for the ideas, will check that tomorow morning.
Ok after re-reading the docs. I finaly got the basic idea. (my html skills make it hard to get some concepts at first).
As in the docs the paragraph on handling the frame in html is small.
here is a complete sample that does 2 things:
- Canvas in a frame div on a page so that it resizes on page change with the wanted cocos policy.
- Support for fullscreen of the cocoscanvas
Hope it helps.
Nicolas
Awesome!
Althought i’s not coming out of fullscreen when I click the button (it does if I press the escape key tho’). May it be a known Firefox bug?
Hi thanks for trying my test.
Re-checked, on my machine it comes out of fullscreen in FireFox.
Here are my versions:
Os: Windows7
Cocos:latest sync (yesterday)
Chrome:32.0
Firefox:26.0
Nick
