'how to open a certain page using local notification in Flutter? (Not FCM)

no, I am not asking about Firebase Cloud Messaging notification here, but purely using local notification package from here flutter local notification

I want if my user click the notification then it will be directed to a certain page. how to do that ?

currently my code is like this

class LocalNotificationService  {
  late FlutterLocalNotificationsPlugin _flutterLocalNotificationsPlugin;
  LocalNotificationService._privateConstructor() {
    _init();
  }

  static final LocalNotificationService _instance = LocalNotificationService._privateConstructor();
  static LocalNotificationService get instance => _instance; // singleton access

  void _init() {
    _flutterLocalNotificationsPlugin = FlutterLocalNotificationsPlugin();
    _initializePlatformSpecifics();
  }

  Future<void> _initializePlatformSpecifics() async {
    var androidInitializationSettings = AndroidInitializationSettings("app_notification_icon");
    var iOSInitializationSettings = IOSInitializationSettings(
      requestAlertPermission: true,
      requestBadgePermission: true,
      requestSoundPermission: true,
      onDidReceiveLocalNotification: (id, title, body, payload) async {
        // do something if notification is clicked
      },
    );

    final initializationSettings = InitializationSettings(
      android: androidInitializationSettings,
      iOS: iOSInitializationSettings,
    );

    await _flutterLocalNotificationsPlugin.initialize(initializationSettings);
  }

  void showSimpleNotification({
    required String title,
    required String body,
    required NotificationType notificationType,
  }) async {
    var android = _setAndroidNotificationDetails(notificationType);
    var ios = IOSNotificationDetails();

    var notificationDetails = new NotificationDetails(android: android, iOS: ios);

    await _flutterLocalNotificationsPlugin.show(
      1, // only need to show one notification in the notification tray, so it is ok if we use the Notification ID
      title,
      body,
      notificationDetails,
    );
  }

  
}


Solution 1:[1]

i recommend reading plugin documentation

as per documentation

    FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
      FlutterLocalNotificationsPlugin();
  const AndroidInitializationSettings initializationSettingsAndroid =
      AndroidInitializationSettings('app_icon');
  final IOSInitializationSettings initializationSettingsIOS =
      IOSInitializationSettings(
    requestSoundPermission: false,
    requestBadgePermission: false,
    requestAlertPermission: false,
    onDidReceiveLocalNotification: onDidReceiveLocalNotification,
  );
  final MacOSInitializationSettings initializationSettingsMacOS =
      MacOSInitializationSettings(
          requestAlertPermission: false,
          requestBadgePermission: false,
          requestSoundPermission: false);
  final InitializationSettings initializationSettings = InitializationSettings(
      android: initializationSettingsAndroid,
      iOS: initializationSettingsIOS,
      macOS: initializationSettingsMacOS);
  await flutterLocalNotificationsPlugin.initialize(initializationSettings,
      onSelectNotification: onSelectNotification);
  • you can pass onSelectNotification function which will be called whenever user click on notification

  • from this function u can redirection to particular screen example as below

           Future selectNotification(String payload) async {
             if (payload != null) {
               debugPrint('notification payload: $payload');
             }
             await Navigator.push(
                   context,
                   MaterialPageRoute<void>(builder: (context) => 
                   SecondScreen(payload)),);
           } 
    

Solution 2:[2]

First thing you need to create a GlobalKey for navigation like the following:

GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

and inside MaterialApp, set the navigatorKey property to be our created key like the following property

navigatorKey: navigatorKey

Now you can use the navigation methods from inside the current state of key, example:

navigatorKey.currentState!.push()

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 kishan vekariya
Solution 2 Moaz El-sawaf