Flutter. How to Create Your Own Native Notification in Android
Here we will be talking about Flutter plugging creation, Flutter → Android → Flutter communication, and after that, we will be creating our own native Android notification with attaching it to our Flutter project.
What will be covered in this article:
- Creating Flutter Plugin project
- How Flutter plugin works
- The Big picture
- Implementing native notification
Result:
Creating Flutter Plugin project
In this chapter, I will guide you through all steps you will be needed to take while creating your Flutter Plugin project.
First, open your Android Studio IDE and select Create New Flutter Project:
Next, select Flutter Plugin and click Next:
Next, type your Project name, Flutteer SDK path, Project location, and Description. If you are just creating this project for demo purposes — name and description are irrelevant:
Same for the package name. Don’t worry, select any name you like:
Wait few moments…
After creating Flutter Plugin project → open /android folder in Android studio. This /android folder is our native part, here we will be telling Android what we would like to do (show notification, in our case)
This is how it will look like in your IDE. FlutterNotificationPlugin file (name depends on a package and project name you used while creating a new project) is the entry point of the Android native part. We will return to this project soon enough…
Return to the Flutter plugin project and run /example/lib/main.dart file. Here we will be testing the work of our Flutter plugin.
After running the “example” app you will see the result in the Android emulator:
How Flutter plugin works
Before we will dive deep into the “own plugging creation”, let’s take a look at how this simple example works. You could think that it is too complex, but believe me, you just need to see the whole Flutter → Android → Flutter communication path and you will get it.
First questions:
- How does the “example” flutter project know what it should do?
- Where is the “connection” between the “example” project and our local Flutter plugin?
The answer lies in is in the pubspec.yaml file. It is done exactly the same way as when you define new Flutter dependency, but in our case, it is not yet published as the public https://pub.dev/ library → it is our local library:
Path variable is pointing to our local plugin:
The Big picture
Before we will take a look at the code fragments let’s take a look at a Flutter app and hosts communication diagram:
As you can see the main connector between Flutter and Android/iOS is the MethodChannel, let’s take a look at it in code.
First, “example” Flutter project invokes FlutterNotificationPlugin.platformVersion method and experts a platformVersion result:
You can find this FlutterNotificationPlugin.platformVersion method in the /lib/<name>.dart file:
What is getPlatformVersion? Where I can find it?
Now, let’s return to our previously open Android project:
As you probably noticed we have a function name-checking:
if(call.method == "getPlatformVersion")
You can pass as many functions with any names as you like. Let’s make a few changes and after that, you will get the main idea behind the Flutter plugins and we will create our first Android native notification with the use of Flutter.
At first, we will create a new function with the name getHello .
Inside our getHello function call, we will invoke helloWorld function that will be used in our Android project. As you can see we are passing two arguments to the helloWorld function one and two (very useful names I agree 😉)
After that, we will modify our if-else block in our Android project:
And our final step will be changing the function invoke name in the Flutter “example” project:
⚠️ NOTE: After making changes in the Android project you will need to stop and re-run your project. Flutter’s “hot-reload” will not work.
Now we can check what we’ve accomplished so far:
Now you understand how to create your own Flutter plugging, so we can go further and create our own Android notifications.
If you would like to know more about creating Flutter packages/plugins you can check here:
Implementing native notification
We will be creating a basic notification from this example. If you would like to know more you can check here:
Let’s begin…
At first, we will create a new function showBasicNotification in our Flutter plugin that we’ll be using in future:
Next, we will need to update out Flutter “example” project’s main.dart file:
Icon is required by the Android’s specification. It will be show at the top of our notification. We are just saying that for the notification pop-up icon Android should use the ic_launcher file that is located in the /mipmap folders in the resources (“/example” project).
And now the most difficult part, because if you are not related to the Android native development, code for a simple notification is not so simple.
Open /android module in the Android Studio IDE:
And add new else if block to the onMethodCall .
⚠️ context private variable can be added and initialied like this:
The main functionality of our Android notification lies lies with the NotificationCompat builder…
And to make it work we needed to create a notification channel, check if we need a notification_id (that depends on Android SDK), etc → this is required configiguration without which this small builder block would not work.
And now we can check what we’ve accomplished :
Whole Adroid plugging gist:
You can use this Git repo as a reference, be my guest:
