Custom back button in UINavigationController

Question

For an application I\'m developing, I need to display a custom back button in a navigation bar. I have the button asset as a PNG image, and I\'m writing this code:

Answer 1

I do not think that ViewController itself should know anything about its back button According to OOP this is the responsibility of containerViewController in which your view controller is inserted, for example UINavigationController.

Subclass your NavigationController and overload in it superClass method like this:

@implementation STONavigationController

- (void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
{
    [super pushViewController:viewController animated:animated];
    if ([self.viewControllers indexOfObject:viewController] != NSNotFound &&
        [self.viewControllers indexOfObject:viewController] > 0){
        UIImage *img = [UIImage imageNamed:@"back-1"];
        UIButton *backButton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, img.size.width * 2, img.size.height * 2)];
        [backButton setBackgroundImage:img forState:UIControlStateNormal];
        UIBarButtonItem *barBackButtonItem = [[UIBarButtonItem alloc] initWithCustomView:backButton];
        [backButton addTarget:self action:@selector(popCurrentViewController) forControlEvents:UIControlEventTouchUpInside];
        viewController.navigationItem.leftBarButtonItem = barBackButtonItem;
        viewController.navigationItem.hidesBackButton   = YES;
    }
}

- (void)popCurrentViewController
{
    [self popViewControllerAnimated:YES];
}

@end 

Answer 2

Johannes Fahrenkrug's Answer works, but the back image would appear at a very wired position.

Here I found a better way to position the image at the right place:

Make Sure You Have a back image with size 24x24(@1x) , I call it backImage

Execute the following code when your app Launch

UINavigationBar.appearance().barTintColor = nil
UINavigationBar.appearance().backIndicatorImage = backImage
UINavigationBar.appearance().backIndicatorTransitionMaskImage = backImage
UIBarButtonItem.appearance().setBackButtonTitlePositionAdjustment(UIOffsetMake(0, -60), forBarMetrics: .Default)

Answer 3

Confusingly backBarButtonItem is not what you're looking for.

It just controls the title on the back button for the next view controller. What you want is to set the leftBarButtonItem to your custom back button.

Answer 4

See this answer here: How to create backBarButtomItem with custom view for a UINavigationController

You just need to set the backBarButtonItem property on the navigationController before pushing the viewController. Setting the backBarButtonItem property in the viewController's viewDidLoad method (for example) doesn't work.

Answer 5

As @pgb suggested you can use leftBarButtonItem instead of back button item. And to remove the default back button item set it to nil like follows;

navigationController?.navigationBar.backIndicatorImage = nil
navigationController?.navigationBar.backIndicatorTransitionMaskImage = nil

let button = UIButton.init(type: .custom)
button.imageView?.contentMode = UIViewContentMode.scaleAspectFit
button.setImage(UIImage.init(named: "top_back"), for: UIControlState.normal)
button.frame = CGRect.init(x: 0, y: 0, width: 75, height: 50) 
button.addTarget(self, action: #selector(handleBackButton), for: .touchUpInside)

let barButton = UIBarButtonItem.init(customView: button)
self.navigationItem.leftBarButtonItem = barButton

Answer 6

Starting with iOS 5, this is simple:

[[UIBarButtonItem appearance]
            setBackButtonBackgroundImage:[UIImage imageNamed:@"back_button.png"]
            forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

You can place that in your app delegate and it will set the background image to all back buttons in the app (for that control state and bar metrics, of course).