Back button not aligned properly in iOS 11

Question

We started working on our project with Xcode 8.3 and it was all fine till iOS 10 but when we run our same app in iOS 11 the back button is not aligned as intended as you see in the image below

But with iOS 10 it's aligned properly

And this what the layout constraint error we are getting

(
"<NSLayoutConstraint:0x600000288200 _UIModernBarButton:0x7f7ef5c87f10.bottom == UILayoutGuide:0x6000005a0380'UIViewLayoutMarginsGuide'.bottom + 64.5   (active)>",
"<NSLayoutConstraint:0x600000287f30 V:[_UIModernBarButton:0x7f7ef5c87f10]-(>=0)-|   (active, names: '|':_UIButtonBarButton:0x7f7ef5c86e60 )>",
"<NSLayoutConstraint:0x600000282030 'UIView-bottomMargin-guide-constraint' V:[UILayoutGuide:0x6000005a0380'UIViewLayoutMarginsGuide']-(16)-|   (active, names: '|':_UIButtonBarButton:0x7f7ef5c86e60 )>"

)

onmyway133 · Accepted Answer · 2017-10-27T10:41:05.673

For me it is because I use some tricks like below to hide the title

UIBarButtonItem.appearance().setBackButtonTitlePositionAdjustment(UIOffsetMake(0, -1000), for: .default)

We should not do that, it does not work on iOS 11 and will trigger lots of Auto Layout issue like you post. So check if you have appearance on back button.

If you really want to hide text on the back button, you should do https://stackoverflow.com/a/46889050/1418457

score 1 · Answer 2 · answered Dec 13 '17 at 06:08

1

UINavigationBar.appearance().backIndicatorImage = image.withRenderingMode(.alwaysOriginal)
UINavigationBar.appearance().backIndicatorTransitionMaskImage = image.withRenderingMode(.alwaysOriginal)

    if #available(iOS 11, *) {
        UIBarButtonItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.clear], for: .normal)
        UIBarButtonItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.clear], for: .highlighted)
    } else {
        UIBarButtonItem.appearance().setBackButtonTitlePositionAdjustment(UIOffset(horizontal: -60, vertical: -60), for: .default)
    }

answered Dec 13 '17 at 06:08

Prabhjot Singh Gogana

1,408
1
14
39

1

when removing the else condition for prior to iOS 11 devices, still, this code works. so may I know what is significant to else condition? – g212gs Feb 09 '18 at 11:14
for less than ios 11 – Prabhjot Singh Gogana Feb 09 '18 at 13:20
Yes, that I understand from above code, but when I remove the else code, still iOS 10 devices looks proper UI. – g212gs Feb 12 '18 at 08:25
thats great, I will check it for all ios(which are greater than ios7). if it works with one code then I will definitely remove the other one – Prabhjot Singh Gogana Feb 13 '18 at 11:15

Back button not aligned properly in iOS 11

2 Answers2