How to Use flutter_local_notifications in Flutter Apps

To use flutter_local_notifications, add it to your pubspec.yaml, initialize the plugin in your app, then create and show notifications using its API. You configure notification details and call show() to display notifications locally on the device.

Syntax

The main steps to use flutter_local_notifications are:

• Import the package.
• Create an instance of FlutterLocalNotificationsPlugin.
• Initialize it with platform-specific settings.
• Define notification details like title, body, and importance.
• Call show() to display the notification.

dart

import 'package:flutter_local_notifications/flutter_local_notifications.dart';

final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

Future<void> initializeNotifications() async {
  const AndroidInitializationSettings initializationSettingsAndroid = AndroidInitializationSettings('app_icon');
  final InitializationSettings initializationSettings = InitializationSettings(android: initializationSettingsAndroid);
  await flutterLocalNotificationsPlugin.initialize(initializationSettings);
}

Future<void> showNotification() async {
  const AndroidNotificationDetails androidPlatformChannelSpecifics = AndroidNotificationDetails(
    'channel_id', 'channel_name',
    importance: Importance.max,
    priority: Priority.high,
  );
  const NotificationDetails platformChannelSpecifics = NotificationDetails(android: androidPlatformChannelSpecifics);
  await flutterLocalNotificationsPlugin.show(
    0, 'Hello', 'This is a notification', platformChannelSpecifics);
}

Example

This example shows a minimal Flutter app that initializes the plugin and shows a notification when a button is pressed.

dart

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();

  @override
  void initState() {
    super.initState();
    initializeNotifications();
  }

  Future<void> initializeNotifications() async {
    const AndroidInitializationSettings initializationSettingsAndroid = AndroidInitializationSettings('app_icon');
    final InitializationSettings initializationSettings = InitializationSettings(android: initializationSettingsAndroid);
    await flutterLocalNotificationsPlugin.initialize(initializationSettings);
  }

  Future<void> showNotification() async {
    const AndroidNotificationDetails androidDetails = AndroidNotificationDetails(
      'channel_id', 'channel_name',
      importance: Importance.max,
      priority: Priority.high,
    );
    const NotificationDetails platformDetails = NotificationDetails(android: androidDetails);
    await flutterLocalNotificationsPlugin.show(0, 'Hello', 'This is a notification', platformDetails);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Notification Example')),
        body: Center(
          child: ElevatedButton(
            onPressed: showNotification,
            child: Text('Show Notification'),
          ),
        ),
      ),
    );
  }
}

Output

A Flutter app with a button labeled 'Show Notification'. When tapped, a local notification with title 'Hello' and body 'This is a notification' appears on the device.

Common Pitfalls

Common mistakes when using flutter_local_notifications include:

• Not initializing the plugin before showing notifications.
• Forgetting to add the required app icon resource named app_icon for Android.
• Not requesting notification permissions on iOS (requires extra setup).
• Using incorrect channel IDs or missing channel configuration on Android 8.0+.

dart

/* Wrong: Not initializing plugin */
await flutterLocalNotificationsPlugin.show(0, 'Title', 'Body', platformDetails);

/* Right: Initialize first */
await flutterLocalNotificationsPlugin.initialize(initializationSettings);
await flutterLocalNotificationsPlugin.show(0, 'Title', 'Body', platformDetails);

Quick Reference

Summary tips for using flutter_local_notifications:

• Always initialize the plugin in initState or before showing notifications.
• Define notification channels for Android 8.0+ to control importance and behavior.
• Use platform-specific settings for iOS and Android to customize notifications.
• Test notifications on real devices as emulators may not show them properly.

Key Takeaways

Initialize flutter_local_notifications plugin before showing notifications.

Configure notification details and channels properly for Android and iOS.

Use show() method to display local notifications with title and body.

Add required app icon resources and request permissions on iOS.

Test notifications on real devices for accurate behavior.