how to use the propertys of justifyContent when using flexDirection column-CodePudding

I want to use justifyContent:'space-between'with flexDirection:'column'
This my code:

<View style={{flexDirection:'column',justifyContent:'space-between'}} >
              <CheckBox
              value={isSelected}
              onValueChange={setSelection}
              />
               <CheckBox
              value={isSelected2}
              onValueChange={setSelection2}
              />
               <CheckBox
              value={isSelected3}
              onValueChange={setSelection3}
              />
    </View>

I've tried many times to put space between them but it only work when i use flexDirection:'row'

CodePudding user response：

I think you are missing most important property.

display: 'flex'

In your example like

<View style={{display: 'flex', flexDirection:'column',justifyContent:'space-between'}} >

It should work like this as you want.

CodePudding user response：

Are you sure your syntax is correct? The flex-column works with justify-content: space-between just fine.

https://codepen.io/treacych/pen/qBYBXdP