DEV Community

sidcode
sidcode

Posted on

[Flutter] 앱 시작 로딩화면 App loading page

#flutter #developer #app #loadingpage

  1. flutter_native_splash
    https://pub.dev/packages/flutter_native_splash.

  2. 패키지 다운로드(https://pub.dev)
    Package download from (https://pub.dev)

  • flutter_native_splash 
    flutter pub add flutter_native_splash
Enter fullscreen mode Exit fullscreen mode
  1. flutter_native_splash.yaml
    • pubspec.yaml과 동일 경로에 파일 생성
    • smae path to pubspec.yaml
    • vi또는 메모장등으로 원하는 색상 이미지를 원하는대로 수정
    • "vi" or "notepad" edit what you want color and image whatever. 
fflutter_native_splash:
  color: "#009000"
  image: assets/Kaaba.png
  branding: assets/Kaaba.png
  # color_dark: "#121212"
  # image_dark: assets/Kaaba.png
  # branding_dark: assets/Kaaba.png

  android_12:
    image: assets/Kaaba.png
    icon_background_color: "#009000"
    # image_dark: assets/Kaaba.png
    # icon_background_color_dark: "#121212"

  web: false
Enter fullscreen mode Exit fullscreen mode
  1. command on prompt 
dart run flutter_native_splash:remove && dart run flutter_native_splash:create
Enter fullscreen mode Exit fullscreen mode
  1. main.dart 
Future<void> main() async {
  runApp(const WhereIsKaaba());

  # close splash screen
  FlutterNativeSplash.remove();
}
Enter fullscreen mode Exit fullscreen mode

finished!!

Top comments (0)

Read next

vivek1030 profile image

Microservice Interview Questions

vivek -

samuel_udeh profile image

Managing high traffic applications with AWS Elastic Load Balancer and Terraform

Samuel Udeh -

bcornils profile image

Unit tests so you don't lose your levitating plant

bfuller -

cryptosandy profile image

Understanding Graph Search Algorithms: DFS vs BFS

Crypto.Andy (DEV) -