Keyboard animation moves the UITableView section header

Question

I'm having a problem, and I was wandering if somebody already experienced this before. The setup I have is the following: - I use a UIViewController with which is made up of 3 elements - UIView at the top
- UITableView in the centre - UiView at the bottom

What I'm doing is the following: I'm animating the bottom UIView to be push up once the keyboard is showed. This works fine, but the problem I'm having is that once the keyboard disappears, the section header of the fist cell in the table view is moved a bit downloads with the movement of the animation.

extension UserDetailsViewController: KeyboardDelegate {
func keyboardWillShow(notification: NSNotification) {
    if let info = notification.userInfo {
        let keyboardFrame = (info[UIKeyboardFrameEndUserInfoKey] as! NSValue).cgRectValue

        UIView.animate(withDuration: 0.3, animations:  {
            if UserDeviceType.IPad || UserDeviceType.IPadPro {
                self.updateConstraints(gradientHeight: 90, footerHeight: 60, footerBottom: keyboardFrame.height)
            } else if UserDeviceType.IPhone5 || UserDeviceType.IPhone4 {
                self.updateConstraints(gradientHeight: 65, footerHeight: 40, footerBottom: keyboardFrame.height)
            } else if UserDeviceType.IPhoneX {
                self.updateConstraints(gradientHeight: 90, footerHeight: 60, footerBottom: keyboardFrame.height)
            } else {
                self.updateConstraints(gradientHeight: 67, footerHeight: 40, footerBottom: keyboardFrame.height)
            }
            self.view.layoutIfNeeded()
            self.tableView.layoutIfNeeded()
        })
    }
}

func keyboardWillHide(notification: NSNotification) {
    UIView.animate(withDuration: 0.3, animations:  {
        self.setupConstraints()
        self.view.layoutIfNeeded()
        self.tableView.layoutIfNeeded()
    })
}
}

Keyboard showing up correctly

After the keyboard animating out

What I believe is that something is happening with the scrollview insets. The top inset is increased so that when instead of aligning the header section with the screen at the top it allows the cell to scroll beneath it. — HAK, Apr 30 '18 at 11:01
at first u should remove the animation in keyboardWillHide ... so you can be sure, its not because of the animation. the next step i would try is to check for the main thread at the keyboardWillHide. if this is not working, i can only help more when u showing us the setupConstraints and updateConstraints function. — Björn Ro, Apr 30 '18 at 12:59
oh and the userInfor of the keyboard notification contains as well the animation duration. your could use it in your animation :) The key is "UIKeyboardAnimationDurationUserInfoKey" — Björn Ro, Apr 30 '18 at 13:00

score 0 · Answer 1 · answered May 01 '18 at 16:14

The problem was introduced by the self.view.layoutIfNeeded() inside the animation. It seems that, after the layout step was performed, the top inset of the scrollview was unwillingly increased. The solution was to add the tableview function begin and end updates.

    func keyboardWillHide(notification: NSNotification) {
    if let info = notification.userInfo {
        self.tableView.beginUpdates()

        UIView.animate(withDuration: info[UIKeyboardAnimationDurationUserInfoKey] as! TimeInterval, animations:  {
            self.setupConstraints()
            self.view.layoutIfNeeded()
            self.tableView.endUpdates()
        })
    }
}

Keyboard animation moves the UITableView section header

1 Answers1