How to add spacing to Left BarButtonItem Image with Swift 3

Question

I would like to add space to the left of the bar button.

So, I add this code.

    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))

After adding this code, the button image does not show well and looks no good.

Could anyone help me to solve this problem?

Bro @HamzaAnsari, When I remove this, I got error of Cannot assign value of type 'UIEdgeInsets' to type UIBarButtonItem — May Phyu, Apr 11 '17 at 06:52
@HamzaAnsari, So, If I remove this code, how do I add space to the left of the bar button item? — May Phyu, Apr 11 '17 at 06:56
well you dont need to add space to leftBarButton it already have insets — Hamza Ansari, Apr 11 '17 at 06:58
@HamzaAnsari If I don't add space, the appearance is like the first image. — May Phyu, Apr 11 '17 at 07:04
You may want to init UIBarButtonItem with custom view and set the desired frame. And then add your image to that view. As I showed here http://stackoverflow.com/a/18874211/744015 — Alexey, Apr 11 '17 at 15:21
check this post http://stackoverflow.com/questions/43546132/how-to-customize-the-navigation-back-symbol-and-navigation-back-text/43556837#43556837 — Joe, Apr 24 '17 at 07:00

score 3 · Answer 1 · answered Aug 18 '17 at 07:38

Hi Code given below might be useful for you.

extension UIBarButtonItem {
    class func itemWith(colorfulImage: UIImage?, target: AnyObject, action: Selector) -> UIBarButtonItem {
        let button = UIButton(type: .custom)
        button.setImage(colorfulImage, for: .normal)
        button.frame = CGRect(x: 0.0, y: 0.0, width: 44.0, height: 44.0)
        button.imageEdgeInsets = UIEdgeInsetsMake(0, -50, 0, 0)
        button.addTarget(target, action: action, for: .touchUpInside)

        let barButtonItem = UIBarButtonItem(customView: button)
        return barButtonItem
    }
}

You can increase or decrease Left Padding for UIEdgeInsetsMake(0, -50, 0, 0) as per your requirement for left padding.

You can use above extension in your code as describe below.

self.navigationItem.leftBarButtonItem = UIBarButtonItem.itemWith(colorfulImage: UIImage(named: "ic_back")?.withColor(UIColor.white), target: self, action: #selector(btnBackClicked))

func btnBackClicked() {
    print("your code here on back button tapped.")

}

How to add spacing to Left BarButtonItem Image with Swift 3

1 Answers1

Linked