[React-native] Splash screen

splash screen은 로딩 페이지라고도 하는 데, 앱이 처음 시동될 때 잠깐 나오는 페이지를 말한다.

1. expo에서 splash screen의 이미지 위치

 : assets 폴더 내에 splash-icon.png 파일이 있다. 이 이미지 파일이 로딩페이지에 사용된다.

 

2. 공식 문서 

https://docs.expo.dev/versions/latest/sdk/splash-screen/

SplashScreen

 

3. 수동으로 스플래쉬 스크린을 조절하는 방법

기본적으로 자동으로 잠깐 보였다가 스플래쉬 스크린은 사라진다. 이 부분을 앱에 따라 제어하기 위해선 아래와 같은 작업 순서로 해야 한다.

1) splash screen 불러오기

import * as SplashScreen from 'expo-splash-screen';

2) splash screen 자동 감추기 기능 제거

// Keep the splash screen visible while we fetch resources
SplashScreen.preventAutoHideAsync();

3) 적절한 시기에 splash screen이 사라지도록 구현

// 일반적으로 useEffect를 사용해서 작업한다.
  useEffect( () =>{
   if(locale !== null)
    SplashScreen.hideAsync();
  },[locale]);