⌨️ Keyboard avoidance with a single line of code. Animate to text fields (or any responder), swipe down keyboard dismissal for free. See the corresponding article for more Keyboard Avoidance with a single line of code, also on detail how to backport keyboardLayoutGuide
to iOS 13 and iOS 14.
UIKit_Keyboard_Avoidance_Sign_Up_Form_KeyboardLayoutGuide.mp4
- Put everything in a scroll view.
- Pin the bottom of the scroll view to the top of the
keyboardLayoutGuide
. - Set
keyboardDismissMode
to.onDrag
.
class ViewController: UIViewController {
lazy var emailTextField = UITextField()
.withEmailStyle
.with(next: givenNameTextField)
lazy var givenNameTextField = UITextField()
.withGivenNameStyle
.with(next: familyNameTextField)
lazy var familyNameTextField = UITextField()
.withFamilyNameStyle
.with(next: passwordTextField)
lazy var passwordTextField = UITextField()
.withPasswordStyle
lazy var signUpButton = UIButton()
.withSignUpButtonStyle
lazy var content = UIStackView()
.vertical(spacing: UI.spacing)
.views(
HeaderView()
.withFixedHeight,
emailTextField,
givenNameTextField,
familyNameTextField,
passwordTextField,
signUpButton
)
lazy var body = UIScrollView()
.with {
$0.addSubview(content)
// 💎
$0.keyboardDismissMode = .onDrag
$0.bounces = false
}
.onMoveToSuperview { scrollView in
self.content.pin(to: scrollView)
self.content.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
}
var bottomConstraint: NSLayoutConstraint?
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .systemBackground
// Hierarchy.
view.addSubview(body)
body.translatesAutoresizingMaskIntoConstraints = false
body.topAnchor.constraint(equalTo: view.topAnchor, constant: UI.padding).isActive = true
// 💎
body.bottomAnchor.constraint(
equalTo: view.keyboardLayoutGuide.topAnchor,
constant: -UI.spacing
).isActive = true
body.leftAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leftAnchor, constant: UI.spacing).isActive = true
body.rightAnchor.constraint(equalTo: view.safeAreaLayoutGuide.rightAnchor, constant: -UI.spacing).isActive = true
}
}
The example above uses
Withable
, a simple inline decorator that helps simplify yourUIKit
code.
Licensed under the MIT License.