title: How to justify (left, right, center) each child independently?
body: <p>In react native I have:</p>
  
  <pre><code>&lt;View style={styles.navBar}&gt;
    &lt;Text&gt;{'&lt;'}&lt;/Text&gt;
      &lt;Text style={styles.navBarTitle}&gt;
        Fitness &amp; Nutrition Tracking
      &lt;/Text&gt;
    &lt;Image source={icon} style={styles.icon}/&gt;
  &lt;/View&gt;
  </code></pre>
  
  <p>with these styles:</p>
  
  <pre><code>{
      navBar: {
          height: 60,
          flexDirection: 'row',
          justifyContent: 'space-between',
          alignItems: 'center',
      },
      navBarTitle: {
          textAlign: 'center',
      },
      icon: {
          height: 60,
          resizeMode: 'contain',
      },
  }
  </code></pre>
  
  <p>This is the effect I get:</p>
  
  <p><a href="https://i.stack.imgur.com/4ACbn.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/4ACbn.jpg" alt="undesired"></a></p>
  
  <p>This is the effect I want:</p>
  
  <p><a href="https://i.stack.imgur.com/UkBH9.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/UkBH9.jpg" alt="desired"></a></p>
  
  <p>In the first example, the spacing between items is equal.</p>
  
  <p>In the second example, each item is justified differently. The first item is left-justified. The second item is center-justified. The third, right-justified.</p>
  
  <p><a href="https://stackoverflow.com/questions/23621650/how-to-justify-a-single-flexbox-item-override-justify-content">This question</a> is similar, but it looks like react native does not support <code>margin: 'auto'</code>. Furthermore, the other answers only work if you only care about left and right justification, but no one really addresses center justification without auto margin.</p>
  
  <p>I am trying to make a navigation bar in react native. The vanilla ios version looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/SEFcN.png" rel="noreferrer"><img src="https://i.stack.imgur.com/SEFcN.png" alt="ios"></a><br>
  <sub>(source: <a href="https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/Art/nav_bar_iphone_2x.png" rel="noreferrer">apple.com</a>)</sub>  </p>
  
  <p>How do I do something similar? I'm mainly concerned with centering.</p>