Add UINavigation Back button in UICollectionView with Swift 3

Question

I add Left Navigation Back button in collection view controller with code.

//Add Navigation Bar

    navbar.autoresizingMask = [.flexibleWidth, .flexibleBottomMargin, .flexibleRightMargin]
    navbar.delegate = self

    UINavigationBar.appearance().barTintColor = UIColor(red: 0.0/255.0, green:49.0/255.0, blue:79.0/255.0, alpha:0.1)
    UINavigationBar.appearance().tintColor = UIColor.white
    UINavigationBar.appearance().isTranslucent = true
    UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName : UIColor.white]

    navItem.title = prefs.value(forKey: "PROVIDER_NAME") as! String?

    let image = UIImage(named: "back_image")
    navItem.leftBarButtonItem = UIBarButtonItem(image: image, style: .plain, target: self, action: #selector(addTapped))

    navItem.leftBarButtonItem?.imageInsets = UIEdgeInsetsMake(0, 0, 0, 0)

Back button is so close to the left. I would like to add padding about 10px from the left.
So, I changed the code into

 navItem.leftBarButtonItem?.imageInsets = UIEdgeInsetsMake(0, 15, 0, 0)

but it is not working and image Back button looks smaller. How can I do to add space to the left of Back button?

Do you embed this view controller into `UINavigationController`? — Artem Stepanenko, May 23 '17 at 10:27
@ArtemStepanenko, I don't embed in UINavigationController bro — May Phyu, May 24 '17 at 03:23
First thing you need to embedded your viewController with navigationController and check this posts https://stackoverflow.com/questions/43546132/how-to-customize-the-navigation-back-symbol-and-navigation-back-text/43556837#43556837 and https://stackoverflow.com/questions/40504860/how-to-change-back-button-title-on-navigation-controller-in-swift3/40505660#40505660 — Joe, May 24 '17 at 07:53

Artem Stepanenko · Answer 1 · 2017-05-25T12:51:42.667

I would recommend replacing UINavigationBar with a simple UIView. This way you would gain a full control over the layout of the navigation bar. It wouldn't be anything more than a transparent UIView with a back button and a title label inside. As simple as that.

The real UINavigationBar is more than that. It's meant to manage a stack of UINavigationItem objects. It adjusts itself depends on the current item and knows how to make an animated (and even interactive) transition from one state to another. That's why you can't change much about the bar's appearance. You shouldn't treat it as a regular view.

UPDATE

Another way to achieve this is a little tricky. You can implement it completely from a storyboard and you don't need mess with appearance.

Add UINavigationBar to a view controller.
Add a plain UIView to the left side of UINavigationBar and make its background color completely transparent.
Add UIButton to the view added in the previous step and set a back icon as its image.
Add constraints to the button to align it to the right side of its superview.
Adjust the width of the view so the back button position is exactly where you want it to be.

This is a view hierarchy in the storyboard:

This is how your UINavigationBar will look like (for you the background will be transparent):

Add UINavigation Back button in UICollectionView with Swift 3

1 Answers1