React Native Justifying Views Vertically Without Me Setting It To
Solution 1:
Children of a flexbox
share the parent's flex area in proportions. You have set Logo
to flex:3
, Form
to flex:7
, and SignupSection
to flex:1
. Thus, 7 + 3 + 1 = 11, therefore, Logo
takes 3/11, Form
takes 7/11, and SignupSection
takes 1/11 of the parent's flex area in the specified direction.
Within Form
, you've set UserInput
to flex: 1
. So the children (UserInput
) of Form
will equally share (and fill up) the flex area (7/11) that Form
has acquired from its parent. This is why you see the space between UserInput
s. To understand this better, try replacing UserInput
s with simple View
s with different background colors and you'll see what's going on.
Answer : Reduce flex
on Form
and apply margins if required.
EDIT
Alternatively, you can set fixed height
(in case of flexDirection:'column'
of parent) or width
(in case of flexDirection:'row'
of parent) to the children.
Hope this helps.
Post a Comment for "React Native Justifying Views Vertically Without Me Setting It To"