react-native-redux-form-example icon indicating copy to clipboard operation
react-native-redux-form-example copied to clipboard

TextInput does not scroll sideways when text overflows

Open bjrn opened this issue 8 years ago • 3 comments

Normally when cursor reaches right side of TextInput the text scrolls as you type. Not in this example. We ran into this recently when upgrading a project to React Native 0.41.0 and found out that the height of a TextInput must be larger than 30 for the expected sideway scrolling to work. We ended up setting height to 34 after some testing (primarily on iOS), but haven't done any deeper research on what may be causing it.

Changing height to 34 in MyTextInput.styles.js brings back text overflow in this example too.

Great article by the way!

bjrn avatar Feb 17 '17 23:02 bjrn

@bjrn thanks for the feedback!

sbalay avatar Feb 20 '17 01:02 sbalay

Another thing; have you by any chance found a nice way of enabling proceeding to next Field with onSubmitEditing and blurOnSubmit={false} with redux-form?

Typically in a multi-field form I'd like to be able to press the "next"-button on the keyboard to proceed to next field, until I reach the last field, then the next-button would change to "send" or "submit". Is there a convenient way to handle that with redux-form, without resorting to ref's and getRenderedComponent() calls? (Also, ref's doesn't work with functional components either). Seems like it would be a rather common use case?

bjrn avatar Feb 20 '17 21:02 bjrn

can confirm had same issue and raising height of TextInput solves...

roycedot avatar May 22 '19 21:05 roycedot