Jump to content

  • Log In with Google      Sign In   
  • Create Account

Interested in a FREE copy of HTML5 game maker Construct 2?

We'll be giving away three Personal Edition licences in next Tuesday's GDNet Direct email newsletter!

Sign up from the right-hand sidebar on our homepage and read Tuesday's newsletter for details!


We're also offering banner ads on our site from just $5! 1. Details HERE. 2. GDNet+ Subscriptions HERE. 3. Ad upload HERE.


Retina Display Programming?


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
9 replies to this topic

#1 jeff8j   Members   -  Reputation: 767

Like
0Likes
Like

Posted 23 December 2012 - 07:53 PM

I keep hearing programs that now support retina display like photoshop cs6. Isnt it just a high definition display why would it have to be programmed for wouldn't everything support it?


Firefox youtube video and audio downloader MP3 MP4 OGG WEBM

https://addons.mozilla.org/en-US/firefox/addon/simple-youtube-converter/


Sponsor:

#2 Cornstalks   Crossbones+   -  Reputation: 6991

Like
0Likes
Like

Posted 23 December 2012 - 08:01 PM

I keep hearing programs that now support retina display like photoshop cs6. Isnt it just a high definition display why would it have to be programmed for wouldn't everything support it?

Are these OS X or Windows programs? If they're OS X, they actually have to be programmed using the Cocoa and Quartz 2D frameworks, otherwise they'll be rendered in low resolution and up-scaled on the screen. Windows programs is a bit of a different story, as Windows 8 isn't supported by Boot Camp drivers on any Apple products yet (and it has a decent chance of handling the high DPI), and Windows 7 has three different "scale modes" (100%, 125%, 150%), with 150% being the closest you can get to a normal text size on the Retina display, but most Windows apps don't take this into consideration and look like crap when used with anything but 100%.

 

Edit: I'm using one right now, too...


Edited by Cornstalks, 23 December 2012 - 08:04 PM.

[ I was ninja'd 71 times before I stopped counting a long time ago ] [ f.k.a. MikeTacular ] [ My Blog ] [ SWFer: Gaplessly looped MP3s in your Flash games ]

#3 jeff8j   Members   -  Reputation: 767

Like
0Likes
Like

Posted 23 December 2012 - 08:09 PM

I wasnt really thinking os specific so I didnt have an os in mind. Why would scaling be different just because of the monitor? Why would things be rendered in a lower quality that sounds like a imposed limitation?

 

Lets say for example a macbook pro 15" has a retina display of 2880×1800 how would that differ from a regular monitor of that has a similar resolution?

Wouldnt my opengl game work the exact same way on both without any modifications and look pretty much the exact same?


Firefox youtube video and audio downloader MP3 MP4 OGG WEBM

https://addons.mozilla.org/en-US/firefox/addon/simple-youtube-converter/


#4 Cornstalks   Crossbones+   -  Reputation: 6991

Like
1Likes
Like

Posted 23 December 2012 - 08:19 PM

Remember, the Retina display isn't about resolution, it's about DPI (Dots Per Inch). A higher DPI means you have a higher resolution, but a higher resolution doesn't necessarily mean you have a higher DPI (2880×1800 on a 15" screen is about 220 DPI, whereas 2880×1800 on a 27" screen has a much smaller DPI).

 

The operating system and your application have to take into account the DPI in order to give you anything that looks good. If you go on programming your game assuming there are 96 pixels per inch (which is what used to be the "normal" measurement several years ago and now many programs assume that to be true, despite better, higher DPI screens being made now), your text, images, etc. are going to look much smaller than you planned on when I draw them on my 15" 2880×1800 display. This is one reason why on OS X, you have to use the Cocoa and Quartz 2D frameworks to get your program to be rendered in high DPI (because otherwise when your program communicates with the operating system, your program is going to be assuming a low DPI screen and the OS has to accommodate for that).

 

When drawing text (and images) to the screen, pixels is a pretty bad way to measure the size of things, because 100 pixels on my Retina screen is going to be a lot smaller than 100 pixels on another "average" monitor. When doing graphics, you still have to deal with pixels, but if you don't think about how big those pixels are to the user (that is, how many pixels are in an inch?), things you draw may be too big or too small.


Edited by Cornstalks, 23 December 2012 - 08:28 PM.

[ I was ninja'd 71 times before I stopped counting a long time ago ] [ f.k.a. MikeTacular ] [ My Blog ] [ SWFer: Gaplessly looped MP3s in your Flash games ]

#5 jeff8j   Members   -  Reputation: 767

Like
0Likes
Like

Posted 23 December 2012 - 08:26 PM

Ok I see what your saying if I draw a hud on the 15" or 12" mac book vs a big monitor it will be tiny.

 

Isnt this the case with everything though there are some 1080p phones so it should be standard to attempt to get the screen size/dpi from the os no matter what display so is retina just the marketing term for rendering to a scale that fits your monitor?


Firefox youtube video and audio downloader MP3 MP4 OGG WEBM

https://addons.mozilla.org/en-US/firefox/addon/simple-youtube-converter/


#6 Cornstalks   Crossbones+   -  Reputation: 6991

Like
0Likes
Like

Posted 23 December 2012 - 08:35 PM

Ok I see what your saying if I draw a hud on the 15" or 12" mac book vs a big monitor it will be tiny.

Yeah.

 

Isnt this the case with everything though there are some 1080p phones so it should be standard to attempt to get the screen size/dpi from the os no matter what display so is retina just the marketing term for rendering to a scale that fits your monitor?

Yeah, this is an issue with mobile devices, but iOS and Android thought about this from the beginning and provide ways for the programmer to handle this. For example, on Android, you can provide multiple versions of images (low, medium, high, and extremely high DPI). You can also provide measurements in inches/centimeters or device independent pixels (these aren't actual screen pixels, they're kinda like points), or if you don't care about properly handling screens with different DPIs, you can use raw pixel measurements (but this is a very bad idea). Android also lets you use different layouts depending on the screen size and resolution, and if you, the developer, provide different layouts for different screen sizes or resolutions, it will automatically pick the layout that most closely matches the device. Since iOS and Android have been able to do this from the get-go, developers have been able to nicely handle different screen sizes and DPIs. However, desktop operating systems were invented long before high DPI screens ever came around, and it's only now that desktop operating systems are really trying to provide tools and APIs the developers need to properly handle both low and high DPI screens.

 

As for what "Retina" is: yeah, it's just a marketing term. The idea is that a "Retina display" has pixels that are so small that from the average viewing distance, they are too small to see individually and your eye can't distinguish one pixel from its neighbor, thus allowing a very sharp image. On the iPhone 5, the Retina display has about 320 DPI; on the 15" MacBook Pro, it's about 220 DPI, and on the 13" MacBook Pro, it's about 226 DPI. Personally, I hate the term "Retina display." It's just Apple's marketing way of saying "This is a high DPI screen." There are other screens out there not made by Apple that have just as high or higher DPIs, but since they're not Apple products don't have the "Retina" marketing term applied.


Edited by Cornstalks, 23 December 2012 - 08:44 PM.

[ I was ninja'd 71 times before I stopped counting a long time ago ] [ f.k.a. MikeTacular ] [ My Blog ] [ SWFer: Gaplessly looped MP3s in your Flash games ]

#7 jeff8j   Members   -  Reputation: 767

Like
0Likes
Like

Posted 23 December 2012 - 08:40 PM

Great Thanks for clearing that up! Ill work on getting the dpi from the os then render accordingly and that should work across the board.


Firefox youtube video and audio downloader MP3 MP4 OGG WEBM

https://addons.mozilla.org/en-US/firefox/addon/simple-youtube-converter/


#8 Yrjö P.   Crossbones+   -  Reputation: 1412

Like
0Likes
Like

Posted 25 December 2012 - 04:10 AM

Yeah, this is an issue with mobile devices, but iOS and Android thought about this from the beginning and provide ways for the programmer to handle this. For example, on Android, you can provide multiple versions of images (low, medium, high, and extremely high DPI).
Apple pretty obviously did not think of it from the beginning. Instead they did an ugly hack that forces their devices to use either regular DPI or super-high DPI. Either your app is in "HiDPI mode" or it's not. They can't release a device with middle-of-the-road DPI, like 9.7" 1920x1440, and get good results. Even on a super high DPI OS X device, where other scalings than the "intended" one look good because the eye can no longer pick up the individual pixels, a lot of graphics power gets wasted when the user wants scaling that emulates any resolution other than 1/2 of the actual resolution. The only upside for their approach is that backwards compatibility to old software is automatic, and bad developers do not have to think. In 10 years' time this won't matter because all devices will be super high DPI anyway, but in the meantime the Android / Win8 Metro / etc. approach is superior. (Although iOS will still be stuck to set aspect ratios, unless Apple changes their approach.)

#9 Olof Hedman   Crossbones+   -  Reputation: 2901

Like
0Likes
Like

Posted 25 December 2012 - 04:40 AM

Yeah, this is an issue with mobile devices, but iOS and Android thought about this from the beginning and provide ways for the programmer to handle this. For example, on Android, you can provide multiple versions of images (low, medium, high, and extremely high DPI).
Apple pretty obviously did not think of it from the beginning. Instead they did an ugly hack that forces their devices to use either regular DPI or super-high DPI. Either your app is in "HiDPI mode" or it's not. They can't release a device with middle-of-the-road DPI, like 9.7" 1920x1440, and get good results. Even on a super high DPI OS X device, where other scalings than the "intended" one look good because the eye can no longer pick up the individual pixels, a lot of graphics power gets wasted when the user wants scaling that emulates any resolution other than 1/2 of the actual resolution. The only upside for their approach is that backwards compatibility to old software is automatic, and bad developers do not have to think. In 10 years' time this won't matter because all devices will be super high DPI anyway, but in the meantime the Android / Win8 Metro / etc. approach is superior. (Although iOS will still be stuck to set aspect ratios, unless Apple changes their approach.)

 

Sure they can. 

In the API, you get a scaling factor. This is at the moment either 1.0 or 2.0, but there is nothing saying it couldn't be 1.5 or anything else.

The only thing that would mean is that you would have to downsample the 2x graphics, or provide another called @1.5 or so. You can't now, but I expect there to be no problem getting that into the system.

That is exactly how it works in android now, there is no way to be sure your graphics isn't scaled, and in most devices it will be scaled a bit.

I'm expecting apple will have to bite that bullet sooner or later. (probably later though, because not scaling looks so much better)

 

From the API-side though, that is no problem, and I'm sure the engineers thought of it from the start.

 

The nice thing with apples standardization of either 1x or 2x is that you can get away with artefact-free scaling, and your UI graphics will look exactly like the designer intended. Keeping it at 2x and 1x is most probably a higher level decision (like, Steve said so), with the intent that the iPhone screen should always look super crisp.



#10 Martins Mozeiko   Crossbones+   -  Reputation: 1422

Like
0Likes
Like

Posted 25 December 2012 - 04:59 AM

You should watch "Introduction to High Resolution on OS X" video/slides from WWDC 2012: https://developer.apple.com/videos/wwdc/2012/ (requires Apple ID account). It probably will answer some of your questions.






Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS