Flutter Splash 패키지를 통해 앱 초기화면에 스플래시 화면 띄우기

 

플러터에서는 앱을 처음 실행할때 간단하게 자신이 원하는 이미지를 보여줄 수 있는 스플래시 패키지를 지원한다.

https://pub.dev/packages/flutter_native_splash

flutter_native_splash | Flutter Package

 

사용법은 매우 간단하다

pubspec.yaml 에 패키지 추가

dependencies:
  flutter:
    sdk: flutter
    
  flutter_native_splash: ^최신버전 # 스플래시 스크린

flutter_native_splash:
  color: "#ffffff" # background color
  image: assets/img/high_five.png # 추가할 이미지 파일 경로를 추가

 

그 후 터미널에 명령어를 치면 자동으로 스플래시 이미지를 생성해주고 적용이 완료 된다.

dart run flutter_native_splash:create

 

추가적으로 나같은 경우 스플래시 이미지를 원하는 시간만큼 보여주고 싶었는데 이는

Future main() async {
  WidgetsBinding widgetsBinding = WidgetsFlutterBinding.ensureInitialized();
  FlutterNativeSplash.preserve(widgetsBinding: widgetsBinding);

  // 스플래시 화면을 보여주기 위해 5초간 대기
  await initialization();

  runApp(
    const MyApp(),
  );
}

Future initialization() async {
  await Future.delayed(const Duration(seconds: 3));
  FlutterNativeSplash.remove();
}

위와 같이 초기화할때 Duration을 주어서 해결하였다.

물론 더 나은 방법도 있겠지만 따로 스플래시의 시간을 길게 만들어주는 내장기능은 없었기에 이렇게 작성하였다.