Home/ Questions/Q 8141859
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T12:38:59+00:00

I wanted to use a retina resolution image (40x40p) on a bar button item

  • 0

I wanted to use a retina resolution image (40x40p) on a bar button item on my MVC’s navigation item. When I set the image it looked stretched in horizontal direction as expected:

Stretched navigation item button image

Note I also have a toolbar button image which is in retina resolution (60px60p) as required by the Apple spec. It was similarly stretched when the size parameters had default values, i.e. width = 0, insets; t=0,b=0,l=0,r=0:

enter image description here

However unlike the navigator item, in the toolbar case I could successfully change these values from IB. When I set width=30, and insets t=5,b=5,l=5,r=5 the toolbar button turned up perfectly:

Perfectly scaled hi-res toolbar button image

When I used the Size inspector and tried to set the width and inset values of the navigation item’s bar button item it seemed to have no effect. The gear image still looked stretched.

I also tried creating the bar button item on the navigation item by code and set width and insets there, it didn’t work either:

        UIImage *image = [UIImage imageNamed:@"073-Setting@2x.png"];
    //--------------------------------------------------------------------
    // This line had no effect for a bar button item on a navigation item:
    image = [image resizableImageWithCapInsets:UIEdgeInsetsMake(5.0,5.0,5.0,5.0)];
    //--------------------------------------------------------------------
    UIBarButtonItem *button = [[UIBarButtonItem alloc] 
                               initWithImage:image 
                               style:UIBarButtonItemStylePlain
                               target:self
                               action:@selector(handleBack:)];
    //--------------------------------------------------------------------
    // This line had no effect for a bar button item on a navigation item:
    button.width = 30;
    //--------------------------------------------------------------------

Any ideas whether I am doing something wrong, or this looks like a bug. My deployment target is IOS 5.0.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I now understand the reason behind this issue. I did not know I needed to pack both normal and hi resolution (@2x) images within app’s bundle. I was naively thinking to include hi-res image and expect it to work. Since I have iPhone story board only, including 20 and 40 pixel versions of each image in the bundle fixed my problem.

    As a result there is no need to mack around with button widths or insets. This problem is fixed now.

    • 0