chrs chrs - 1 month ago 21
iOS Question

How to make a UITextView scroll while typing/editing

UPDATE
This seemed to be an issue with IOS 7 only. A great workaround has been added to accepted answer.

I have created a custom control that contains a UITextView and UILabel which contains the title of the textview ie my control.
My control automatically changes size to adapt the textview and the title. Before this happens I change the size of the textview to fit the text.
This works optimally.

I've added functionality so the textview automatically scrolls to the last line. Or that's at least what I'm trying. It works fine as long as the last line contains anything but empty text. If the text is empty, it rolls down so you can only see about half of the cursor.

What am I doing wrong?

So you can understand it better I have made some images:

This is me typing a word and making some linebreaks. (Still not enough to make it scroll)

Before making a line break

And the I make a line break. (pressing enter) Look close at how the cursor is halved. This is the issue!

The Issue

I have made the next picture so you can see exactly what I expected.

What I Want!

Answer

Problems with other answers:

  • when only scanning for "\n", if you type a line of text that exceeds the width of the text view, then scrolling will not occur.
  • when always setting contentOffset in textViewDidChange:, if you edit the middle of the text you do not want to scroll to the bottom.

The solution is to add this to the text view delegate:

- (void)textViewDidChange:(UITextView *)textView {
    CGRect line = [textView caretRectForPosition:
        textView.selectedTextRange.start];
    CGFloat overflow = line.origin.y + line.size.height
        - ( textView.contentOffset.y + textView.bounds.size.height
        - textView.contentInset.bottom - textView.contentInset.top );
    if ( overflow > 0 ) {
        // We are at the bottom of the visible text and introduced a line feed, scroll down (iOS 7 does not do it)
        // Scroll caret to visible area
        CGPoint offset = textView.contentOffset;
        offset.y += overflow + 7; // leave 7 pixels margin
        // Cannot animate with setContentOffset:animated: or caret will not appear
        [UIView animateWithDuration:.2 animations:^{
            [textView setContentOffset:offset];
        }];
    }
}