Strange graphical glitches when canvas element is not wrapped in a div
Strange graphical glitches when canvas element is not wrapped in a div
- Status changed from New to Closed
- % Done changed from 0 to 100
It’s a normal result with our Resolution Policy’s design.
As I found that you used resolution policy in your code:
cc.EGLView.getInstance().setDesignResolutionSize(designSize.width, designSize.height, cc.RESOLUTION_POLICY.SHOW_ALL);
If you used this function, the game canvas will always be resized to fit it’s original container’s size.
In the first wrapped case, it will adapte to your div container which has a initial height of 450px (which is defined by the canvas element, if you don’t precise a div’s height, it will be its children’s height).
In the second case, cocos2d will adapte the canvas size to the body size (which is the browser size), so it has been resized to the browser’s width and its height has been scaled proportionally.
You can refer to this article for more details : http://www.cocos2d-x.org/wiki/Multi\_resolution\_support
It describe the effect of different resolution policies for cocos2d-x. Note that cocos2d-x takes always the screen size for the adaptation, but things are different in HTML5 version. Users may need to show our game only in one div on their page, that’s the origin thought of the design.
In next version 2.2.2, I have refactored the design of Resolution Policy and I’m writing a wiki for it, hopes it will help everyone to understand the mechanism.
Huabin
If you want everything act as the wrapped version, you can simply remove this line of code: cc.EGLView.getInstance().setDesignResolutionSize(designSize.width, designSize.height, cc.RESOLUTION_POLICY.SHOW_ALL);
- File working_fine.jpg added
- File broken_tmx_background.jpg added
That is not what I’m complaining about.
Please look at the broken behaviour I show in the image files I’m attaching now. The tmx I’m using for the background appears broken for no apparent reason.
Thanks for your help, but please don’t close this issue until it’s resolved.
edit: I was sure I attached images to this post but they aren’t showing.. I have uploaded them here, please take a look: http://proto.heart-bit.com.ar/strangeproblem/picsoritdidnthappen/
Status: | Closed | |
---|---|---|
Start date: | 2013-12-22 | |
Priority: | Low | |
Due date: | ||
Assignee: | - | |
% Done: | 100% |
|
Category: | - | |
Target version: | - |
In the two following links the exact same code is ran, but in one of the html files the canvas element is wrapped in a div and in the other one it isn’t. Watch how when wrapped the canvas remains a fixed size and everything works well inside it, and when unwrapped the canvas takes up all available space but some sprites malfunction and aren’t shown properly:
http://proto.heart-bit.com.ar/strangeproblem/indexwrapped.html
http://proto.heart-bit.com.ar/strangeproblem/indexnotwrapped.html
working_fine.jpg (67.7 kB) ZippoLag, 2013-12-26 05:27
broken_tmx_background.jpg (93.1 kB) ZippoLag, 2013-12-26 05:27