Image in UI Navigation Bar

Question

I'm trying to put an image onto the UI Navigation Bar and facing a couple issues with tint. The image is a 40*40 with transparency (png).

The image looks like this in xcode:

When I place in as the image of a UI Bar Button Item it appears as this:

Notice how the color's have changed. The default color of the app is brown and hence the default tint is shining through.

How do I get the original colors of the image to show?

Thanks

edit:

aspect ratio issue:

Answer 1

Taken from the apple documentation:

UIImageView includes the tintColor property. When the image view contains a template image—that is, an image that specifies the UIImageRenderingModeAlwaysTemplate rendering mode—tintColor is applied to the image.

So you need to set the rendering mode of your image to: UIImageRenderingModeAlwaysOriginal

UIImage *originalImage = [UIImage imageNamed:@"navBarImage.png"];
originalImage = [originalImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
//Then apply the image to the navigation bar

If you are developing for an iOS app which seems to be the case then I suggest leaving your image the way it shows atm as it looks much better having it flat than it does with your origianl image. This is just my opinion, I feel that it its clearer and clean.