title: Space between components in React Native styling
body: <p><a href="https://i.stack.imgur.com/Mr8uX.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Mr8uX.png" alt="enter image description here"></a></p>
  
  <p>I have 6 <code>View</code> components (shown in the picture) , I want to have space between all 6 <code>View</code> components. </p>
  
  <p>My code:</p>
  
  <pre><code>&lt;View style={{flexDirection:'column',flex:6}}&gt;
              &lt;View style={{flex:2,flexDirection:"row",justifyContent:'space-between'}}&gt;
                  &lt;View style={{backgroundColor:'red',flex:1}}&gt;
                  &lt;/View&gt;
                  &lt;View style={{backgroundColor:'blue',flex:1}}&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
  
  
              &lt;View style={{flex:2,flexDirection:"row",justifyContent:'space-between'}}&gt;
                  &lt;View style={{backgroundColor:'white',flex:1}}&gt;
                  &lt;/View&gt;
                  &lt;View style={{backgroundColor:'black',flex:1}}&gt;
                  &lt;/View&gt;
  
              &lt;/View&gt;
  
              &lt;View style={{flex:2,flexDirection:"row",justifyContent:'space-between'}}&gt;
                  &lt;View style={{backgroundColor:'gray',flex:1}}&gt;
                  &lt;/View&gt;
                  &lt;View style={{backgroundColor:'yellow',flex:1}}&gt;
                  &lt;/View&gt;
  
              &lt;/View&gt;
  
  
   &lt;/View&gt;
  </code></pre>