TextFields need a way to keep the input caret visible

If a TextField is being used within a ScrollView, when the TextField becomes tall enough the input caret can go offscreen behind the keyboard. There's no straightforward way to keep the caret visible.

One could use .id(_:) on something at the bottom of the TextField and scroll to that with the ScrollViewProxy but how would they know when to scroll?

  1. They could detect a height change of the TextField but if the user is typing towards the center of the field then we end up scrolling them away from their edit location to the bottom.
  2. They could detect a length change in the edited text but that has the same issue as #1.
  3. They could diff the edited text to see if the edits were at the end but then we're getting much more complex.

TLDR: We need a straightforward way to keep the TextField's input caret visible.

What I could see working would be something like a modifier for TextField like .cursorID(_:). We could then just scroll to that ID on input changes.

Here's a similar post on StackOverflow.

TextFields need a way to keep the input caret visible
 
 
Q