如何在Swift 4中从CollectionView的底部到Input Accessory View的顶部设置约束

Question

so I am having a bit of a trouble getting one of my constraints right.Basically I am using storyboard to put two views on the screen. One is a UITextView and the other is a collectionView. CollectionView is underneath UItextView. I want my collectionView's bottom constraint to be connected to the top of my Input Accessory View which pops up everytime keyboard appears. By doing this I am essentially making the textview height dynamic. Is there any way I can do this? Here is a picture The two circles are part of Input Accessory View. I want the collectionview which is the priority levels to be connected to the top of the input accessory view. Here is another picture with detailed labeling and markup: Detailed markup Please help!

Answer 1

You can add the constraint programatically with something like this:

Option 1:

let bottomContraint = NSLayoutConstraint(item: self.collectionView, attribute: NSLayoutAttribute.bottom, relatedBy: NSLayoutRelation.equal, toItem: self.textField, attribute: NSLayoutAttribute.top, multiplier: 1.0, constant: 8.0)

self.view.addConstraint(bottomContraint)

Option 2:

Using the storyboard, hold down the control key and drag from the textfield to the collection view, then click on vertical spacing. You can then tap edit the constraint and check the first item is textField.Top and second item is collectionView.Bottom . You can then change the constant, including using a negative number is need be.

Answer 2

First, create a constraint from your accessory to the bottom of the screen.

And then link it to an IBOutlet in your view controller:

You have to react to events of keyboard shown and hide. So you register for notifications from the UIKit about that. Upon this events you dynamically change your height.

Add this to your implementation of the view controller:

@IBOutlet weak var constraintToChange: NSLayoutConstraint!

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
    NotificationCenter.default.addObserver(self, selector: #selector(keyboardWillShow(_:)), name: NSNotification.Name.UIKeyboardWillShow, object: nil)
    NotificationCenter.default.addObserver(self, selector: #selector(keyboardWillHide(_:)), name: NSNotification.Name.UIKeyboardWillHide, object: nil)

}

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    NotificationCenter.default.removeObserver(self)
}
//other methods skipped

@objc func keyboardWillShow(_ notification: Notification) {
    guard let userInfo = notification.userInfo else {
        return //no info to get keyboard size from
    }
    guard let keyboardSize =  (userInfo[UIKeyboardFrameBeginUserInfoKey] as? NSValue)?.cgRectValue else {
        return //no keyboard size to determine height
    }

    constraintToChange.constant = keyboardSize.height //+ your desired height above keyboard
}

@objc func keyboardWillHide(_ notification: Notification){
    constraintToChange.constant = 0.0 //+ your desired height above bottom of the screen
}

Now the most important bit . Your text view has to satisfy to conditions:

1. It's height constraint has to be set to "less than or equal" to allow it to shrink.
2. It's content hugging priority has to be of highest value among all of your views. This enables shrinking.
3. It' content compression resistance priority has to be low. This guarantees that it won't block shrinking.

here is a proper tab (the one with ruler) visible when you click on the height constraint of your text view:

and what you should see when you open text view (again ruler tab) in interface builder:

The effect is as shown here: