Updated 1 May 2023
Flutter is on pace in gathering more and more userbase every day. With its increasing popularity, push notification is a feature that is a must-have so that the app can be made more interactive.
You may also check our flutter app development services
To add a push notification feature to the flutter app, Google has provided a powerful platform that is Firebase. With Firebase Cloud Messaging we can enable push notification feature for iOS and Android app at the same time.
Let’s start with the code-based implementation.
At first, we will need to add firebase_messaging package to our pubspec.yaml file.
1 2 |
dependencies: firebase_messaging: ^7.0.3 |
Now we will need to add some boilerplate code to enable push notification in the Android app.
Add the google-services.json
file downloaded from the firebase project and place it inside android/app
. Assuming you are familiar with thegoogle-services.json
.
Then, make sure to add to your root-level build.gradle file:
1 2 3 4 5 6 7 |
buildscript { // ... dependencies { // ... classpath 'com.google.gms:google-services:4.3.3' } } |
Then, in your module-level Gradle file (usually the app/build.gradle), add the ‘apply plugin’ line at the bottom of the file to enable the Gradle plugin:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
apply plugin: 'com.android.application' android { // ... } dependencies { // ... implementation 'com.google.firebase:firebase-core:9.6.1' } // ADD THIS AT THE BOTTOM apply plugin: 'com.google.gms.google-services' |
If want to be notified in your app (via onResume
and onLaunch
, see below) when the user clicks on a notification in the system tray include the following intent-filter
within the <activity>
tag of your android/app/src/main/AndroidManifest.xml
:
1 2 3 4 |
<intent-filter> <action android:name="FLUTTER_NOTIFICATION_CLICK" /> <category android:name="android.intent.category.DEFAULT" /> </intent-filter> |
In this way, we can start receiving notifications in our Flutter app. In the upcoming blog, we will see how to handle background notifications.
If you have more details or questions, you can reply to the received confirmation email.
Back to Home
2 comments
It’s nice to know this post was helpful to you.