Adjusting interface when keyboard appears for UITextField or UITextView

Question

Hi all,

I have a table with each cell containing a label and a text field. Problem is that when i go to edit the last row, keyboard hides the lower portion of the table, and i can't see what is being typed. How can i move my interface above the keyboard so i see what is being typed?

Thanks, Mustafa

Answer 1

Just make sure that you have enough scrolling space below that. Because according to my knowledge the iPhone automatically adjusts and shows the focused textbox at the time its keyboard appears.

Answer 2

Check out this question: A UITableView list of editable text fields

Answer 3

You'll want to register your viewController for UIKeyboardDidShowNotification and UIKeyboardWillHideNotification events. When you get these, you should adjust the bounds of your table; the keyboard is 170 pixels height, so just shrink or grow your table bounds appropriately, and it should properly adjust to the keyboard.

Answer 4

Thanks guys, i will try these and will post the response here.

Answer 5

I'm stuck, and unable to solve this issue. In my case i have a complex table, and table header has another view. I've tried to follow the UICataglog example provided by Apple, but its not working... Here's the code:

# define kOFFSET_FOR_KEYBOARD 150.0  // keyboard is 150 pixels height

// Animate the entire view up or down, to prevent the keyboard from covering the author field.
- (void)setViewMovedUp:(BOOL)movedUp
{
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.3];

    // Make changes to the view's frame inside the animation block. They will be animated instead
    // of taking place immediately.
    CGRect rect = self.view.frame;
    CGRect textViewRect = self.textViewBeingEdited.frame;
    CGRect headerViewRect = self.headerView.frame;

    if (movedUp) {
        // If moving up, not only decrease the origin but increase the height so the view 
        // covers the entire screen behind the keyboard.
        rect.origin.y -= kOFFSET_FOR_KEYBOARD;
        rect.size.height += kOFFSET_FOR_KEYBOARD;
    } else {
        // If moving down, not only increase the origin but decrease the height.
        rect.origin.y += kOFFSET_FOR_KEYBOARD;
        rect.size.height -= kOFFSET_FOR_KEYBOARD;
    }

    self.view.frame = rect;
    [UIView commitAnimations];
}

Can anyone help me out here. I'm getting very unexpected results. What am i missing? I tied updating the origin's y coordinate and height of frame but nothing seems to be working.

Answer 6

Removing/commenting the lines where the rect hight is being modified seems to solve the problem. Thanks.

Modified Code:

# define kOFFSET_FOR_KEYBOARD 150.0     // keyboard is 150 pixels height

// Animate the entire view up or down, to prevent the keyboard from covering the author field.
- (void)setViewMovedUp:(BOOL)movedUp
{
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.3];

// Make changes to the view's frame inside the animation block. They will be animated instead
// of taking place immediately.
CGRect rect = self.view.frame;
CGRect textViewRect = self.textViewBeingEdited.frame;
CGRect headerViewRect = self.headerView.frame;

if (movedUp) {
    // If moving up, not only decrease the origin but increase the height so the view 
    // covers the entire screen behind the keyboard.
    rect.origin.y -= kOFFSET_FOR_KEYBOARD;
    // rect.size.height += kOFFSET_FOR_KEYBOARD;
} else {
    // If moving down, not only increase the origin but decrease the height.
    rect.origin.y += kOFFSET_FOR_KEYBOARD;
    // rect.size.height -= kOFFSET_FOR_KEYBOARD;
}

self.view.frame = rect;
[UIView commitAnimations];

}

Answer 7

This problem is complex depending on your UI scenario. Here I will discuss a scenario that where UITextField or UITextview resides in a UITableViewCell.

1. You need to use NSNotificationCenter to detect UIKeyboardDidShowNotification event. see http://iphonedevelopertips.com/user-interface/adjust-textfield-hidden-by-keyboard.html. You need to shrink the UITableView frame size so that it occupies only the screen area that is not covered by the keyboard.

   1. If you tap a UITableViewCell, the OS will automatically position the cell within the viewing area of UITableView. But it does not happen when you tap a UITextView or UITableViewCell even though it resides in a UITableViewCell.

You need to call

[myTableView selectRowAtIndexPath:self.indexPath animated:YES scrollPosition:UITableViewScrollPositionBottom];` 

to programmablly "tap" the cell.

If you implement both points, you will see the UITextView/Field position right above the keyboard. Bare in mind that the UITableViewCell where the UITableView/Field resides cannot be taller than the "not covered" area. If this is not the case for you, there is a different approach for it but I will not discuss here.