Multiple screen resolutions
Monkey Forums/Monkey Beginners/Multiple screen resolutions
| ||
Hi there, I am wondering if my approach would make any sense: 1. Create 3x assets in 512, 1024 and 2048 textures 2. Depending on current screen resolution use: <= 800 px wide -> 512 px textures <= 1280 px wide -> 1024 px textures any other resolution loads 2048px textures Thank you! |
| ||
This is possible to do - we do it. We do "full" size and "half" size depending on resolution. |
| ||
Yeap, pretty standard approach. On iOS, UI assets like images are built as if you are designing for the 320x480 iPhone. But for current Retina, you provide a .png that is @2x as it has double the DPI (or width/height). Then now we have @3x for iPhone 6plus. So say you had a png for a button. You'd need to supply three versions. button.png - 60x60 for iPhone <4 button@... - 120x120 for iPhone 4 through 6 button@... - 180x180 for iPhone 6 plus |
| ||
Do you have to load the @?x version manually or just the regular version and ios loads them automatically? |
| ||
It's automatic. It's kind of a big kludge, you build your UI assuming a 320x480 (now 320x568 with widescreen). Then "Retina" devices treat every logical pixel (or point) as 2x2 pixels (or 3x3). So depending on your device, your button is logically 60x60 "points", but the UIImage loader picks the best fit for your resolution (falling back on the 1x and then upscale, if no 2x is found). Then you have iPhone 6 plus, which is all kinds of crazy. Your app works at 3x (so each logical point is 3 pixels). But the frame buffer don't even match the actual physical display resolution! iOS actually down samples the rendered frame to the actual physical resolution. http://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions Why? Because a downsampled 3x on a iPhone 6plus button is the same size (inches/millimeters) as a 2x button on an iPhone 6, etc. I'm not verifying the math cause just the idea alone hurts my head. Why? DPI (or PPI rather)... iPhone is 163 PPI Retina is 326 PPI (2x) 6plus is 401 PPI (2.46x) ... ... Which doesn't match the Retina PPI, nor is it exactly 3x, but that was the screen hardware they could get/make. Asking the OS and app developers to create image assets at 2.46x resolution was too insane. So they made the OS draw at a higher 3x (yay for developers/photoshop artists) and then downsample. Heh wacky eh? Part of the reason iOS 7/8 is pushing towards more vector graphics for icons, buttons, etc. Easier to build vector art that will scale to any resolution, than create a bitmap that either scales properly, or ask your artist to create 3/4 different versions of each image. |
| ||
Thanks guys, do you normally package all of them together for every platform or somehow filter out unused data? Say if I target Win/nix targets I probably can safely remove x512 textures? |
| ||
Thanks nullterm for the explanation. |
| ||
muruba, I don't know if there's a way to filter data specifically by platform. I think Monkey just grabs everything from .data (with appropriate file extensions). You could have separate stub .monkey files that just import data files in their specific .data folder, but then you have to maintain 2/3/4/5 different .data directories, which is a BIG pain in the but without an automated pipeline. MyGameWin.monkey & MyGameWin.data folder + data files MyGameMac.monkey & MyGameMac.data folder + data files MyGameIOS.monkey & MyGameIOS.data folder + data files MyGameAndroid.monkey & MyGameAndroid.data folder + data files (not recommended, huge pain in the butt) |
| ||
Thanks nullterm, that makes sense. |
| ||
I'd avoid using the @2x and @3x filenames. iOS, and I think MacOS too, will load those, INSTEAD of the expected assets, which might break your code if you're expecting your code to load a different asset. Instead, i use file.png, file-hd.png and file-hd2.png for my three sizes, so that >I< get to pick which loads, and gets used. |
| ||
Yeah, definitely don't use the @2x @3x. I can easily see that messing around with what asset you want vs what actually gets loaded. |
| ||
What we do is have a half and full folder with each version of asset in either with same filenames inside. We also use texture atlases. Both are included when distributing. |