title: Render text box with transparent background on top of image in React Native iOS
body: <p>I'm trying to render a block with white text on top of an image in my testing of React Native. But instead i get a black block on top of my image with white text in it. Not what I had expected. How do you render a text block with transparent background?</p>
  
  <p><strong>Current result</strong></p>
  
  <p><img src="https://i.stack.imgur.com/mDp9s.png" alt="enter image description here"></p>
  
  <p><strong>Render function</strong></p>
  
  <pre><code>render: function(){
    return (
      &lt;View style={styles.container}&gt;
        &lt;Image 
          style={styles.backdrop} 
          source={{uri: 'https://unsplash.com/photos/JWiMShWiF14/download'}}&gt;
            &lt;Text style={styles.headline}&gt;Headline&lt;/Text&gt;
        &lt;/Image&gt;
      &lt;/View&gt;
    );
  )
  </code></pre>
  
  <p><strong>Stylesheet function</strong></p>
  
  <pre><code>var styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'flex-start',
      alignItems: 'center',
      backgroundColor: '#000000',
      width: 320
    },
    backdrop: {
      paddingTop: 60,
      width: 320,
      height: 120
    },
    headline: {
      fontSize: 20,
      textAlign: 'center',
      backgroundColor: 'rgba(0,0,0,0)',
      color: 'white'
    }
  });
  </code></pre>