Back button in navigation bar not getting tapped in ios 11

Question

It was working fine until the recent update where i think the navigation item should work with the AutoLayout concept. I have been using it like this:

let button = UIButton(frame: CGRect(origin: CGPoint.zero, size: CGSize(width: 30, height: 30)))
button.setImage(UIImage(named: "BackIcon"), for: UIControlState())
button.imageEdgeInsets = UIEdgeInsetsMake(0, -20, 0, 0)
button.addTarget((target != nil ? target! : self), action: backAction, for: .touchUpInside)
navigationItem.leftBarButtonItem = UIBarButtonItem(customView: button)

what changes i should do to make it smooth cause at the moment it doesn't gets called on every tap, usually it's taking 2-3 times to get tapped in the same region.

Answer 1

This worked for me on iOS 11. Check out and see if it works for you.

    let btnLeftMenu = UIButton.init(type: .system)
    let image = UIImage(named: "Back");
    btnLeftMenu.setImage(image, for: .normal)
    btnLeftMenu.setTitle("BACK", for: .normal);
    btnLeftMenu.imageEdgeInsets = UIEdgeInsetsMake(0, -30, 0, 0)
    btnLeftMenu.titleEdgeInsets = UIEdgeInsetsMake(0, -30, 0, 0)
    btnLeftMenu.sizeToFit()
    btnLeftMenu.tintColor = UIColor.white
    btnLeftMenu.titleLabel?.font = UIFont.init(name: "Avenir-Heavy", size: 16.0)
    btnLeftMenu.addTarget(self, action: #selector (CustomMessageVC.backButtonAction(_:)), for: .touchUpInside)
    let barButton = UIBarButtonItem(customView: btnLeftMenu)
    self.navigationItem.leftBarButtonItem = barButton

[EDIT]

Probably the width and height of the image are small. You can check the backbutton width and height using realtime Viewstack on Xcode debug. Click on 2nd button from right in the image to see the ViewStack. if width and height are the issues then increase the button width and height with image being centred and imageView property to aspect fit. that should solve your problem. Happy coding.

Answer 2

Works for me:

let backButton = UIBarButtonItem(title: "Back",
            style: .done,
            target: self,
            action: #selector(moveBack))
navigationItem.setLeftBarButton(backButton, animated: false)

Open view debugger and check frame for leftBarButtonItem. You should be careful with leftBarButton , because it doesn't inherit from UIView and generate frame in runtime.

Answer 3

Found this trouble lurking in our app as well now that iOS 11 is out, so here's my solution. It's not perfect as you do need to set the frame for the buttons, but gets the job done, and works on iOS 9.3/10.3.1/11.1 (and probably in between). Tap area is normal and UX is good.

Before:

After:

I call this in viewDidLoad :

func setNavbarButtons() {
    // setup the left and right nav bar buttons

    // manually define the frame for the buttons
    let buttonWidth: CGFloat  = 44
    var buttonHeight: CGFloat = buttonWidth

    // if possible, use the nav bar height as the button height, else fall back to the manual value above
    if let frame = self.navigationController?.navigationBar.frame {
        buttonHeight = frame.height
    }

    // apply this to the left inset for the left button, right inset for the right button, so the image is pushed to the left/right respectively
    // (hence the negative value)
    // setting this to 0 will center the image in the button and we don't want that
    let edgeInset = -(buttonWidth/2)

    // setup a button to hold the image (left)
    let leftButton = UIButton(type: .custom)
    let backIcon = UIImage(named: "Back with shadow")
    backIcon!.isAccessibilityElement = true
    backIcon!.accessibilityLabel = "Back"

    // no title text
    leftButton.setTitle("", for: .normal)
    leftButton.setImage(backIcon, for: .normal)
    leftButton.sizeToFit()
    leftButton.addTarget(self, action: #selector(self.didTapLeftNavbarButton), for: .touchUpInside)

    // define left button frame and inset
    leftButton.frame.size.width = buttonWidth
    leftButton.frame.size.height = buttonHeight
    leftButton.contentEdgeInsets = UIEdgeInsetsMake(0, edgeInset, 0, 0)

    // finally setup a UIBarButtonItem to hold the UIButton (arg)
    let leftBarButtonItem = UIBarButtonItem(customView: leftButton)
    leftBarButtonItem.title = ""

    // set it
    self.navigationItem.setLeftBarButton(leftBarButtonItem, animated: true)

    // rinse/wash/repeat for right button
    let rightButton = UIButton(type: .custom)
    let shareIcon = UIImage(named: "Share")
    shareIcon!.isAccessibilityElement = true
    shareIcon!.accessibilityLabel = "Share"

    // no title text
    rightButton.setTitle("", for: .normal)
    rightButton.setImage(shareIcon, for: .normal)
    rightButton.sizeToFit()
    rightButton.addTarget(self, action: #selector(self.didTapActionButton(_:)), for: .touchUpInside)

    // define right button frame and inset
    rightButton.frame.size.width = buttonWidth
    rightButton.frame.size.height = buttonHeight
    rightButton.contentEdgeInsets = UIEdgeInsetsMake(0, 0, 0, edgeInset)

    let rightBarButtonItem = UIBarButtonItem(customView: rightButton)
    rightBarButtonItem.title = ""

    self.navigationItem.setRightBarButton(rightBarButtonItem, animated: true)
}

Answer 4

Overriding the following method in my custom UIView class did the trick for me:

override var intrinsicContentSize: CGSize {
        return UILayoutFittingExpandedSize
    }