Say you've got a 15px image, inside a 20px imageview, with contentmode set to UIViewContentModeCenter. Well, you'd expect it to be centered at 1:1 (eg no scaling). But it appears fuzzy, because its origin won't be at a rounded pixel boundary, it'll be at a fraction. If you look at the maths it makes sense:

  • The image is 15px, centered inside a 20px view
  • The image will be drawn at: 20/2 - 15/2 = 2.5px
Hence it'll be fuzzy, because the offset is at a 1/2 pixel boundary, and images (in ios) are drawn using subpixel precision in much the same was as fonts are. So the solution is to make it centered inside a 21px (or 19px) view:
  • The image is 15px, centered inside a 21px view
  • The image will be drawn at: 21/2 - 15/2 = 3px, hence will be drawn sharply.
Other reasons for fuzzy graphics can be seen here:

Thanks for reading! And if you want to get in touch, I'd love to hear from you: chris.hulbert at gmail.

Chris Hulbert

(Comp Sci, Hons - UTS)

iOS Developer in Sydney.

I have worked at places such as Google, Cochlear, News Corp, Fox Sports, NineMSN, FetchTV, Woolworths, and Westpac, among others. If you're looking for a good iOS developer, drop me a line!

Get in touch:
[email protected]
my resume

 Subscribe via RSS