iPhone: scroll table view cell to visible above custom keyboard-aligned toolbar?

Question

I've been asking a question or two over the past few days of working on an application that keeps a custom toolbar aligned to the top of the iPhone keyboard. I'm using the method described by Josh in this question; basically, I have the view controller listen for the UIKeyboardWillShowNotification and add the toolbar as necessary.

The view controller itself manages a table view whose cells all contain a UITextField. The keyboard and toolbar being presented are editing these text fields. The only issue I'm still having is this: when the keyboard and toolbar are presented for a cell more than about halfway down the table, it scrolls to be visible above the keyboard, but not above the toolbar.

The cells and text fields are still editable, but about half the cell is hidden under the toolbar. If I disappear the toolbar (don't add it in the notification responder), the entire cell becomes visible, but obviously I lose the functionality the toolbar provides.

Is there a way to change the location the text field gets scrolled to? I've tried playing around with the UITableView method scrollToRowAtIndexPath:atScrollPosition:animated:, but it tends to give weird results when toggling through several cells.

What's the best method for scrolling a table view cell to a visible position above a custom keyboard toolbar?

Answer 1

Maybe you could resize the UITableView to be the height between the navigation bar and the toolbar above the keyboard, and then scroll the row into view?

Answer 2

I do exactly what you are describing in my app. This is the code I use, verbatim. It's very nicely animated, and seems to work wonderfully.

Two disclaimers:

1. I pass in parentView as part of a custom initialization.
2. I did not write this code, I'm not taking credit for it. I got it from Matt Gallagher's truly wonderful blog Cocoa With Love.

---

static const CGFloat KEYBOARD_ANIMATION_DURATION = 0.3;
static const CGFloat MINIMUM_SCROLL_FRACTION = 0.2;
static const CGFloat MAXIMUM_SCROLL_FRACTION = 0.8;
// adjust this following value to account for the height of your toolbar, too
static const CGFloat PORTRAIT_KEYBOARD_HEIGHT = 216;


- (void)textFieldDidEndEditing:(UITextField *)textField
{
  CGRect viewFrame = self.parentView.frame;
  viewFrame.origin.y += animatedDistance;

  [UIView beginAnimations:nil context:NULL];
  [UIView setAnimationBeginsFromCurrentState:YES];
  [UIView setAnimationDuration:KEYBOARD_ANIMATION_DURATION];

  [self.parentView setFrame:viewFrame];

  [UIView commitAnimations];
}

- (void) textFieldDidBeginEditing:(UITextField*) textField {
  CGRect textFieldRect = [self.parentView.window convertRect:textField.bounds fromView:textField];
  CGRect viewRect = [self.parentView.window convertRect:self.parentView.bounds fromView:self.parentView];
  CGFloat midline = textFieldRect.origin.y + 0.5 * textFieldRect.size.height;
  CGFloat numerator = midline - viewRect.origin.y - MINIMUM_SCROLL_FRACTION * viewRect.size.height;
  CGFloat denominator = (MAXIMUM_SCROLL_FRACTION - MINIMUM_SCROLL_FRACTION) * viewRect.size.height;
  CGFloat heightFraction = numerator / denominator;

  if (heightFraction < 0.0) {
    heightFraction = 0.0;
  }else if (heightFraction > 1.0) {
    heightFraction = 1.0;
  }

  animatedDistance = floor(PORTRAIT_KEYBOARD_HEIGHT * heightFraction);

  CGRect viewFrame = self.parentView.frame;
  viewFrame.origin.y -= animatedDistance;

  [UIView beginAnimations:nil context:NULL];
  [UIView setAnimationBeginsFromCurrentState:YES];
  [UIView setAnimationDuration:KEYBOARD_ANIMATION_DURATION];

  [self.parentView setFrame:viewFrame];

  [UIView commitAnimations];
}

Answer 3

Since all UITableViews are also UIScrollViews, you can call all of the standard scroll methods on them.

Something like this will do:

- (void)scrollTableView:(UITableView *)tableView toIndexPath:(NSIndexPath *)indexPath withBottomPadding:(CGFloat)bottomPadding
{
    CGRect rectForRow = [tableView rectForRowAtIndexPath:indexPath];
    CGRect bounds = [tableView bounds];
    CGPoint contentOffset = [tableView contentSize];
    if (rectForRow.origin.y + rectForRow.size.height > contentOffset.y + bounds.size.height - bottomPadding)
        [tableView setContentOffset:rectForRow.origin.y + rectForRow.size.height - bounds.size.height - bottomPadding animated:YES];
    else
        [tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionNone animated:YES];
}

_{Note: I'm not at a Mac with Xcode at the moment. I will test this code when I am}