CODEWITHSUNDEEP
androidreact-nativereact-native-scrollview
Karan
Karan

Reputation: 181

Scrollview cannot scroll to bottom with keyboard in react native

Scrollview scrolls to the bottom normally but when I touch the TextInput and the keyboard pops up, it scrolls only a very short distance and I am not able to look at the content below.

Just focus on android as of now

android:windowSoftInputMode="adjustPan"

My code:

const Welcome = ({}) => {

  return (
    <View style={{flex:1}>
      <View style={{height: RFValue(33), backgroundColor: '#B1C59B'}} />
      <Main/>
    </View>
  );
};

where the Main component contains the scrollView

      const Main = () => {
         
          return (
         <ScrollView
              keyboardShouldPersistTaps="always"
              contentContainerStyle={styles.container}>
          {CONTENT}
        </Scrollview>
        )
      }

     const styles = StyleSheet.create({
         container: {
         flexGrow: 1,
     },

Upvotes: 0

Views: 1368

Answers (2)

Apps Maven
Apps Maven

Reputation: 1410

Above Scrollview take SafeAreaView and give SafeAreaView flex:1 then your problem must be solved.

Upvotes: 1

Nooruddin Lakhani
Nooruddin Lakhani

Reputation: 6967

Try adding flex:1 in your container style like

container:{
  flex: 1,
}

Upvotes: 2

Related Questions