Androidのプッシュ通知アイコンの設定 -Cordova
Androidのプッシュ通知(Firebase Cloud Messaging)のアイコン設定でググってもうまくいかないところがあったのでまとめます。
本記事ではcordovaの設定ファイルconfig.xmlにアイコン画像とカラーの指定を行うことで、Androidの設定ファイルであるAndroidManifestを書き換えていきます。
結果としてAndroidビルドの実行で下のようなAndroidManifest.xmlが生成できていればOKです。
<manifest>
<application>
<meta-data
android:name="com.google.firebase.messaging.default_notification_icon"
android:resource="@drawable/fcm_push_icon" />
<meta-data
android:name="com.google.firebase.messaging.default_notification_color"
android:resource="@color/colorAccent" />
アイコン画像のフォルダ構成はfirebassのAndroidプロジェクトが参考になります。
firebase quickstart-android -GitHub
本記事ではこのようなAndroidプロジェクトを生成することを目指しています。動作がうまくいかないときは、生成したプロジェクトと上のプロジェクトを比較してみてください。
プッシュ通知用のアイコンの設定
プッシュ通知用のアイコンを設定しておくと通知が来た際にステータスバーにアイコンとして表示します。画像にアルファチャネルがないと真っ白のアイコンになってしまいます。
アイコンの見え方について下の記事が参考になりました。
Firebase Notificationsのアイコンについて纏めてみた -Qiita
ldpi〜xxxhdpiの各サイズのアイコン画像を用意します。
私は1024×1024の画像を用意しionic cordova resourcesを使って生成しました。
各サイズのアイコン画像を配置し、res配下にコピーされるようにconfig.xml設定します。
<platform name="android">
<resource-file src="resources/android/fcm_push_icon/drawable-ldpi-icon.png" target="app/src/main/res/drawable-ldpi/fcm_push_icon.png" />
<resource-file src="resources/android/fcm_push_icon/drawable-mdpi-icon.png" target="app/src/main/res/drawable-mdpi/fcm_push_icon.png" />
<resource-file src="resources/android/fcm_push_icon/drawable-hdpi-icon.png" target="app/src/main/res/drawable-hdpi/fcm_push_icon.png" />
<resource-file src="resources/android/fcm_push_icon/drawable-xhdpi-icon.png" target="app/src/main/res/drawable-xhdpi/fcm_push_icon.png" />
<resource-file src="resources/android/fcm_push_icon/drawable-xxhdpi-icon.png" target="app/src/main/res/drawable-xxhdpi/fcm_push_icon.png" />
<resource-file src="resources/android/fcm_push_icon/drawable-xxxhdpi-icon.png" target="app/src/main/res/drawable-xxxhdpi/fcm_push_icon.png" />
</platform>
次に通知アイコンを参照するように設定する記述を行います。
android:resource部分にアイコン画像の拡張子を除いたファイル名と一致させます。
<platform name="android">
<config-file parent="/manifest/application" target="AndroidManifest.xml">
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/fcm_push_icon" />
</config-file>
</platform>
背景カラー設定
notification_colorを設定します。
カラーコードを記述するcolors.xmlの場所を指定します。
<config-file parent="/manifest/application" target="AndroidManifest.xml">
<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/primary" />
</config-file>
colors.xmlが生成されない場合
ビルドでcolors.xmlが生成されない場合はファイルを作成してAndroidプロジェクトにコピーするように設定します。
<platform name="android">
...
<resource-file src="resources/android/res/values/colors.xml" target="app/src/main/res/values/colors.xml"/>
</platform>
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="primary">#FFFFFF00</color>
<color name="primary_dark">#FF220022</color>
<color name="accent">#FF00FFFF</color>
</resources>
ちょっとハマったこと
default_notification_colorが重複作成されてビルドエラーになることがありました。
cordova-plugin-firebasexがカラー関連の定義を行なっているようで、重複してしまっていました。
カラー定義の記述を削除してプラグインオプションを変更することでカラー定義を行なっています。
"cordova-plugin-firebasex": {
"ANDROID_ICON_ACCENT": "#7ECB5C"
}
参考にしたもの
Author And Source
この問題について(Androidのプッシュ通知アイコンの設定 -Cordova), 我々は、より多くの情報をここで見つけました https://qiita.com/yunity29/items/5c8a1f442b2f372a526d著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .