{"id":125,"date":"2018-09-01T10:09:27","date_gmt":"2018-09-01T10:09:27","guid":{"rendered":"http:\/\/139.59.4.234\/blog-test\/?p=125"},"modified":"2019-01-12T12:15:18","modified_gmt":"2019-01-12T12:15:18","slug":"ios-resizing-the-scrollview-on-keyboard-appearance","status":"publish","type":"post","link":"https:\/\/citrusleaf.in\/blog\/ios-resizing-the-scrollview-on-keyboard-appearance\/","title":{"rendered":"iOS &#8211; Resizing the ScrollView on keyboard appearance"},"content":{"rendered":"<p>While building an iOS app recently, we struggled a bit to resize the scroll view on keyboard appearance. Since the solution is not so straight, we decided to document it for everyone else to use.<\/p>\n<p>This is how it looks like:<\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/i0.wp.com\/blog.citrusleaf.in\/storage\/ezgif.com-video-to-gif.gif?w=790\" alt=\"ezgif.com-video-to-gif.gif\"><\/p>\n<p>&nbsp;<\/p>\n<p>And here&#8217;s how we did it-<\/p>\n<p>In your ViewController implement UITextFieldDelegate. In viewDidLoad() add following code:<\/p>\n<pre><code>        \/\/Setting delegate for textfield\n        myFirstTextField.delegate = self\n        mySecondTextField.delegate = self<\/code><\/pre>\n<p>Add following optional variable to the ViewController:<\/p>\n<pre><code>        \/* this will hold the current text field being edited *\/\n        var currentTextField:UITextField?\n        \/* this will hold the contentoffset of the scrollview before resizing of the scrollview, this will be used to restore the content offset of scroll view when keyboard is hidden *\/\n        var lastOffset:CGPoint?\n        \/\/this will hold the height of keyboard\n        var keyboardHeight:CGFloat?<\/code><\/pre>\n<p>We need to add following two actions from UITextFieldDelegate:<\/p>\n<pre><code>        func textFieldShouldBeginEditing(_ textField: UITextField) -&gt; Bool {\n        currentTextField = textField\n        lastOffset = self.scrollView.contentOffset\n        return true\n        }\n        func textFieldShouldReturn(_ textField: UITextField) -&gt; Bool {\n        currentTextField?.resignFirstResponder()\n        currentTextField = nil\n        return true\n        }<\/code><\/pre>\n<p>Now add following two observers:<\/p>\n<pre><code>        @objc func keyboardWillShow(notification: NSNotification) {\n        if keyboardHeight != nil {\n        return\n        }\n        \/\/UIKeyboardFrameBeginUserInfoKey\n        if let keyboardSize = (notification.userInfo?[UIKeyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue.size {\n        keyboardHeight = keyboardSize.height\n        UIView.animate(withDuration: 0.3, animations: {\n        self.constraintContentHeight.constant += self.keyboardHeight!\n        })\n        let distanceToBottom = self.scrollView.frame.size.height - (currentTextField?.frame.origin.y)! - (currentTextField?.frame.size.height)!\n        let collapseSpace = keyboardHeight! - distanceToBottom\n        if collapseSpace &lt; 0 {\n        return\n        }\n        UIView.animate(withDuration: 0.3, animations: {\n        \/\/Your scrollview will scroll to 5 coordinates above the keyboard\n        self.scrollView.contentOffset = CGPoint(x: (self.lastOffset?.x)!, y: collapseSpace + 5)\n        })\n        }\n        }\n        @objc func keyboardWillHide(notification: NSNotification) {\n        if self.keyboardHeight != nil{\n        UIView.animate(withDuration: 0.3) {\n        self.constraintContentHeight.constant -= self.keyboardHeight!\n        self.scrollView.contentOffset = self.lastOffset!\n        }\n        keyboardHeight = nil\n        }\n        }<\/code><\/pre>\n<p>In viewDidLoad() add two functions as observers:<\/p>\n<pre><code>    \/\/Adding observers\n    NotificationCenter.default.addObserver(self, selector: #selector(ViewController.keyboardWillShow), name: Notification.Name.UIKeyboardWillShow, object: nil)\n    NotificationCenter.default.addObserver(self, selector: #selector(ViewController.keyboardWillHide), name: Notification.Name.UIKeyboardWillHide, object: nil)<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>While building an iOS app recently, we struggled a bit to resize the scroll view on keyboard appearance. Since the solution is not so straight, we decided to document it for everyone else to use.&hellip; <\/p>\n","protected":false},"author":2,"featured_media":126,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false},"version":2}},"categories":[10],"tags":[],"class_list":["post-125","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/citrusleaf.in\/blog\/wp-content\/uploads\/2018\/10\/featured_image-5.png?fit=900%2C506&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/pei5Vv-21","_links":{"self":[{"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/posts\/125","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/comments?post=125"}],"version-history":[{"count":3,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/posts\/125\/revisions"}],"predecessor-version":[{"id":241,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/posts\/125\/revisions\/241"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/media\/126"}],"wp:attachment":[{"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/media?parent=125"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/categories?post=125"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/citrusleaf.in\/blog\/wp-json\/wp\/v2\/tags?post=125"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}