Monday, January 1, 2018

React-native programmatically scrolling multiline TextInput

Leave a Comment

I wonder how can I scroll down inside TextInput with multiline argument ? I saw the function onContentSizeChange but I don't see any option to use the inside scroll programmatically.

here is an expo snack to play with (with the current situation) https://snack.expo.io/S1Gpa3pRb

the point is I'm trying to scroll the TextInput down on a new line.

(p.s I'm working on android, I also have an autoGrow option but I want to limit it in some point (this part is easy to make) but after it reach the limit I get the same reaction as the expo shows, the TextInput doesn't scroll down.)

thanks!

1 Answers

Answers 1

We had this exact same problem where i work. We first tried to solve the scrolling problem with the keyBoardAvoidingView component:

https://facebook.github.io/react-native/docs/keyboardavoidingview.html

But that only solved part of our problem, what really fully solved it was a plugin called react-native input-scrollview:

https://github.com/baijunjie/react-native-input-scroll-view

This plugin should solve your problem. On multiline it follows the user as they type and it will automatically move them to a new line. Try out one at a time and see if any of them work.

Hope this helps in some way! :)

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment