How to create smooth png for uitabbaritem?

Question

When I create png in Photoshop with parameters 30x30pxl, clear background with white lines it looks like poor resolution. link to snapshot of presenting tabbaritem: http://yadi.sk/d/9zrBjrjxBFyva

I want smooth lines in this picture. What way I can get it?

neilco · Answer 1 · 2013-10-20T13:44:28.090

0

It looks like you're using a non-retina image on a retina device. Create a 60x60 version and name the same as the 30x30 version with the suffix @2x(for example, clock@2x.png). Add this to your project.

Edit: The graphics you're producing in Photoshop are pixelated, and in the case of the @2x image, very blurry. Since the source images are poor quality, there's no way iOS can magically make them smooth.

Use the shape tool in Photoshop to create crisp, sharp shape paths. Make sure to align the shapes to pixel boundaries for extra crispness.

edited Oct 20 '13 at 13:44

answered Oct 20 '13 at 12:50

neilco

7,964
2
36
41

if I create 60x60 resolution than it looks like this http://yadi.sk/d/eyykQ2XIBG5Yb – user2380791 Oct 20 '13 at 12:56
file name ends with @2x.png – user2380791 Oct 20 '13 at 12:56
Can you show us both the 30x30 and 60x60 icons? The raw icons, not screenshots of the tab bar. – neilco Oct 20 '13 at 13:03
neilco, thanks, but I used shape tool. Circle on the picture was made with ellipse tool. I set shading in 4pxls or about so. The result You have seen=( – user2380791 Oct 20 '13 at 14:08
and how can I use @2x.png? may be the problem is that I set image in storyboard but not in code? Can it cause unscalable image like in second screenshot? – user2380791 Oct 20 '13 at 14:11

How to create smooth png for uitabbaritem?

1 Answers1