How to implement local notifications in Flutter in few steps.
This is step by step guide to how to Implement local notifications in Flutter Application.
1. Add the flutter_local_notifications dependency to your pubspec.yaml file:
dependencies:
flutter_local_notifications: ^6.0.0
2. Create a new instance of the FlutterLocalNotificationsPlugin class in your app:
final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
FlutterLocalNotificationsPlugin();
3. In the initState method of your widget, initialize the FlutterLocalNotificationsPlugin instance with the desired settings:
@override
void initState() {
super.initState();
var initializationSettingsAndroid =
AndroidInitializationSettings('@mipmap/ic_launcher');
var initializationSettingsIOS = IOSInitializationSettings();
var initializationSettings = InitializationSettings(
android: initializationSettingsAndroid, iOS: initializationSettingsIOS);
flutterLocalNotificationsPlugin.initialize(initializationSettings,
onSelectNotification: onSelectNotification);
}
Here, we are initializing the plugin with a default Android app icon and no additional iOS settings. The onSelectNotification argument is a callback that will be called when the user taps on a notification.
4. Define a method to schedule a notification:
Future<void> _scheduleNotification() async {
var scheduledNotificationDateTime = DateTime.now().add(Duration(seconds: 5));
var androidPlatformChannelSpecifics = AndroidNotificationDetails(
'channel_id', 'channel_name', 'channel_description',
importance: Importance.high, priority: Priority.high);
var iOSPlatformChannelSpecifics = IOSNotificationDetails();
var platformChannelSpecifics = NotificationDetails(
android: androidPlatformChannelSpecifics,
iOS: iOSPlatformChannelSpecifics);
await flutterLocalNotificationsPlugin.schedule(
0,
'Scheduled Notification',
'This notification was scheduled at ${DateTime.now()}',
scheduledNotificationDateTime,
platformChannelSpecifics,
payload: 'Scheduled notification');
}
In this method, we are creating a new notification that will be displayed 5 seconds from now. We are using the AndroidNotificationDetails and IOSNotificationDetails classes to customize the appearance and behavior of the notification on each platform. In this example, we are only setting the channel ID, name, and description for Android. We are also setting the notification title, body, and payload.
5. Define a method to handle notification taps:
Future onSelectNotification(String payload) async {
showDialog(
context: context,
builder: (_) {
return AlertDialog(
title: Text("Notification"),
content: Text("$payload"),
);
},
);
}
Here, we are simply displaying an alert dialog with the notification payload.
6. In your app’s UI, add a button or other trigger to call the _scheduleNotification method:
ElevatedButton(
child: Text('Schedule Notification'),
onPressed: _scheduleNotification,
),
That’s it! When the user taps the button, a new notification will be scheduled and displayed after 5 seconds. When the user taps on the notification, the onSelectNotification method will be called, and the payload will be displayed in an alert dialog. Remember to customize the notification settings to fit your app’s needs.
