CODEWITHSUNDEEP
iosxcodeuibarbuttonitem
yesthisisjoe
yesthisisjoe

Reputation: 2035

iOS: How to set the proper image scale for a bar button item

I'm trying to add my own image as a bar button item, but I don't know how to get the image to scale properly. Apple's Human Interface guidelines recommends that my image be 44x44 px, but when I use a 44x44 px image, it is too large for the toolbar, as you can see:

Example

When I use a smaller version of the image, it looks pixellated on the Retina display. What am I supposed to do here?

Upvotes: 7

Views: 11059

Answers (3)

Naishta
Naishta

Reputation: 12353

width 22 pixels X height 22 pixels - ideal for left or right BarButtonItem. You can resize any image to custom sizes using online tools, one such I used is http://www.picresize.com/

Upvotes: 1

goodcow
goodcow

Reputation: 4795

In images.xcassets, you can add the images as 1x, 2x and 3x. Xcode will use the appropriate image size depending on the device.

Upvotes: 10

mrunal thanki
mrunal thanki

Reputation: 751

You need to follow apple guidelines for designing you can find it from this link https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/LayoutandAppearance.html#//apple_ref/doc/uid/TP40006556-CH54-SW1

You can find the attached screenshot image for correct sizing for the UIBarButtonItem image size as par the apple guidelines you have to use 44X44 for ratina (@2x) and 22X22 for normal (@1x) for UIBarButtonItementer image description here

Upvotes: 7

Related Questions