React-native-keyboard-aware-scroll-view: Scrolling goes crazy when using nested scrollviews and calling .focus() on TextInput

[willswinson]

As the title says, I have a nested scrollview with rows of TextInputs that I'm trying to scroll to avoid the keyboard.

Imagine a structure like this. It's pseudo-code, there are more views in the structure but this is the general idea:

<KeyboardAwareScrollView>
    <Image/>
    <Text/>
    # Below this is a subcomponent, can pass onFocused event up and manually scroll to input, but it doesn't work.
    <View>
          <ScrollView>
                  <TextInput ref={input1} onSubmit={input2.focus()} />
                  <TextInput ref={input2} onSubmit={input3.focus()} />
                  <TextInput ref={input3} />
           </ScrollView
    </View>
</KeyboardAwareScrollView>

And all I'm trying to do is focus on the next TextInput in the form via refs and onSubmit as shown in the example above.

At the moment, when submitting it sometimes works, and sometimes goes berserk. It will scroll with the wrong padding, and leave the padding there even when the scrollview goes away. The padding seems to be more inaccurate the further down I scroll in the nested scrollview.

I tried passing the inputs' onFocused event up to the KeyboardAwareScrollView to try and manually scroll to it, but it acted the same.

[He1nr1chK]

Were you able to solve this? @willswinson

[willswinson]

@He1nr1chK Unfortunately I never solved this. I had to ditch this library and ditch RN's KeyboardAvoidingView and code all the scrolling offset calculations myself.