How can I show a custom image in navigation bar back button instead of default buttons which are shown by nav bar itself

Question

On navigating to any view in an app which has navigation controller implemented, it shows a back button to go to the previous view. Is there a way I can use custom image instead

Answer 1

Yes you can.

You can control how the standard back button will look when another view controller is pushed on top of a given view controller by setting its navigation item's back bar button item (you can customize the title or use an image):

UIBarButtonItem *btn = [[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStyleBordered target:nil action:nil];
self.navigationItem.backBarButtonItem = btn;
[btn release];

UIBarButtonItem *btn = [[UIBarButtonItem alloc] initWithImage:yourImage style:UIBarButtonItemStyleBordered target:nil action:nil];
self.navigationItem.backBarButtonItem = btn;
[btn release];

Note: you configure this in a "parent" view controller that may have other view controller(s) pushed on top of it. The configuration is done in the "parent" and the appearance of the back button is changed when some view controller is on top. Tapping the back button brings you back as expected.

---

You can also create your own UIBarButtonItem and set it as the leftButtonItem on the navigation bar on the current view controller:

UIBarButtonItem *btn = [[UIBarButtonItem alloc] initWithImage:yourImage style:UIBarButtonItemStyleBordered target:self action:@selector(yourMethod:)];
self.navigationItem.leftBarButtonItem = btn;
[btn release];

Note: in this case, the back / left bar button item is changed for the current view controller (when it is on top). You must implement the yourMethod: method. If you simply want the button to go back, you have to handle popping the view controller yourself by calling [self.navigationController popViewControllerAnimated:YES];.

Answer 2

It almost works like a back button. With the exception of the transition animation (after the button is tapped and current view is popped off the navigation to the right).

The right way is to make a category.

@interface UINavigationBar (MyNavigationBar)  
-(void)drawRect:(CGRect)rect; 
@end

@implementation UINavigationBar (MyNavigationBar)
-(void)drawRect:(CGRect)rect { 
UIImage *image = [UIImage imageNamed:@"....."];  
[image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)]; 

Answer 3

I found that none of the solutions actually solved the BACK UIBarButton and also provided its hidden behavior if the view controller is root.

-(void)popViewControllerWithAnimation {
[self.navigationController popViewControllerAnimated:YES];
}

- (void)viewWillAppear:(BOOL)animated
{
   [super viewWillAppear:animated];
   if([self.navigationController.viewControllers objectAtIndex:0] != self)
   {
       UIButton *backButton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 26, 26)];
       [backButton setImage:[UIImage imageNamed:@"back"] forState:UIControlStateNormal];
       [backButton setShowsTouchWhenHighlighted:TRUE];
       [backButton addTarget:self action:@selector(popViewControllerWithAnimation) forControlEvents:UIControlEventTouchDown];
       UIBarButtonItem *barBackItem = [[UIBarButtonItem alloc] initWithCustomView:backButton];
       self.navigationItem.hidesBackButton = TRUE;
       self.navigationItem.leftBarButtonItem = barBackItem;
   }
}