Post

플러터 앱 아이콘 & 스플래시 이미지 설정하기

앱 아이콘 적용하기

flutter_launcher_icons 라이브러리를 추가한다.

1
flutter pub add flutter_launcher_icons --dev

pubspec.yaml 파일에 아래 코드를 추가한다.

1
2
3
4
5
flutter_launcher_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"
  min_sdk_android: 21 # android min sdk min:16, default 21

image_path에 원하는 스플래시 이미지 경로를 작성한다.

스플래시 이미지 사이즈는 최소 1024x1024 픽셀로 하며 용량은 1024KB 이하로 한다.

디바이스에 따라 다르게 설정도 가능하다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
flutter_launcher_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"
  min_sdk_android: 21 # android min sdk min:16, default 21
  web:
    generate: true
    image_path: "path/to/image.png"
    background_color: "#hexcode"
    theme_color: "#hexcode"
  windows:
    generate: true
    image_path: "path/to/image.png"
    icon_size: 48 # min:48, max:256, default: 48
  macos:
    generate: true
    image_path: "path/to/image.png"

안드로이드 적용을 위해서 android/app/src/main/res/AndroidManifest.xml 파일에서 android:icon을 @mipmap/launcher_icon로 수정해준다.

1
2
3
4
<application
    android:label="close_up"
    android:name="${applicationName}"
    android:icon="@mipmap/launcher_icon">

터미널에 아래 코드를 실행한 후 앱을 재실행하면 앱 아이콘이 적용된다.

1
flutter pub run flutter_launcher_icons

스플래시 적용하기

기본적으로 flutter_launcher_icons를 설정하면 스플래시도 앱 아이콘으로 변경된다.

스플래시를 앱 아이콘과 다르게 하고 싶으면 flutter_native_splash 속성 설정이 필요하다.

flutter_native_splash 라이브러리를 추가한다.

1
flutter pub add flutter_native_splash --dev

pubspec.yaml 파일에 아래 코드를 추가한다.

1
2
3
4
5
6
flutter_native_splash:
  color: "#FFFFFF"
  image: assets/splash.png
  fullscreen: true
  android_12:
    image: "assets/images/splash.png"

image에 원하는 스플래시 이미지 경로를 작성한다.

안드로이드 12 버전 적용을 위해 android_12:에도 이미지 경로를 작성해주어야 한다.

터미널에 아래 코드를 실행한 후 앱을 재실행하면 스플래시가 적용된다.

1
flutter pub run flutter_native_splash:create

참고사이트

flutter_launcher_icons 0.13.1
flutter_native_splash 2.3.3
[Flutter] 앱 아이콘 변경
[Flutter] 스플래시 스크린

This post is licensed under CC BY 4.0 by the author.