Leaving inputAccessoryView visible after keyboard is dismissed

Question

What I'm trying to do is to create something similar to the "find on page" search function in Safari on iPad.

I'm using a UIToolbar with some items in it and attached it to the keyboard by setting it as an inputAccessoryView on the UITextField. Works like a charm, but there is one thing I can't figure out. In Safari, when you search for something, the keyboard disappears but the tool bar remains on the bottom of the screen.

Does anyone have a clue on how to accomplish this? The only solution I can think of is to respond to a keyboard dismissed event and then pull out the UIToolBar and create a custom animation that moves it to the bottom of the screen. But this is hacky. I am looking for a more elegant solution. Something that can make me decide what to do with the input accessory view when the keyboard gets dismissed.

Wearisome

Answer 1

It's done like this:

Assign your UIToolbar to a property in your view controller:

@property (strong, nonatomic) UIToolbar *inputAccessoryToolbar;

In your top view controller, add these methods:

- (BOOL)canBecomeFirstResponder{

    return YES;

}

- (UIView *)inputAccessoryView{

    return self.inputAccessoryToolbar;

}

And then (optionally, as it usually shouldn't be necessary), whenever the keyboard gets hidden, just call:

[self becomeFirstResponder];

That way, your inputAccessoryToolbar will be both your view controller's and your text view's input accessory view.

Feverous

It doesn't seem to work on iOS8, i get UIViewControllerHierarchyInconsistency, any ideas? – Palmary

It does work on iOS 8 for me, so I'm probably gonna need a code sample. – Feverous

Just made new sample project, added view at a bottom via storyboard, made outlet to it, and returned that view in inputAccessoryView method... I get the same error like in my project. – Palmary

I opened new question for iOS8, you can find it here #28496909 – Palmary

This should be accepted answer :) It is working on iOS8 – Justiciary

Can i use a Outlet UIView to return the inputAccessoryView? – Drew

This is perfect! – Ptyalin

This is the bomb! I was just about to start on a contrived way consisting of invisible accessory views, KVO on the frame and updating constraints on the fly. And then I stumbled upon this. Gold. – Dropsonde

To get rid of the UIViewControllerHierarchyInconsistency problem: the inputAccessoryToolbar (or yet any kind of UIView) can reside in the storyboard (e.g. inside your UIViewController's scene), but must not have the view controller's view as any of its superviews. – Eldwin

Answer 2

I've ended up with UIToolBar that is not assigned as input accessory view, and slide up and down on UIKeyboardWillShowNotification / UIKeyboardWillHideNotification

Basalt

Thanks, I guess this is the only way to go indeed. – Wearisome

This is what I currently am doing also, had come here hoping there was another solution. I guess not though :( – Chrysler

@BradMoore, there is another solution. Please check out my answer. – Feverous

Does this solution work together with a table view, that dismisses the keyboard interactively? – Eldwin

Answer 3

Update to Swift 4, based on prior answers. If you add toolbar via storyboards you can do this

class ViewController: UIViewController {

    @IBOutlet weak var textField: UITextField!
    @IBOutlet var toolbar: UIToolbar!

    override var canBecomeFirstResponder: Bool {
        get {
            return true
        }
    }

    override var inputAccessoryView: UIView {
        get {
            return self.toolbar
        }
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        textField.inputAccessoryView = toolbar
    }
}

In this case, whenever text field resigns first responder, it defaults first responder to main view. Keep in mind, you might want to explicitly resign first responder, and set main view as first responder if there are multiple UI elements and first responder defaults to undesired view after resignation.

Killingsworth

Answer 4

Adding to @arik's answer, here is the Swift version:

class ViewController: UIViewController {

  @IBOutlet var textField: UITextField!      

  // Input Accessory View
  private var inputAccessoryToolbar: UIToolBar?
  override func canBecomeFirstResponder() -> Bool {
    return true
  }
  override var inputAccessoryView: UIView? {
    return inputAccessoryToolbar
  }

  override func viewDidLoad() {
    super.viewDidLoad()
    inputAccessoryToolbar = UIToolbar(frame: CGRectMake(0, 0, view.frame.size.width, 50))
    textField.inputAccessoryView = inputAccessoryToolbar
  }

  // UITextFieldDelegate
  func textFieldShouldReturn(textField: UITextField) -> Bool {
    becomeFirstResponder()
    return true
  }
}

Thanks for the clean solution!

Hardden

In Swift 3/4 , canBecomeFirstResponder and inputAccessoryView are now properties instead of functions/methods. – Sewellel

Answer 5

You may also need to work around the bug with the inputAccessoryView not respecting the safe area margins and thus not making room for home indicator thing on iPhone X: iPhone X how to handle View Controller inputAccessoryView?

I found the easiest solution when you have a UIToolbar from a xib and you are also using that UIToolbar as the inputAccessoryView of a text field is to embed the toolbar in a UIView when you return it from your overridden inputAccessoryView, and make the containing UIView taller by the safeAreaInsets.bottom. (Other solutions suggest constraining the bottom of the toolbar to the safe area in a subclass, but this leads to constraint conflicts and also means the area under the toolbar is the wrong colour.) However, you have to also bear in mind that the text field can have focus even when there is no keyboard on the screen (for instance if there is an external keyboard), so you need to change the inputAccessoryView of the text view to this toolbar-within-a-UIView in that case as well. In fact it will probably make things simpler to just always use the containing view and adjust the size of it appropriately. Anyway, here's my override of inputAccessoryView:

    override var inputAccessoryView: UIView? {

    if toolbarContainerView == nil {

        let frame=CGRect(x: toolBar.frame.minX, y: toolBar.frame.minY, width: toolbar.frame.width, height: toolBar.frame.height+view.safeAreaInsets.bottom)

        toolbarContainerView = UIView(frame: frame)

    }

    if (toolbar.superview != toolbarContainerView) {

        //this is set to false when the toolbar is used above the keyboard without the container view

        //we need to set it to true again or else the toolbar will appear at the very top of the window instead of the bottom if the keyboard has previously been shown.

        toolbar.translatesAutoresizingMaskIntoConstraints=true

        toolbarContainerView?.addSubview(toolbar)

    }

    return toolbarContainerView

}

It would probably be a good idea to override viewSafeAreaInsetsDidChange to adjust the size of toolbarContainerView in that case, too.

Minyan