Picture is blurred on UIBarButtonItem

Question

I tried to add a picture on an UIBarButtonItem like this :

---

I did it this way via XCode development interface builder. But, when I launch the application, the picture is blurred like this :

---

I tried different sizes for this "home" picture, but I have always the same problem with all pictures I tried (Not only this one). Maybe I forgot something, or there is a "perfect size" I missed ?

Thanks in advance !

*********** EDIT :** Thanks to dariaa I notice I have to import 2 image : home.png and home@2x.png (For the retina compatibility) ********

Answer 1

How do you set the image for your UIBarButtonItem? I believe if you use this method you should have no problems:

UIBarButtonItem *homeBarButtonItem = [[UIBarButtonItem alloc] initWithImage:yourImage style:UIBarButtonItemStylePlain target:self action:@selector(yourSelector:)];

This way you do not have to worry about sizes. Just make sure that you have retina version of the image. (you should have "home-25.png"-25x25 pixels image for non-retina devices (if necessary) and "home-25@2x.png"-50x50 pixels image for retina devices.

Answer 2

You can also create an "image set" in your xcassets directory. Import an image and then right-click and select "New Image Set". Once you do this, right-click again in the image box (the image preview on the right) and select iphone, iPad, etc. and fill in all the scaled resolutions of your image.

Xcode will automatically adapt the correct image to be used based on the screen resolution of the device