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?
August 6, 2014. What is Retina Display? Retina display is a term coined by Apple that just means that the pixel density on a screen is so high that the naked human eye cannot distinguish individual pixels at a normal viewing distance. It allows the screen to show more detail and improves the viewing experience.
The Retina display has since expanded to most Apple product lines, such as Apple Watch, iPhone, iPod Touch, iPad, iPad Mini, iPad Air, iPad Pro, MacBook, MacBook Air, MacBook Pro, iMac, and Pro Display XDR, some of which have never had a comparable non-Retina display.
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With