androidreact-nativereact-native-flatlistreact-native-textinput

React Native TextInput auto Blur and hides keyboard

I'm building a generic form that fetches data from the server. Like a google forms clone. In the FlatList when I scroll to the bottom the last TextInput element automatically hides the keyboard.

enter image description here

      <TextInput
        onBlur={() => console.log('I blur')}
        placeholder={title}
        onChangeText={text => setValue(text))}
        keyboardType="decimal-pad"
      />

I tried using KeyboardAvoiding and also KeyboardAwareFlatList but the problem persists.

Solution

  • Try to set removeClippedSubviews to false on the FlatList.

    <FlatList
    removeClippedSubviews={false}
/>

    https://reactnative.dev/docs/view#removeclippedsubviews

    It worked for my similar use case.