ansaurus

Question

Answer 1

A:

As for the detection, you can use this code sample. I’ve just updated it to also detect iPhone 4.

zoul 2010-09-16 06:00:18

-1 for recommending code that tests for device, and not for functionality. Recommend checking that `UIScreen` responds to `scale`, and if so, call `scale` on `UIScreen`s `mainScreen` and check if its value is 2.0. If those conditions are true, retina display.

jer 2010-09-16 06:22:56

Well in this case you can’t get a false positive, so that I would not hesitate. But the screen check is better, yes.

zoul 2010-09-16 06:34:07

Undid the downvote for the acknowledgement above. Just to add one more thing, the reason I downvoted it is because these types of hardware checks work great for a moment in time, but in 5 months when Apple releases a new device (probably with a retina display), we have to edit our code to make it work there, whereas if we check scale, it works automagically.

jer 2010-09-16 06:41:32

Thanks, but I'm still hoping someone comes through with a way to do this automatically in a UIWebView. Checking for the device is a clunky solution whichever way it's done. That said, @jer could you post your solution in another comment, so I can accept as the answer if that's the only good option I end up having?

alku83 2010-09-16 07:15:25

Answer 2

+4 A:

As per your request...

Test for functionality. If you want to know if you need to display a retina image or a regular image, then test if your device has a retina display, not that it's of a particular model (future proof your application as best you can, means you have to change less stuff when a new model comes out). To do this, you can use the following sample code:

if([UIScreen respondsToSelector:@selector(scale) &&
   [[UIScreen mainScreen] scale] == 2.0)
{
    /* We have a retina display. */
}
else
{
    /* We do not. */
}

This code is safe, as I wrote this, on all models and on all firmware versions. It will be safe on future versions as well until Apple deprecates the scale method, which may never happen.

More on your question, I don't know how to do that in a webview without having the locations to a retina image and a non-retina image beforehand. Once I have that info, I have (in the past) used it to replace some known sentinel text that the web page expected me to replace, as in I would put something in the HTML that had say: {{{image_location}}} where I could download the HTML data, get it into string format, then do a replace on that string replacing that text, with the URL of the @2x image if we're on a retina display, with the appropriate scale factor, or the normal sized image if not (using the above code).

Hope this helps if nobody comes along with a better solution.

jer 2010-09-16 07:35:10

Given that no better answers have come in, I'm accepting this as a workable solution. Ideally the UIWebView should handle this itself for local images, but checking for the devices screen scale and adjusting the HTML accordingly works.

alku83 2010-09-19 12:18:34

Answer 3

A:

Just always do:

<img src="[email protected]" width={half-width} />

for CSS referenced background images, use -webkit-background-size to half-size them.

Disadvantage: Non-retina devices will download oversized images.

Hafthor 2010-10-01 17:38:48

ansaurus

tags:

views:

answers:

UIWebView and iPhone4 retina display

related questions