Flutter에서 Native Splash 화면 만들기

Flutter에서 Splash 화면 만들기: Native 설정과 Server Check 로직 추가 방법

Flutter에서 splash 화면을 만드는 방법은 크게 두 가지입니다. 하나는 splash 전용 페이지를 생성하는 것이고, 다른 하나는 native 설정을 하는 것입니다. 전자의 경우 시작 시 흰 화면이 잠깐 나타났다가 사라지므로 후자가 보다 공식적인 방법으로 여겨집니다.

특히, Flutter 프로젝트를 생성하면 안드로이드 native에 splash 이미지를 넣을 파일을 자동으로 생성해줍니다.

적용방법은 인터넷에 많이 나와있으니 여기서 참고할 수 있습니다.

이번 글에서는 native로 만든 splash에서 server check 로직과 remote config 관련 작업 방법을 설명합니다.

Splash 화면에서 서버 상태 체크 및 필요 정보 받아오기

Splash 화면에서 서버의 상태를 체크하고 필요한 정보들을 받아오는 등 앱이 시작되기 전에 필요한 작업들을 실행합니다. 그런데 Flutter에서 native 각각에 Splash 설정 후 어디서 control logic 작성해야 할 지 모르겠다 생각하셨나요?

만약 각 native에서 작업한다면 통신 모듈 설정 및 결과 통합 등의 문제가 생깁니다. 따라서 Flutter 에서 컨트롤 할 수 있는 방법으로 해결할 수 있으면 좋겠다고 생각했습니다.

Splash 화면 Control Logic 구현하기

우리의 해결책은 의외로 간단합니다.
보통 Flutter 앱을 시작할 때 아래와 같이 합니다:

Flutter 시작 코드 예시 1

Flutter 시작 코드 예시 2

여기서 runApp 전에 필요한 로직을 작성하면 됩니다.

runApp 전 필요한 로직 작성 예시

이 방법으로 더욱 매력적인 스플래시 화면을 만들어보세요!