Screen inside Stack.Navigator not visible in React-Native

I am new to React-Native, i am trying to use Navigation for 2 screens, when i add my LoginScreen & RegisterScreen inside Stack.Navigator, my screens are not visible, it shows blank screen, if i add LoginScreen outside Stack.navigator section, the LoginScreen looks fine but obviously i am not able to navigate to registerScreen, can anyone help in that?

import 'react-native-gesture-handler'
import React from 'react';
import {View, Text, StatusBar } from 'react-native';
import LoginScreen from './src/screens/LoginScreen';
import RegisterScreen from './src/screens/RegisterScreen';
import { Colors } from './src/utils/Colors'
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';

const Stack = createStackNavigator();
const App = () => {
  return (
    <View>
    <NavigationContainer>
      <StatusBar backgroundColor={Colors.white} barStyle='dark-content'/>
      <Stack.Navigator initialRouteName="LoginScreen" screenOptions={{headerShown: false}}>
        <Stack.Screen name="LoginScreen" component={LoginScreen} />
        <Stack.Screen name="RegisterScreen" component={RegisterScreen}/>
      </Stack.Navigator>
      
      </NavigationContainer>
      </View>
  );
  
}

export default App;
`

When i add LoginScreen outside Stack.Navigator, the screen works fine.

import 'react-native-gesture-handler'
import React from 'react';
import {View, Text, StatusBar } from 'react-native';
import LoginScreen from './src/screens/LoginScreen';
import RegisterScreen from './src/screens/RegisterScreen';
import { Colors } from './src/utils/Colors'
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';

const Stack = createStackNavigator();
const App = () => {
  return (
    <View>
    <NavigationContainer>
      <StatusBar backgroundColor={Colors.white} barStyle='dark-content'/>
      <Stack.Navigator initialRouteName="LoginScreen" screenOptions={{headerShown: false}}>
        <Stack.Screen name="LoginScreen" component={LoginScreen} />
        <Stack.Screen name="RegisterScreen" component={RegisterScreen}/>
      </Stack.Navigator>
      <LoginScreen/>
      </NavigationContainer>
      </View>
  );
  
}

export default App;`

Move navigation container out of view