CODEWITHSUNDEEP
cssreactjsreact-nativeflexboxreact-native-flexbox
Robert Saunders
Robert Saunders

Reputation: 403

Vertically Stacked Views with Static and Dynamic Heights - React Native

I am trying to acheive what the image below represents with Flexbox in React Native with Views, if you have a basic example of this that would be amazing:

enter image description here

Upvotes: 0

Views: 1344

Answers (1)

Abe Clark
Abe Clark

Reputation: 166

Something like this:

<View style={{ flex: 1, flexDirection: 'column'}}>
  <View style={{ height: 70, backgroundColor: 'blue' }}>
  </View>
  <View style={{ height: 70, backgroundColor: 'green' }}>
  </View>
  <View style={{ flex: 1, backgroundColor: 'yellow' }}>
  </View>
</View>

Not sure if the blue lines are lines / padding / etc, but you should be able to add those into this shell.

Upvotes: 2

Related Questions