Zhen
Zhen

Reputation: 12431

Objective C: Image not displayed correctly in UIBarButtonItem

I have created a new image to be included in a barbutton item as seen below

enter image description here

However, when I try to add the image to the UIBarButtonItem (as seen in code below)

UIBarButtonItem *newQuestionButton = [[UIBarButtonItem alloc]initWithImage:[UIImage imageNamed:@"doneButton_text"] style:UIBarButtonItemStyleBordered target:self action:@selector(displayNewQuestion)];

I get the following result

enter image description here

What can I do to display the actual color of the text in the original image in the barbutton?

Upvotes: 1

Views: 1346

Answers (1)

Oscar Gomez
Oscar Gomez

Reputation: 18488

The reason why it shows as white is because only alpha values in the image are used to create the bar button image. Whatever image you provide is converted into a image with shades of white, based on the alpha values. The image must be modified to conform to the iOS Human Interface Guidelines:

  1. Use the PNG format.
  2. Use pure white with appropriate alpha.
  3. Do not include a drop shadow.
  4. Use anti-aliasing.
  5. If you decide to add a bevel, be sure that it is 90° (to help you do this, imagine a light source positioned at the top of the icon).
  6. For toolbar and navigation bar icons, create an icon that measures about 20 x 20 pixels.
  7. For tab bar icons, create an icon that measures about 30 x 30 pixels.

You can find the docs here:

Human Interface Guidelines

Upvotes: 4

Related Questions