Show Menu

Do you have a job opening?

Submit your 30 day Job Listing for FREE

When the user taps in a text field, that text field becomes the first responder and automatically asks the system to display the associated keyboard.

The appearance of the keyboard might obscure portions of the UI that you would like to keep visible. Usually the content scrolls up so that it doesn’t get obscured by the keyboard. Let’s find out how to do that.

You may want to check out my previous quick tip: How to manage the keyboard for a UITextField

I’ll use as example a simple sign in view with two UITextFields, one for username and one for password and a sign in button.

basic iOS application

When we tap on one of those text fields the keyboard appears and it will obscure the sign in button and the password text field:

iOS Application Keyboard

It would be nice if the text fields would move up so that they are in the centre of the screen and the sign in button is visible underneath. To do this we will use a UIScrollView and make sure we scroll the content so it’s positioned in the centre of the screen. If you have your text fields in a nib file or storyboard then all you need to do is embed it in a scroll view. For our sign in view I will select all the controls I want to scroll (this includes labels, the two text fields and the sign in button) and go to Editor -> Embed In -> Scroll View. If you have created the text field programatically then create a UIScrollView and add the text field to it.

We need to sign up to receive notifications for when the keyboard appears and disappears. We will create a method called registerForKeyboardNotifications and one deregisterForKeyboardNotifications. We will call registerForKeyboardNotifications from viewWillAppear: and deregisterFromKeyboardNotifications in viewWillDisappear:

- (void)registerForKeyboardNotifications {
    [[NSNotificationCenter defaultCenter] addObserver:self
    [[NSNotificationCenter defaultCenter] addObserver:self
- (void)deregisterFromKeyboardNotifications {
    [[NSNotificationCenter defaultCenter] removeObserver:self
    [[NSNotificationCenter defaultCenter] removeObserver:self
- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    [self registerForKeyboardNotifications];
- (void)viewWillDisappear:(BOOL)animated {
    [self deregisterFromKeyboardNotifications];
    [super viewWillDisappear:animated];

We want to scroll the content so that the sign in button is above the keyboard. To do this we get the current location of the sign in button, check if it’s being obscured by the keyboard and if it is then we scroll the content up so that the button is visible just above the keyboard. Here is the code for this:

- (void)keyboardWasShown:(NSNotification *)notification {
    NSDictionary* info = [notification userInfo];
    CGSize keyboardSize = [[info objectForKey:UIKeyboardFrameBeginUserInfoKey] CGRectValue].size;
    CGPoint buttonOrigin = self.signInButton.frame.origin;
    CGFloat buttonHeight = self.signInButton.frame.size.height;
    CGRect visibleRect = self.view.frame;
    visibleRect.size.height -= keyboardSize.height;
    if (!CGRectContainsPoint(visibleRect, buttonOrigin)){
        CGPoint scrollPoint = CGPointMake(0.0, buttonOrigin.y - visibleRect.size.height + buttonHeight);
        [self.scrollView setContentOffset:scrollPoint animated:YES];
- (void)keyboardWillBeHidden:(NSNotification *)notification {
    [self.scrollView setContentOffset:CGPointZero animated:YES];

So, to summarise, these are the steps we took:

– Embed the UI controls in a UIScrollView
– Register for keyboard notifications
– Scroll the scroll view so that the content you want visible is above the keyboard

having issues?

We have a Questions and Answer section where you can ask your iOS Development questions to thousands of iOS Developers.

Ask Question

FREE Download!

Get your FREE Swift 2 Cheat Sheet and quick reference guide PDF download when you sign up to SwiftMonthly

Sharing is caring

If you enjoyed this tutorial, please help us and others by sharing using one of the social media buttons below.

Written by:

Vasilica Costescu is just a girl that loves her iPhone and iOS programming, she graduated from: West University of Timisoara with a degree in Computer Science in 2006. Her blog has awesome articles. Check it out.