title: React Native Routes Not Displayed With react-native-router-flux
body: <p>I'm new to using react native for app development. In my App.js, I have imported Routes.js, in which I have used react-native-router-flux.Somehow, Routes is not displayed. However, when I remove alignItems:'center', the background color disappears but routes is actually displayed. How do I make it so that the app will have both the routes and the background color?</p>
  
  <pre><code>import React, {useState} from 'react';
  import {StyleSheet, View, StatusBar} from 'react-native';
  
  import Routes from './src/Routes';
  const App = ()=&gt; {
  
    return (
      &lt;View style={styles.container}&gt;
        &lt;StatusBar
          backgroundColor="#1c313a"
          barStyle="light-content"
        /&gt;
        &lt;Routes /&gt;
      &lt;/View&gt;
  
  
    );
  
  };
  
  const styles = StyleSheet.create({
    container:{
      backgroundColor:'#455a64',
      flex:1,
      alignItems:'center',
      justifyContent:'center',
    }
  });
  
  
  export default App;
  </code></pre>
  
  <p>Routes.js:</p>
  
  <pre><code>import React, {useState} from 'react';
  import {Router, Stack, Scene} from 'react-native-router-flux';
  
  import Login from './pages/Login';
  import Signup from './pages/Signup';
  const Routes = ()=&gt; {
      return(
          &lt;Router&gt;
              &lt;Stack key="root"&gt;
                  &lt;Scene key="login" component={Login} title="Login" initial={true}/&gt;
                  &lt;Scene key="register" component={Signup} title="Register" /&gt;
              &lt;/Stack&gt;
          &lt;/Router&gt;
      );
  
  };
  
  
  export default Routes;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/B5W8p.png" rel="nofollow noreferrer">With alignItems:'center'</a></p>
  
  <p><a href="https://i.stack.imgur.com/U7sKR.png" rel="nofollow noreferrer">With alignItems:'center' the background color disappears and the text cannot be seen because of the background color</a></p>