In Flutter, you can post local notifications using plugins such as flutter_local_notifications
. Here’s a step-by-step guide on how to post local notifications in your Flutter app:
Step 1: Add Dependency
To get started, you need to add the flutter_local_notifications
package to your pubspec.yaml
file. Open the file and add the following dependency:
dependencies: flutter: sdk: flutter flutter_local_notifications: ^5.0.0
Then, run flutter pub get
to fetch the package.
Step 2: Initialize the Plugin
You need to initialize the plugin in your Flutter app, typically in your main.dart
file. Here’s how you can do it:
import 'package:flutter/material.dart'; import 'package:flutter_local_notifications/flutter_local_notifications.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: HomeScreen(), ); } }
Step 3: Configure Notifications
In your app, you can configure how notifications will look and behave. This usually happens in the main()
function before calling runApp()
. For example:
Future<void> _configureLocalNotifications() async { final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin(); final AndroidInitializationSettings androidInitializationSettings = AndroidInitializationSettings('app_icon'); final IOSInitializationSettings iosInitializationSettings = IOSInitializationSettings( onDidReceiveLocalNotification: onDidReceiveLocalNotification); final InitializationSettings initializationSettings = InitializationSettings( android: androidInitializationSettings, iOS: iosInitializationSettings, ); await flutterLocalNotificationsPlugin.initialize(initializationSettings, onSelectNotification: onSelectNotification); } void main() async { WidgetsFlutterBinding.ensureInitialized(); await _configureLocalNotifications(); runApp(MyApp()); }
This code initializes the local notifications plugin and defines how notifications should behave on Android and iOS platforms
Step 4: Post a Notification
You can post a notification from anywhere in your app by calling the show
method of the FlutterLocalNotificationsPlugin
instance. Here’s an example of how to post a notification:
Future<void> _postNotification() async { final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin(); final AndroidNotificationDetails androidPlatformChannelSpecifics = AndroidNotificationDetails( 'your_channel_id', 'your_channel_name', 'your_channel_description', importance: Importance.max, priority: Priority.high, showWhen: false, ); final NotificationDetails platformChannelSpecifics = NotificationDetails(android: androidPlatformChannelSpecifics); await flutterLocalNotificationsPlugin.show( 0, // notification ID 'Notification Title', 'Notification Body', platformChannelSpecifics, ); }
Step 5: Handle Notification Interaction
You can handle user interaction with notifications by defining the onSelectNotification
and onDidReceiveLocalNotification
callbacks. For example:
Future<void> onSelectNotification(String? payload) async { if (payload != null) { debugPrint('Notification clicked with payload: $payload'); } // Handle notification interaction here } Future<void> onDidReceiveLocalNotification( int id, String? title, String? body, String? payload) async { // Handle notification when received while the app is in the foreground }
These callbacks allow you to take specific actions when the user interacts with the notification.
Step 6: Call _postNotification()
to Trigger a Notification
To post a notification, simply call the _postNotification()
function at the appropriate point in your app:
FlatButton( onPressed: () => _postNotification(), child: Text('Post Notification'), ),
In this example, a button press triggers the notification.
That’s it! You’ve now set up and posted local notifications in your Flutter app using the flutter_local_notifications
package. You can customize the notification appearance, behavior, and how you handle user interaction according to your app’s requirements.