Background local notifications in Flutter

Sometimes user wants some essential features like the latest news updates, latest articles updates, weather condition alert, complete his/her profile update, future events update and much more in his/ her Android or iOS device without opening App and if you would like to develop this kind of Android and iOS application then this article will help you to do so. In this process, we set up background jobs that periodically check updates about the latest events or alerts.

It is a cross-platform plugin for displaying local notifications in a flutter application. It offers a bunch of features, such as scheduling when notifications should appear, periodically showing a notification (interval-based), handling when a user has tapped on a notification when the app is in the foreground, background, or terminated, specifying a custom notification sound, and much more.

Steps to Implement Background Local Notifications

Step 1: Create a new flutter application

Create a new Flutter application using the command Prompt. To create a new app, write the below command and run it.

flutter create app_name

To know more about it refer this article: Creating a Simple Application in Flutter

Step 2: Adding the Dependency

To add the dependency to the pubspec.yaml file, add image_picker as a dependency in the dependencies part of the pubspec.yaml file, as shown below:

Now run the below command in the terminal.

flutter pub get

Step 3: Importing the Dependency

Use the below line of code in the main.dart file, to import the flutter_local_notifications dependency :

import 'package:flutter/material.dart';
import 'package:flutter_local_notifications/flutter_local_notifications.dart';

Step 4: Add permissions

Now, It's time to add some required permissions, open the 'AndroidManifest.xml' file from app_name-> android -> app -> src -> main -> AndroidManifest.xml project directory structure and copy-paste following permissions.

<!-- Add below permission inside 'manifest' tag -->
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
<!-- Add below permission inside 'application' tag -->
<receiver android:name="com.dexterous.flutterlocalnotifications.ScheduledNotificationBootReceiver">
 <intent-filter>
 <action android:name="android.intent.action.BOOT_COMPLETED"/>
 <action android:name="android.intent.action.MY_PACKAGE_REPLACED"/>
 </intent-filter>
</receiver>

open the 'Info.plist' file from app_name->ios->Runner->Info.plist project directory structure and copy-paste following permissions.

<key>UIBackgroundModes</key>
<array>
 <string>audio</string>
 <string>fetch</string>
</array>

Step 5: Follow below steps

-

-

initialize both android and ios settings in main function ,after initialize those settings to global variable.

-

design and develop button to send notification from mobile and call _showNotifications functions which sends the notification.

To know more about ElevatedButton refer this article: Flutter – ElevatedButton Widget

- _s

Now, It is time to code, open 'main.dart' file from app_name-> lib -> main.dart project directory structure and copy-paste following the entire code.

main.dart:

Output: