Graphics Programs Reference
In-Depth Information
For the More Curious: Retina Display
With the release of iPhone 4, Apple introduced the Retina display for the iPhone and iPod
touch. The Retina display has much higher resolution - 640x960 pixels compared to
320x480 pixels on earlier devices. Let's look at what you should do to make graphics look
their best on both displays.
For vector graphics, like
HypnosisView
's
drawRect:
method and drawn text, you
don't need to do anything; the same code will render as crisply as the device allows.
However, if you draw using Core Graphics functions, these graphics will appear differently
on different devices. In Core Graphics, also called Quartz, we describe lines, curves, text,
etc. in terms of
points
. On a non-Retina display, a point is 1x1 pixel. On a Retina display, a
point is 2x2 pixels (
Figure 7.21
).
Figure 7.21 Rendering to different resolutions
Given these differences, bitmap images (like JPEG or PNG files) will be unattractive if the
image isn't tailored to the device's screen type. Say your application includes a small image
of 25x25 pixels. If this image is displayed on a Retina display, then the image must be
stretched to cover an area of 50x50 pixels. At this point, the system does a type of aver-
aging called anti-aliasing to keep the image from looking jagged. The result is an image
that isn't jagged - but it is fuzzy (
Figure 7.22
)
.
Figure 7.22 Fuzziness from stretching an image
