Search code examples
reactjsreact-nativeexposcrollview

React Native Scrollview error: Half the page is a Scrollview but the other half is a blank page

I have an issue with Scrollview: when I add it to my project, the page that I got is split in half, and I have the scrollview with my elements on the upper half and nothing below. I'm using expo(not sure if it is an issue here) Here is what I added:

<View>
<ScrollView style={{ flex: 1 }} contentContainerStyle={{ flexGrow: 1 }}>

Then I had my images, text and video. Can someone help me? I didn't find a similar issue on the web.

Solution

  • Try adding flex:1 to the parent view like

    <View style={{flex:1}}> 
   <ScrollView style={{ flex: 1 }} contentContainerStyle={{ flexGrow: 1 }}>
          ....
   </ScrollView>
</View>