iPhone X how to handle View Controller inputAccessoryView?

Question

I have a messaging app that has the typical UI design of a text field at the bottom of a full screen table view. I am setting that text field to be the view controller\'s

Answer 1

I'm just add safe area to inputAccessoryView (checkbox at Xcode). And change bottom space constraint equal to bottom of safe area instead of inputAccessoryView root view bottom.

Constraint

And result

Answer 2

This is a general issue with inputAccessoryViews on iPhone X. The inputAccessoryView ignores the safeAreaLayoutGuides of its window.

To fix it we have to manually add the constraint in your class when the view moves to its window:

override func didMoveToWindow() {
    super.didMoveToWindow()
    if #available(iOS 11.0, *) {
        if let window = self.window {
            self.bottomAnchor.constraintLessThanOrEqualToSystemSpacingBelow(window.safeAreaLayoutGuide.bottomAnchor, multiplier: 1.0).isActive = true
        }
    }
}

PS: self here is referring to the inputAccessoryView.

I wrote about it in detail here: http://ahbou.org/post/165762292157/iphone-x-inputaccessoryview-fix

Answer 3

The simplest answer (with just one line of code)

Simply use a custom view that inherits from UIToolbar instead of UIView as your inputAccessoryView.

Also don't forget to set that custom view's autoresizing mask to UIViewAutoresizingFlexibleHeight.

That's it. Thank me later.