Giter Club home page Giter Club logo

elmissouri16 / firebase_and_local_notification Goto Github PK

View Code? Open in Web Editor NEW

This project forked from malukishtiaq/firebase_and_local_notification

0.0 0.0 0.0 291 KB

A comprehensive Flutter project for integrating and managing Firebase Cloud Messaging (FCM) and local notifications. Features background message handling, interactive notification responses, and user-centric notification controls.

Ruby 3.68% C++ 30.59% C 1.87% Objective-C 0.05% Kotlin 0.19% Dart 33.41% Swift 2.95% HTML 2.48% CMake 24.77%

firebase_and_local_notification's Introduction

firebase_and_local_notification

A comprehensive Flutter project for integrating and managing Firebase Cloud Messaging (FCM) and local notifications. Features background message handling, interactive notification responses, and user-centric notification controls.

Implementing Firebase and Local Notifications in Flutter

Building a full-fledged Flutter application often requires the integration of notifications to enhance user engagement. This guide walks you through the implementation of both Firebase Cloud Messaging (FCM) for push notifications and local notifications within a Flutter application.

Prerequisites

Before you start, make sure you have:

Setting Up Firebase Cloud Messaging Before sending or receiving notifications, you must integrate your Flutter app with Firebase. This involves a few steps:

Create a Firebase project in the Firebase Console.

Add your app to the project by following the setup instructions for iOS and Android. Download the google-services.json file for Android and the GoogleService-Info.plist for iOS and place them in the respective directories of your Flutter project. Initialize Firebase in your Flutter app.

Integrate Firebase into your Flutter application by following these steps:

Add Firebase to Your Flutter App

Follow the instructions on the Firebase console to add your app to your Firebase project. Download the google-services.json file and place it in your Flutter project's android/app directory.

Integrate Firebase SDK

Add firebase_core and firebase_messaging to your pubspec.yaml file and install them by running flutter pub get.

Initialize Firebase

In your main Dart file, initialize Firebase as shown in the provided code snippet. Ensure you do this before calling runApp().


Future<void> main() async {
  await notificationSetup();
  runApp(const MyApp());
}

Future<void> notificationSetup() async {
  await GlobalNotification.localNotificationInit();
  FBaseConnect connect = FBaseConnect();
  await connect.firebaseInit();
}

Implementing Firebase Messaging

The FBaseConnect class handles the initialization and setup for Firebase Messaging:

Background Message Handler

Define a top-level or static function to handle background messages. This function must have the @pragma('vm:entry-point') annotation to ensure it's compiled into the binary.


@pragma('vm:entry-point')
Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
  // ... Handle background message
}

Foreground Message Setup

Inside firebaseInit(), set up the message handlers for both foreground messages and messages that occur when the app is in the background or terminated.

Handling Notifications

With FgMsg and NotificationActions, you can define custom actions based on the notification's payload:

Custom Actions

Based on the screen name provided in the notification's data payload, navigate the user to different screens or perform specific actions.

Showing Banner Notifications

Use the flutter_local_notifications package to display banner notifications. Customize the appearance for both Android and iOS platforms.

Notification Data Model

NotiPayloadParams is a data model representing the notification's payload. Use it to parse and handle the notification data.

Save Notification Data

Optionally, save the notification data locally for future reference.

Local Notifications

For local notifications, you use the flutter_local_notifications plugin:

Initialization

Configure and initialize the local notifications plugin. Define settings for both Android and iOS.

Handling Notification Tap

Define a function to handle the event when a user taps on a notification. This function can also be used to navigate to a specific screen in your app.


Future<void> notificationTapBackground(
    NotificationResponse notificationResponse) async {
  // ... Handle notification tap
}

UI and Stream Listeners

Implement UI components and listeners to handle notification streams.


  @override
  initState() {
    configureDidReceiveLocalNotificationSubject();
    configureSelectNotificationSubject();
    super.initState();
  }

  void configureDidReceiveLocalNotificationSubject() {
    didReceiveLocalNotificationStream.stream.listen(
      (ReceivedNotification receivedNotification) async {
        var jsonData = jsonDecode(receivedNotification.payload ?? "");
        NotiPayloadParams notiPayloadParams =
            NotiPayloadParams.fromMap(jsonData);
        await ProcessNotification.via
            .handlePushNotification(notiPayloadParams, context);
      },
    );
  }

  void configureSelectNotificationSubject() {
    selectNotificationStream.stream.listen((String? payload) async {
      var jsonData = jsonDecode(payload.toString());
      NotiPayloadParams notiPayloadParams = NotiPayloadParams.fromMap(jsonData);
      await ProcessNotification.via
          .handlePushNotification(notiPayloadParams, context);
    });
  }

Platform-Specific Configurations

Other then request notification permissions andadding google json, no need to configure android platform.

Badge Management

Use the flutter_app_badger plugin to update the badge count on the app icon based on the received notifications.

Conclusion

By integrating both Firebase and local notifications, you can ensure that your users are always engaged with timely and relevant updates. Remember to handle permissions, background processes, and data management appropriately to create a seamless user experience.

For a full implementation guide, including detailed code examples and explanations, refer to the Flutter documentation and respective plugin instructions on pub.dev.

firebase_and_local_notification's People

Contributors

malukishtiaq avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.