How to send foreground push notifications in Flutter

In our previous article, we explained how to handle firebase cloud notifications.

Now, we’ll understand how handle local notifications in our flutter apps. And thereby, managing foreground notifications.

Let’s get started.

Import the flutter_local_notifications package from pub (Do check here, on how to set it up)

Create a new Dart file. paste this code:

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

class ForegroundNotification extends StatefulWidget {
  @override
  _ForegroundNotificationState createState() => _ForegroundNotificationState();
}

class _ForegroundNotificationState extends State<ForegroundNotification> {
  GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
      new FlutterLocalNotificationsPlugin();

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

  _onTap() async {
    var androidPlatformChannelSpecifics = AndroidNotificationDetails(
        '1', 'inducesmile', 'inducesmile flutter snippets',
        importance: Importance.Max, priority: Priority.High);
    var iOSPlatformChannelSpecifics = IOSNotificationDetails();
    var platformChannelSpecifics = NotificationDetails(
        androidPlatformChannelSpecifics, iOSPlatformChannelSpecifics);
    await flutterLocalNotificationsPlugin.show(0, 'Inducesmile.com',
        'For Android & Flutter source code', platformChannelSpecifics,
        payload: 'item x');
  }

  initNotifications() async {
// initialise the plugin. app_icon needs to be a added as a drawable resource to the Android head project
    var initializationSettingsAndroid =
        new AndroidInitializationSettings('app_icon');
    var initializationSettingsIOS = new IOSInitializationSettings(
        onDidReceiveLocalNotification: (i, string1, string2, string3) {
      print("received notifications");
    });
    var initializationSettings = new InitializationSettings(
        initializationSettingsAndroid, initializationSettingsIOS);
    flutterLocalNotificationsPlugin.initialize(initializationSettings,
        onSelectNotification: (string) {
      print("selected notification");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      appBar: AppBar(title: Text('Foreground Local Notification Example')),
      body: Center(
        child: RaisedButton(
          child: Text("Fire Notification"),
          onPressed: _onTap,
          color: Colors.red,
        ),
      ),
    );
  }
}

In main.dart:

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Code Snippets',
      theme: new ThemeData(primarySwatch: Colors.red),
      home: new ForegroundNotification(),
    );
  }
}

If you have any questions or suggestions kindly use the comment box or you can contact us directly through our contact page below.

Add a Comment