I have some issues with moving a custom UIView, an alert basically, up.
When I open the keyboard, everything works fine and the alert moves up as it should.
However, as soon as I digit something in the textField the alert falls back to its original position.
I have no clue why this is happening. BTW, alert view is added in storyboard and constrained to the center.
I have attached some explanatory images
Thanks in advance.
class AlertViewController: UIViewController {
#IBOutlet var AlertView: UIView! //Alert View storyboard outlet
override func viewDidLoad() {
NotificationCenter.default.addObserver(self, selector: #selector(self.keyboardWillShow), name:
UIResponder.keyboardWillShowNotification, object: nil)
}
#objc func keyboardWillShow(notification: NSNotification){
guard let keyboardSize = (notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue else {
// if keyboard size is not available for some reason, don't do anything
return
}
let keyBoardTop = self.view.frame.height - keyboardSize.height
let bottomOfAlertView = AlertView.convert(AlertView.bounds, to: self.view).maxY;
print("keyBoardTop: \(keyBoardTop)")
print("BottomOfAlertView: \(bottomOfAlertView)")
print(AlertView.frame.origin.y)
AlertView.frame.origin.y = AlertView.frame.origin.y - (bottomOfAlertView - keyBoardTop)
}
}
Img Correct
Img Alert after typing
What about trying to change the bottom constraint of the alert like this
#objc func handleShowKeyboard(_ notification: Notification) {
if let keyboardFrame: NSValue = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? NSValue {
let keyboardRectangle = keyboardFrame.cgRectValue
let keyboardOffset = keyboardRectangle.height
if AlertView.viewBottomAnchor.constant == 0 {
AlertView.viewBottomAnchor.constant -= (keyboardOffset - self.view.safeAreaInsets.bottom)
AlertView.layoutIfNeeded()
}
}
}
Related
I have a text input field at the bottom of my view, which I'm trying to animate up and down to stay on top of the keyboard.
func setupKeyboardObservers() {
NotificationCenter.default.addObserver(self, selector: #selector(handleKeyboardWillChangeFrame), name: UIResponder.keyboardWillChangeFrameNotification, object: nil)
NotificationCenter.default.addObserver(self, selector: #selector(handleKeyboardDidShow), name: UIResponder.keyboardDidShowNotification, object: nil)
NotificationCenter.default.addObserver(self, selector: #selector(handleKeyboardWillChangeFrame), name: UIResponder.keyboardWillHideNotification, object: nil)
}
#objc func handleKeyboardWillChangeFrame(notification: NSNotification) {
let keyboardFrame = (notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue
let keyboardDuration = (notification.userInfo?[UIResponder.keyboardAnimationDurationUserInfoKey] as? Double)
print(keyboardFrame)
orderDetailView?.textInputViewBottomAnchor?.constant = -keyboardFrame!.height
UIView.animate(withDuration: keyboardDuration!) {
self.view.layoutIfNeeded()
}
}
OrderDetailView is the view for the viewcontroller.
The textinputview is the part that animates, and it works correctly when the keyboard first shows up, but does not animate back when I send a message and the keyboard resigns first responder, nor if I resignfirstresponder by clicking outside the keyboard.
When I print the cgrect value from keyboardFrameEndUserInfoKey, it returns the same frame value as when the keyboard is present (instead of 0).
This only seems to work properly when I drag down the keyboard from the view.
Thanks for your help.
In your case the height is still non-zero when keyboard hides which I assume is your issue. You need to convert keyboard frame to your view coordinate system and setup constraints according to that. Check the following:
#objc private func onKeyboardChange(notification: NSNotification) {
guard let info = notification.userInfo else { return }
guard let value: NSValue = info[UIKeyboardFrameEndUserInfoKey] as? NSValue else { return }
let newFrame = value.cgRectValue
if let durationNumber = info[UIKeyboardAnimationDurationUserInfoKey] as? NSNumber, let keyboardCurveNumber = info[UIKeyboardAnimationCurveUserInfoKey] as? NSNumber {
let duration = durationNumber.doubleValue
let keyboardCurve = keyboardCurveNumber.uintValue
UIView.animate(withDuration: duration, delay: 0, options: UIViewAnimationOptions(rawValue: keyboardCurve), animations: {
self.updateFromKeyboardChangeToFrame(newFrame)
}, completion: { _ in
// After animation
})
} else {
self.updateFromKeyboardChangeToFrame(newFrame)
}
}
private func updateFromKeyboardChangeToFrame(_ keyboardFrame: CGRect) {
let view: UIView! // Whatever view that uses bottom constraint
let bottomConstraint: NSLayoutConstraint! // Your bottom constraint
let constant = view.bounds.height-max(0, view.convert(keyboardFrame, from: nil).origin.y)
bottomConstraint.constant = max(0, constant)
view.layoutIfNeeded()
}
In your case you seem to use
let view = self.view
let bottomConstraint = orderDetailView?.textInputViewBottomAnchor
and it depends on how you define your constraint but it seems you will need to use negative values as bottomConstraint.constant = -max(0, constant).
I have created an extension of UIScrollView where when a user selects a textfield and the keyboard appears, the textfield will scroll up if it is in the way of the keyboard. I have it working for a UITextField but it doesn't seem to work with a UITextView. I have searched many posts on stackoverflow but can't seem to find anything to help. Here is the code for the extension:
extension UIScrollView {
func respondToKeyboard() {
self.registerForKeyboardNotifications()
}
func registerForKeyboardNotifications() {
// Register to be notified if the keyboard is changing size i.e. shown or hidden
NSNotificationCenter.defaultCenter().addObserver(
self,
selector: #selector(keyboardWasShown(_:)),
name: UIKeyboardWillShowNotification,
object: nil
)
NSNotificationCenter.defaultCenter().addObserver(
self,
selector: #selector(keyboardWillBeHidden(_:)),
name: UIKeyboardWillHideNotification,
object: nil
)
}
func keyboardWasShown(notification: NSNotification) {
if let info = notification.userInfo,
keyboardSize = info[UIKeyboardFrameBeginUserInfoKey]?.CGRectValue.size {
self.contentInset.bottom = keyboardSize.height + 15
self.scrollIndicatorInsets.bottom = keyboardSize.height
var frame = self.frame
frame.size.height -= keyboardSize.height
}
}
func keyboardWillBeHidden(notification: NSNotification) {
self.contentInset.bottom = 0
self.scrollIndicatorInsets.bottom = 0
}
In my view controller I would just set it like:
scrollView.respondToKeyboard()
Can someone point me in the right direction of how I can implement the UITextView as an extension to move up if the keyboard is in the way?
You can try using the UITextView delegate methods. Check out this link for more details. For swift, check the tutorial here.
for me this solution works fine for UITextView. Perhaps u can update this for Scrollview
// keyboard visible??
lazy var keyboardVisible = false
// Keyboard-Height
lazy var keyboardHeight: CGFloat = 0
func updateTextViewSizeForKeyboardHeight(keyboardHeight: CGFloat) {
textView.contentInset.bottom = keyboardHeight
self.keyboardHeight = keyboardHeight
}
func keyboardDidShow(notification: NSNotification) {
if let rectValue = notification.userInfo?[UIKeyboardFrameBeginUserInfoKey] as? NSValue {
if keyboardVisible == false {
let keyboardSize = rectValue.CGRectValue().size
keyboardVisible = true
updateTextViewSizeForKeyboardHeight(keyboardSize.height)
}
}
}
func keyboardDidHide(notification: NSNotification) {
if keyboardVisible {
keyboardVisible = false
updateTextViewSizeForKeyboardHeight(0)
}
}
i have developed on im app. when the user taps the text field the keyboard pops up and the table view containing the messages moves up but the top of the table view is un viewable as it is off the screen. it is also having the undesired effect of turning the screen black when the user moves the keyboard suggestions up or down
override func viewWillAppear(animated:Bool) {
super.viewWillAppear(animated)
NSNotificationCenter.defaultCenter().addObserver(self, selector: Selector("keyboardWillShow:"), name: UIKeyboardWillShowNotification, object: nil)
NSNotificationCenter.defaultCenter().addObserver(self, selector: Selector("keyboardWillHide:"), name: UIKeyboardWillHideNotification, object: nil)
}
func keyboardWillShow(notification: NSNotification) {
if let userInfo = notification.userInfo {
if let keyboardSize = (userInfo[UIKeyboardFrameBeginUserInfoKey] as? NSValue)?.CGRectValue() {
kbHeight = keyboardSize.height
self.animateTextField(true)
}
}
}
func keyboardWillHide(notification: NSNotification) {
self.animateTextField(false)
}
func animateTextField(up: Bool) {
let movement = (up ? -kbHeight : kbHeight)
UIView.animateWithDuration(0.2, animations: {
self.view.frame = CGRectOffset(self.view.frame, 0, movement)
})
}
How can i control the display of the tableview, text field and keyboard?
Edit
desired behaviour.
from the start
i would like the view keyboard to be collapsed (working fine)
table view showing the messages (working fine)
and ta text field at the bottom of the screen (working fine)
when Text field is tapped
keyboard pops up (working)
text field moves to top of keyboard (working)
table view displays in remaining space above text field (not working, it is above textfield but half is spilling of the screen to the top)
other bug
the screen is going black when show/hide the autocomplete words on top of the keyboard
I found the solution and it worked for me.
Please check in your project. (Eendje's solution)
Resize the screen when keyboard appears
You can create an outlet of the bottom auto layout constraint of your table view.
Then simply use this code:
func keyboardWillShow(sender: NSNotification) {
let info = sender.userInfo!
var keyboardSize = (info[UIKeyboardFrameEndUserInfoKey] as! NSValue).CGRectValue().height
bottomConstraint.constant = keyboardSize - bottomLayoutGuide.length
let duration: NSTimeInterval = (info[UIKeyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
UIView.animateWithDuration(duration) { self.view.layoutIfNeeded() }
}
func keyboardWillHide(sender: NSNotification) {
let info = sender.userInfo!
let duration: NSTimeInterval = (info[UIKeyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
bottomConstraint.constant = 0
UIView.animateWithDuration(duration) { self.view.layoutIfNeeded() }
}
If you have trouble creating the bottom constraint:
In storyboard
Select your search bar.
At the corner in the lower right you'll see 3 icons. Click the middle one looking like |-[]-|.
At the top of that popup, there are 4 boxes. Enter 0 at the one for the bottom.
Constraint created!
Now you can drag it to your view controller and add it as an outlet.
Another solution is to set the tableView.contentInset.bottom. But I haven't done that before. If you prefer that, I can try to explain it.
Using inset:
func keyboardWillShow(sender: NSNotification) {
let info = sender.userInfo!
var keyboardSize = (info[UIKeyboardFrameEndUserInfoKey] as! NSValue).CGRectValue().height
tableView.contentInset.bottom = keyboardSize
}
func keyboardWillHide(sender: NSNotification) {
tableView.contentInset.bottom = 0
}
You can try this code for setting the inset. I haven't tried it myself yet, but it should be something like that.
I used constraint solution to fix my problem.
try this for keyboard.
-viewDidLoad()
let tap: UITapGestureRecognizer = UITapGestureRecognizer(target: self, action: "dismissKeyboard")
view.addGestureRecognizer(tap)
and
func dismissKeyboard(){
view.endEditing(true)
}
I am building a chat app. I have to move a textfield when keyboard appears. I am doing this with the following code:
func keyboardWillShow(notification: NSNotification) {
if let userInfo = notification.userInfo {
if let keyboardSize = (userInfo[UIKeyboardFrameBeginUserInfoKey] as? NSValue)?.CGRectValue() {
kbHeight = keyboardSize.height
self.animateTextField(true)
}
}
}
func keyboardWillHide(notification: NSNotification) {
self.animateTextField(false)
}
func animateTextField(up: Bool) {
var movement = (up ? -kbHeight : kbHeight)
UIView.animateWithDuration(0.3, animations: {
self.view.frame = CGRectOffset(self.view.frame, 0, movement)
})
}
But when I use this code, the first messages doesn't show. I guess I have to resize the tableview.
Here are screenshots Before and After the keyboard appears:
I am using auto layout.
How can I resolve this problem?
2020 UPDATE
Correctly using a constraint...
There is only one way to properly handle this mess in iOS.
Paste KUIViewController below in to your project,
Create a constraint which is very simply to the "bottom of your content".
Drag that constraint to bottomConstraintForKeyboard
KUIViewController will automatically and correctly resize your content view at all times.
Absolutely everything is totally automatic.
All Apple behaviors are handled correctly in the standard way, such as dismissing by taps, etc etc.
You are 100% completely done.
So "which view should you resize?"
You can not use .view ...
Because ... you cannot resize the .view in iOS!!!!!! Doh!
Simply make a UIView named "holder". It sits inside .view.
Put everything of yours inside "holder".
Holder will of course have four simple constraints top/bottom/left/right to .view.
That bottom constraint to "holder" is indeed bottomConstraintForKeyboard.
You're done.
Send a bill to the cliient and go drinking.
There is nothing more to do.
class KUIViewController: UIViewController {
// KBaseVC is the KEYBOARD variant BaseVC. more on this later
#IBOutlet var bottomConstraintForKeyboard: NSLayoutConstraint!
#objc func keyboardWillShow(sender: NSNotification) {
let i = sender.userInfo!
let s: TimeInterval = (i[UIResponder.keyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
let k = (i[UIResponder.keyboardFrameEndUserInfoKey] as! NSValue).cgRectValue.height
bottomConstraintForKeyboard.constant = k
// Note. that is the correct, actual value. Some prefer to use:
// bottomConstraintForKeyboard.constant = k - bottomLayoutGuide.length
UIView.animate(withDuration: s) { self.view.layoutIfNeeded() }
}
#objc func keyboardWillHide(sender: NSNotification) {
let info = sender.userInfo!
let s: TimeInterval = (info[UIResponder.keyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
bottomConstraintForKeyboard.constant = 0
UIView.animate(withDuration: s) { self.view.layoutIfNeeded() }
}
#objc func clearKeyboard() {
view.endEditing(true)
// (subtle iOS bug/problem in obscure cases: see note below
// you may prefer to add a short delay here)
}
func keyboardNotifications() {
NotificationCenter.default.addObserver(self,
selector: #selector(keyboardWillShow),
name: UIResponder.keyboardWillShowNotification,
object: nil)
NotificationCenter.default.addObserver(self,
selector: #selector(keyboardWillHide),
name: UIResponder.keyboardWillHideNotification,
object: nil)
}
override func viewDidLoad() {
super.viewDidLoad()
keyboardNotifications()
let t = UITapGestureRecognizer(target: self, action: #selector(clearKeyboard))
view.addGestureRecognizer(t)
t.cancelsTouchesInView = false
}
}
Simply ...
Use KUIViewController anywhere a keyboard might appear.
class AddCustomer: KUIViewController, SomeProtocol {
class EnterPost: KUIViewController {
class EditPurchase: KUIViewController {
On those screens absolutely everything is now completely automatic regarding the keyboard.
You're done.
Phew.
*Minor footnote - background clicks correctly dismiss the keyboard. That includes clicks which fall on your content. This is correct Apple behavior. Any unusual variation from that would take a huge amount of very anti-Apple custom programming.
*Extremely minor footnote - so, any and all buttons on the screen will work 100% correctly every time. However in the INCREDIBLY obscure case of nested (!) container views inside nested (!) scroll views with nested (!) page view containers (!!!!), you may find that a button will seemingly not work. This seems to be basically a (obscure!) problem in current iOS. If you encounter this incredibly obscure problem, fortunately the solution is simple. Looking at the function clearKeyboard(), simply add a short delay, you're done.
#objc func clearKeyboard() {
DispatchQueue.main.asyncAfter(deadline: .now() + .milliseconds(100)) {
self.view.endEditing(true)
}
}
(A great tip from user #wildcat12 https://stackoverflow.com/a/57698468/294884 )
You can create an outlet of the bottom auto layout constraint of your table view.
Then simply use this code:
func keyboardWillShow(sender: NSNotification) {
let info = sender.userInfo!
var keyboardSize = (info[UIKeyboardFrameEndUserInfoKey] as! NSValue).cgRectValue.height
bottomConstraint.constant = keyboardSize - bottomLayoutGuide.length
let duration: TimeInterval = (info[UIKeyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
UIView.animate(withDuration: duration) { self.view.layoutIfNeeded() }
}
func keyboardWillHide(sender: NSNotification) {
let info = sender.userInfo!
let duration: TimeInterval = (info[UIKeyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
bottomConstraint.constant = 0
UIView.animate(withDuration: duration) { self.view.layoutIfNeeded() }
}
If you have trouble creating the bottom constraint:
In storyboard
Select your search bar.
At the corner in the lower right you'll see 3 icons. Click the middle one looking like |-[]-|.
At the top of that popup, there are 4 boxes. Enter 0 at the one for the bottom.
Constraint created!
Now you can drag it to your view controller and add it as an outlet.
Another solution is to set the tableView.contentInset.bottom. But I haven't done that before. If you prefer that, I can try to explain it.
Using inset:
func keyboardWillShow(sender: NSNotification) {
let info = sender.userInfo!
let keyboardSize = (info[UIKeyboardFrameEndUserInfoKey] as! NSValue).cgRectValue.height
tableView.contentInset.bottom = keyboardSize
}
func keyboardWillHide(sender: NSNotification) {
tableView.contentInset.bottom = 0
}
You can try this code for setting the inset. I haven't tried it myself yet, but it should be something like that.
EDIT: Changed the duration with the advice of nacho4d
From #Fattie 's message:
A detail - (unfortunately) clicks on your content will also dismiss the keyboard. (They both get the event.) However, this is almost always correct behavior; give it a try. There is no reasonable was to avoid this, so forget about it and go with the Apple-flow.
This can be solved by implementing the following UIGestureRecognizerDelegate's method:
func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldReceive touch: UITouch) -> Bool {
return !(touch.view?.isKind(of: UIControl.self) ?? true)
}
That way, if the user touches any UIControl (UIButton, UITextField, etc.) the gesture recognizer won't call the clearKeyboard() method.
For this to work, remember to subclass UIGestureRecognizerDelegate either at class definition or with an extension. Then, in viewDidLoad() you should assign the gesture recognizer delegate as self.
Ready to copy and paste code:
// 1. Subclass UIGestureRecognizerDelegate
class KUIViewController: UIViewController, UIGestureRecognizerDelegate {
#IBOutlet var bottomConstraintForKeyboard: NSLayoutConstraint!
func keyboardWillShow(sender: NSNotification) {
let i = sender.userInfo!
let k = (i[UIKeyboardFrameEndUserInfoKey] as! NSValue).cgRectValue.height
bottomConstraintForKeyboard.constant = k - bottomLayoutGuide.length
let s: TimeInterval = (i[UIKeyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
UIView.animate(withDuration: s) { self.view.layoutIfNeeded() }
}
func keyboardWillHide(sender: NSNotification) {
let info = sender.userInfo!
let s: TimeInterval = (info[UIKeyboardAnimationDurationUserInfoKey] as! NSNumber).doubleValue
bottomConstraintForKeyboard.constant = 0
UIView.animate(withDuration: s) { self.view.layoutIfNeeded() }
}
func keyboardNotifications() {
NotificationCenter.default.addObserver(self,
selector: #selector(keyboardWillShow),
name: Notification.Name.UIKeyboardWillShow,
object: nil)
NotificationCenter.default.addObserver(self,
selector: #selector(keyboardWillHide),
name: Notification.Name.UIKeyboardWillHide,
object: nil)
}
func clearKeyboard() {
view.endEditing(true)
}
override func viewDidLoad() {
super.viewDidLoad()
keyboardNotifications()
let t = UITapGestureRecognizer(target: self, action: #selector(clearKeyboard))
view.addGestureRecognizer(t)
t.cancelsTouchesInView = false
// 2. Set the gesture recognizer's delegate as self
t.delegate = self
}
// 3. Implement this method from UIGestureRecognizerDelegate
func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldReceive touch: UITouch) -> Bool {
return !(touch.view?.isKind(of: UIControl.self) ?? true)
}
}
Maybe it will help somebody.
You can achieve the desired behavior without using interface builder at all
First of all you will need to create a constraint and calculate safe area insets in order to support buttonless devices properly
var container: UIView!
var bottomConstraint: NSLayoutConstraint!
let safeInsets = UIApplication.shared.windows[0].safeAreaInsets
then initialize it somewhere in your code
container = UIView()
bottomConstraint = container.bottomAnchor.constraint(equalTo: view.bottomAnchor)
attach it to view and activate
view.addSubview(container)
NSLayoutConstraint.activate([
...
container.leadingAnchor.constraint(equalTo: view.leadingAnchor),
container.trailingAnchor.constraint(equalTo: view.trailingAnchor),
container.topAnchor.constraint(equalTo: view.topAnchor),
bottomConstraint,
...
])
and finally
#objc func keyboardWillShow(notification: NSNotification) {
if let keyboardSize = (notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue {
if bottomConstraint.constant == 0 {
bottomConstraint.constant = -keyboardSize.height + safeInsets.bottom
view.layoutIfNeeded()
}
}
}
#objc func keyboardWillHide(notification: NSNotification) {
bottomConstraint.constant = 0
view.layoutIfNeeded()
}
Also if your view is something scrollable and you want to move it up with keyboard and return to initial position as the keyboard hides, you can change view's contentOffset
view.contentOffset = CGPoint(x: view.contentOffset.x, y: view.contentOffset.y + keyboardSize.height - safeInsets.bottom)
for scrolling up, and
view.contentOffset = CGPoint(x: view.contentOffset.x, y: view.contentOffset.y - keyboardSize.height + safeInsets.bottom)
to move it down
if you don't want to fight with this yourself you might find the TPKeyboardAvoiding framework useful
Simply just following the 'installation instructions' i.e. drag and drop the appropriate .h/.m files into your project and then make you ScrollView / TableView a subclass like below:
I have a text view that sits at the bottom of my screen, and would like to push it up when users start editing the text view. I know how to push the view upwards, but because of different screen sizes the display isn't always the same. I'd like to get the height of the keyboard so that the text view sits just above it when a user edits. I have a piece of code below, yet when I add the following 3 lines, the app fails to build and gives me an error. Without this piece of code, the app runs perfectly. The error I get is "swift compiler error: expected declaration". These lines go into my keyboardWillShow function.
if let userInfo = sender.userInfo {
if let keyboardSize = (userInfo[UIKeyboardFrameBeginUserInfoKey] as? NSValue)?.CGRectValue() {
keyboardHeight = keyboardSize.height
}
So the full code looks like this.
override func viewDidLoad() {
super.viewDidLoad()
NSNotificationCenter.defaultCenter().addObserver(self, selector: Selector("keyboardWillShow:"), name:UIKeyboardWillShowNotification, object: nil);
NSNotificationCenter.defaultCenter().addObserver(self, selector: Selector("keyboardWillHide:"), name:UIKeyboardWillHideNotification, object: nil);
}
var isShown: Bool = false
var willHide: Bool = false
var keyboardHeight: CGFloat = 0
func keyboardWillShow(sender: NSNotification) {
isShown = true
//The following 3 lines seem to be the problem. Somehow the code stops working when I add them.
if let userInfo = sender.userInfo {
if let keyboardSize = (userInfo[UIKeyboardFrameBeginUserInfoKey] as? NSValue)?.CGRectValue() {
keyboardHeight = keyboardSize.height
}
}
func keyboardWillHide(sender: NSNotification) {
willHide = true
}
func textViewDidBeginEditing(textView: UITextView) {
if isShown == true {
self.view.frame.origin.y -= keyboardHeight
}
}
func textViewDidEndEditing(textView: UITextView) {
if willHide == true {
self.view.frame.origin.y += keyboardHeight
}
}