FCM (Firebase Cloud Messaging) is one of the coolest features in the Firebase ANE collection because it gives you the power to reach out to your users easily to let them know about your app’s latest news. In our former blog we talked about how you can send FCM messages from your server by simulating that with a software which you could install on your computer and send FCM messages. In this post however, I am going to tell you how you can send notifications with customized icons and sounds using our Firebase FCM AIR Native Extension. I am going to presume that you have already read our other blog or you are familiar with how you can send FCM from your server.
Download and install the ANELAB software then open the “Resource Manager” window. You will use this software to inject icons and sound files you’d like to use with the FCM ANE.
Updating resources inside ANEs is only good for the Android side of your project. Firebase for iOS does not support custom icons. FCM does support custom sounds on iOS though but again you won’t need the RMT for it. Scroll down the page to learn how you can set custom sounds for the iOS side of your app.
Drag the firebaseMessaging.ane into it.
Your custom icons must be inside the drawable folder. To do that, simply click on the (+) sign to create a new folder. Then right click on the newly created folder and rename it to “drawable”. Now select this folder and drag/drop all your custom icons into it.
Make sure you are naming your resources as unique as possible because other ANEs you are using in your project might have a similar resources! You certainly don’t want to make things complicated by overriding the resources.
When you are done with adding all your custom icons, create a new resource folder again but this time rename the folder to “raw”. Firebase expects sound files for FCM to be present inside the raw folder.
When you’re done, click the “Package New ANE” button and save your new ANE. From now on, you must use this new ANE in your project.
Notice that we have included “icon”:”myicon” and “sound”:”mysound” without any file extension. When the FCM arrives to your device, you will see that your icon is shown with the tint color specified with “color”: “#FF9900”.
Managing the Sound
You may use .mp3 .ogg or .wav files for the Android side but you must address them without the file exception. On the iOS side however, the first thing you should know is that you need to convert your audio files to .caf format and then package the .caf files in your AIR app (NOT inside the ANE). You need to place the .caf files at the root of your project accessible from File.applicationDirectory . When you do that, you can easily send FCM messages, targeting your custom sound files. unlike the Android side, you must include the file extension in your FCM message: mysound.caf
Starting Android 8+ notifications won’t show unless you have created NotificationChannels in your app. Creating a notification channel is easy and we have sample codes for it in our FCM, OneSignal and LocalNotification ANEs. When you create NotificationChannels, you must pass the channel ID inside your FCM message.
Custom icon & sound for FCM AIR Native Extension
FCM (Firebase Cloud Messaging) is one of the coolest features in the Firebase ANE collection because it gives you the power to reach out to your users easily to let them know about your app’s latest news. In our former blog we talked about how you can send FCM messages from your server by simulating that with a software which you could install on your computer and send FCM messages. In this post however, I am going to tell you how you can send notifications with customized icons and sounds using our Firebase FCM AIR Native Extension. I am going to presume that you have already read our other blog or you are familiar with how you can send FCM from your server.
Inject your resources into firebaseMessaging.ane
Download and install the ANELAB software then open the “Resource Manager” window. You will use this software to inject icons and sound files you’d like to use with the FCM ANE.
Drag the firebaseMessaging.ane into it.
Your custom icons must be inside the drawable folder. To do that, simply click on the (+) sign to create a new folder. Then right click on the newly created folder and rename it to “drawable”. Now select this folder and drag/drop all your custom icons into it.
When you are done with adding all your custom icons, create a new resource folder again but this time rename the folder to “raw”. Firebase expects sound files for FCM to be present inside the raw folder.
When you’re done, click the “Package New ANE” button and save your new ANE. From now on, you must use this new ANE in your project.
Send FCM while using your resources
Now, send an FCM message like below.
{ "notification": { "title": "FCM-MIX", "text": "Your Text", "icon": "myicon", "sound": "mysound", "badge": "5", "color": "#FF9900", "click_action": "MY_INTENT" }, "data": { "key": "value" }, "priority" : "high", "registration_ids" : [ "fEdNHsoBxrg:APA91bEXwfb5Z7JRjYNC_b", "dEZAP2CJVCI:APA91bF4rPPGPTlvHlF_wq" ] }Notice that we have included “icon”:”myicon” and “sound”:”mysound” without any file extension. When the FCM arrives to your device, you will see that your icon is shown with the tint color specified with “color”: “#FF9900”.
Managing the Sound
You may use .mp3 .ogg or .wav files for the Android side but you must address them without the file exception. On the iOS side however, the first thing you should know is that you need to convert your audio files to .caf format and then package the .caf files in your AIR app (NOT inside the ANE). You need to place the .caf files at the root of your project accessible from File.applicationDirectory . When you do that, you can easily send FCM messages, targeting your custom sound files. unlike the Android side, you must include the file extension in your FCM message: mysound.caf
Starting Android 8+ notifications won’t show unless you have created NotificationChannels in your app. Creating a notification channel is easy and we have sample codes for it in our FCM, OneSignal and LocalNotification ANEs. When you create NotificationChannels, you must pass the channel ID inside your FCM message.
To know how to convert audio files to caf format, you need a Mac device. Read here for more information: http://stackoverflow.com/a/255151/247658
Enjoy building AIR Apps 🙂
MyFlashLabs Team
Share this:
Related