After loading the Expo go project it becomes a white screen. (expo-splash-screen)

47 Views Asked by At

After loading the expo-splash-screen, a white screen appears.

App.js

import React, { useCallback, useEffect } from 'react';
import * as Font from 'expo-font';
import { useState } from 'react';
import * as SplashScreen from 'expo-splash-screen';
import MainLogin from './components/navigate';
import { View } from 'react-native';


SplashScreen.preventAutoHideAsync();




export default function App() {
  const [appIsReady, setAppIsReady] = useState(false);

  useEffect(() => {
    async function prepare() {
      try {
        await Font.loadAsync ({
          'CG-Bold': require('./assets/fonts/CormorantGaramond-Bold.ttf')
        });
        await new Promise(resolve => setTimeout(resolve, 2000));
        setAppIsReady(true);
      } catch (e) {
        console.warn(e);
      } finally {
        setAppIsReady(true);
      }
    }

    prepare();
  }, []);

  const onLayoutRootView = useCallback(async () =>{
    if (appIsReady) {
      await SplashScreen.hideAsync();
    }
  }, [appIsReady]);

  if (!appIsReady) {
    return null;
  }

  return(
    <View onLayout={onLayoutRootView}>
    <MainLogin />
    </View>
  );
  
}

I tried to do via if else there was progress in expo go but when I built APK in it was also white screen after loading. I've only tried to do. enter image description here

1

There are 1 best solutions below

0
On

I was solved by chat-GPT, it turns out I needed to add "style={{ flex: 1 }}" to the component so that would display correctly