Question

I have a UIWebView which displays some local text and images. Either I’ve made a mistake somewhere, or the UIWebView doesn’t automatically handle the @2x suffix for high resolution images.

So, my question is has anyone else successfully loaded @2x images into a UIWebView through the normal means, or do I need to do something special? Can I somehow detect if my user has a retina display?

Answer 1

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 mainScreen] respondsToSelector:@selector(scale)] &&
   [[UIScreen mainScreen] scale] == 2.0)
{
    /* We have a retina display. */
}
else
{
    /* We do not. */
}

This code is safe, as of the time 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.