[Flutter] android adaptive icon 크게 적용되는 현상 해결하기

안드로이드는 적응형 아이콘을 통해서 기기마다 다른 마스크를 제공한다.

안드로이드 가이드에 따르면, 포그라운드와 백그라운드용 이미지에 대한 규격이 나와있다.

---

flutter에서 적응형 아이콘을 쉽게 적용하기 위해서는 flutter_launcher_icons패키지를 사용하면 되는데 문제가 조금 있다.

https://github.com/fluttercommunity/flutter_launcher_icons/issues/96

위의 링크는 flutter_launcher_icons를 통해 앱 아이콘을 적용했을 때의 문제점에 대한 이슈이다.
(원하는 모습대로 안나오고 이미지가 확대되어 나온다.)

---

이럴 때는android/.../res/mipmap-anydpi-v26/ic_launcher.xml파일을 수정하여 포그라운드 이미지에 패딩을 부여할 수 있다고 한다.

수정 전

<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
  <background android:drawable="@color/ic_launcher_background"/>
  <foreground android:drawable="@color/ic_launcher_foreground"/>
</adaptive-icon>

수정 후

<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
  <background android:drawable="@color/ic_launcher_background"/>
  <foreground>
    <inset
      android:drawable="@drawable/ic_launcher_foreground"
      android:inset="16%" />
  </foreground>
</adaptive-icon>

"16%"만큼씩 패딩을 부여하여 아이콘이 작아지게 만들어 이 이슈를 해결할 수 있다.
모든 상황에서 16%가 정답이아니라 이미지 사이즈에 따라 다른 값을 입력해주어야한다.
테스트를 통해 알맞은 값을 적용하면 된다.

---

문제점 및 개선

아이콘을 변경할 때마다 flutter_launcer_icons를 실행할텐데, 그때마다 이 값이 초기화되어 귀찮은 상황이 발생할 수 있다.

이러한 상황이 자주 발생하진 않겠지만.. 이런 상황을 해결하기 위한 버전을 만들었다.

  flutter_launcher_icons: 
    git: https://github.com/LOCKEDFILE/flutter_launcher_icons.git

flutter_launcher_icons:
  android: true
  ios: true
  remove_alpha_ios: true
  image_path: "assets/app_icon/icon.png"
  adaptive_icon_background: "assets/app_icon/adaptive_icon_background.png"
  adaptive_icon_foreground: "assets/app_icon/adaptive_icon_foreground.png"
  adaptive_icon_foreground_inset: 16  # default value is 16