0

I'm having problem displaying my imageView in a correct manner. I'm a beginner in auto layout and size classes. This is what I'm doing in the .xib:

I have a UIImageView :

  • original size: 709 x 485
  • size in xib: 363 x 248

  • I add the following constraints to the image:

    • Equal Width to superview with constant = -57 (I changed it to -57 because constant = 0 is too big in 3.5" and 4") and multiplier = 0.7
    • Aspect ratio to itself (121:82)

  • And other top bottom, align x constraints

now my problem is that when I added the @2x and @3x images to my project the image is fuzzy and not sharp on retina screens.

Is it the constraint equal width and aspect ratio affecting the image and not scaling properly to fit all sizes?

What should I do in this case?

DevMe
  • 15
  • 5
  • How exactly do you want to fit your imageView to its superview? – enigma Jul 06 '15 at 11:38
  • @y0ter9a check this image http://i.stack.imgur.com/CqkKW.png – DevMe Jul 06 '15 at 11:48
  • If you want your image to fit like that, then why are you using 'Equal width to superview'? – enigma Jul 06 '15 at 12:14
  • @y0ter9a I'm not sure how to do it either as I said I'm new to the autolayout but when I did it that way to resize my large image to fit all screen sizes it worked but when I added retina images and run the app the image became a bit fuzzy in the edges not sharp and smooth – DevMe Jul 06 '15 at 12:24
  • What are the sizes (in pixels) of the images that you are using? – enigma Jul 06 '15 at 12:28
  • @y0ter9a original size: 709 x 485 size in xib: 363 x 248 – DevMe Jul 06 '15 at 12:32
  • I think you should use 'Center Horizontally in container', 'Top space to top layout guide' and 'Aspect Ratio' for constraints. See if that solves your problem. – enigma Jul 06 '15 at 12:47
  • @y0ter9a this is what I'm doing like I said in my question I added aspect ratio and top bottom and center x to super view also – DevMe Jul 06 '15 at 14:09
  • Have a look at this: http://stackoverflow.com/questions/28850298/anti-alias-uiimage-and-performance – enigma Jul 06 '15 at 14:13
  • @y0ter9a THANKS!! Exactly what I want .. you saved me here :) – DevMe Jul 06 '15 at 17:03
  • You're welcome. Let me put this as an answer so that it would help others as well. – enigma Jul 07 '15 at 02:40

1 Answers1

0

The reason that the large images look fuzzy on retina screens could be because of Aliasing. So you need to anti-alias the images.

Have a look at the following link: Anti Alias, UIImage and Performance

Community
  • 1
  • 1
enigma
  • 865
  • 9
  • 22