'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 1:[1]

Try adding flex:1 to the parent view like

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

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nooruddin Lakhani