React Native – fill remaining height of a View

by 
<ScrollView contentContainerStyle={{flexGrow: 1}}>
    <View></View>
    <View><LinearGradient></LinearGradient></View>
</ScrollView>

How do i make the second View or the LinearGradient to fill the remaining height. I don’t have specific height set on the first View. I’ve tried flex: 1 for the second view but it still doesn’t work.

Adding flex to your second view works:

 <ScrollView contentContainerStyle={{ flexGrow: 1 }}>
    <View></View>
    <View style={{ flex: 1, backgroundColor: "red" }}>{Other content here}</View>
  </ScrollView>

Leave a Comment