Full screen background image in React Native app
<p>I'm trying to set a full background image on my login view.</p>

<p>I found that question here in Stackoverflow: <a href="https://stackoverflow.com/questions/29322973/whats-the-best-way-to-add-a-full-screen-background-image-in-react-native/">What's the best way to add a full screen background image in React Native</a></p>

<p>So I did it like there, but it didn't work:</p>

<p><a href="https://i.stack.imgur.com/xfmhQ.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/xfmhQ.jpg" alt="enter image description here"></a></p>

<pre><code>var login = React.createClass({
  render: function() {
    return (
      &lt;View style={ styles.container }&gt;
        &lt;Image source={require('../images/login_background.png')} style={styles.backgroundImage} /&gt;
        &lt;View style={ styles.loginForm }&gt;
          &lt;Text&gt;TEST&lt;/Text&gt;
        &lt;/View&gt;
      &lt;/View&gt;
    );
  }
});

var styles = StyleSheet.create({
  container: {
    flex: 1,
  },

  backgroundImage: {
    flex: 1,
    resizeMode: 'cover', // or 'stretch'
  },

  loginForm: {
  },
});
</code></pre>

<p>I don't know what I'm doing wrong. Any help would be appreciated.</p>

<p><strong>Edit:</strong> Here is the app, in case you guys want to take it a look -> <a href="https://rnplay.org/apps/cm295Q" rel="noreferrer">Full size background image example on rnplay.org</a>. I don't know how to do it editable :/</p>

<p>Thanks :)</p>