[Flutter] Android에서 FCM 알림 아이콘 변경하기

구현 목표

푸시 알림 전송 시 기본적으로 앱 아이콘이 사용되는데,

이것을 알림 전용 아이콘으로 수정해서 더 깔끔하고 직관적으로 보이도록 하고 싶었다.

 

알림 아이콘 이미지 추가하기

알림 아이콘은 다음과 같이 흰색 단색 + 투명 배경 이미지만 허용된다.

 

`android/app/src/main/res/drawable/ic_stat_ic_notification.png` 경로에

생성한 아이콘 파일을 추가했다. (파일 이름은 원하는 대로 작성하면 된다.)

 

단일 파일만 추가했던 왼쪽의 경우 아이콘 테두리가 매끄럽지 않은 느낌을 준다.

간단하게 `drawble` 디렉터리에만 PNG 파일을 추가해도 되지만,

더 선명한 아이콘 이미지나, 색상을 변경하는 등 디테일한 설정을 원한다면

`drawable-mdpi`, `drawable-hdpi`, `drawable-xhdpi` 등 

기기 해상도별로 이미지 파일을 따로 준비하는 것이 좋다.

 

Android Asset Studio에서 아이콘을 등록하면 각 dpi별 이미지 파일을 자동으로 만들어준다.

이 이미지 파일들을 `android/app/src/main/res`의 각 폴더에 추가해 주면 된다.

 

AndroidManifest.xml에 기본 아이콘 등록하기

<application
    android:label="비포알리미"
    android:icon="@mipmap/ic_launcher">

    <!-- FCM 알림 기본 아이콘 설정 -->
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_icon"
        android:resource="@drawable/ic_stat_ic_notification" />

    <!-- 알림 아이콘 색상(선택사항) -->
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_color"
        android:resource="@color/notification_icon_color" />
</application>

`android\app\src\main\AndroidManifest.xml` 파일에서 기본 알림 아이콘을 설정한다.

 

<resources>
    <color name="notification_icon_color">#9EF2FF</color>
</resources>

컬러는 `android\app\src\main\res\values\colors.xml` 파일을 생성해서 따로 지정한다.

 

알림 아이콘은 상단바에서는 기본적으로 모두 회색으로 보이지만,

알림창에서 봤을 때는 흰색이라 잘 보이지가 않아서 좀 더 눈에 띄는 색상으로 변경했다.

 

flutter_local_notifications 패키지에서 아이콘 지정하기

const AndroidNotificationDetails androidDetails =
	AndroidNotificationDetails(
        'channel_id',
        'channel_name',
        channelDescription: 'channel_description',
        icon: '@drawable/ic_stat_ic_notification', // 아이콘 추가
        color: Color(0x009EF2FF), // 아이콘 색상 지정
    );

`flutter_local_notifications` 패키지를 사용하는 경우에는

`AndroidNotificationDetails`에서 알림 아이콘을 따로 지정해줘야 한다.