A Flutter package for show custom in-app notification.

Overview

๐Ÿ’ฌ in_app_notification

pub package

A Flutter package to show custom in-app notification with any Widgets.

โœ๏ธ Usage

  1. Import it.

    dependencies:
        in_app_notification: <latest-version>
    import 'package:in_app_notification/in_app_notification.dart';
  2. Place InAppNotification Widget into your app.

     return InAppNotification(
       child: MaterialApp(
         title: 'In-App Notification Demo',
         home: const HomePage(),
       ),
     );
  3. Invoke show() static method of InAppNotification.

    InAppNotification.show(
      child: NotificationBody(count: _count),
      context: context,
      onTap: () => print('Notification tapped!'),
    );

๐Ÿ—บ Roadmap / Known issue

See Discussions. If you have some idea or proposal, feel free to create new one.

๐Ÿ’ญ Have a question?

If you have a question or found issue, feel free to create an issue.

Comments
  • Fixed a warning in flutter 3.0.0

    Fixed a warning in flutter 3.0.0

    Fixed warning for flutter 3.0.0

    _ambiguate is a fix for warning below version 3.0.0. If you do not need, please remove it.

    https://docs.flutter.dev/development/tools/sdk/release-notes/release-notes-3.0.0#your-code

    opened by tadak1 3
  • Use Overlay API to show notification.

    Use Overlay API to show notification.

    https://www.reddit.com/r/FlutterDev/comments/nuucwl/in_app_notification_show_any_widget_as_a/h12t5h2?utm_source=share&utm_medium=web2x&context=3

    Reference for implementation: https://medium.com/saugo360/https-medium-com-saugo360-flutter-using-overlay-to-display-floating-widgets-2e6d0e8decb9

    enhancement 
    opened by Kurogoma4D 2
  • Refactoring to get rid of `StatefulWidget`.

    Refactoring to get rid of `StatefulWidget`.

    https://github.com/cb-cloud/flutter_in_app_notification/projects/1#card-76390399

    To showing notification, InAppNotification class used findAncestorStateOfType(). But this method is expensive when using BuildContext that obtained from deep hierarchy of widget tree(see document), so I replaced it with getElementForInheritedWidgetOfExactType() in InheritedWidget.

    opened by Kurogoma4D 1
  • Refactoring and bug fixes around animation curve.

    Refactoring and bug fixes around animation curve.

    FIX

    • Fixed a bug that curve option in InAppNotification.show() didn't affect.

    FEAT

    • Added dismissCurve option in InAppNotification.show().

    CHORE

    • Refactored a whole of code.
      • More readable logic around showing and dismissing notification.
      • Isolated AnimationController for interactions from one for showing.
    • Expanded example app to change sample notification size.
    opened by Kurogoma4D 1
  • How do you dismiss it programatically?

    How do you dismiss it programatically?

    Discussed in https://github.com/cb-cloud/flutter_in_app_notification/discussions/13

    Originally posted by johnnypcc January 23, 2022 I'd like to dismiss it after the user taps it, thanks

    opened by johnnypcc 1
  • 'package:flutter/src/rendering/viewport.dart': Failed assertion: line 1702 pos 12: 'center!.parent == this': is not true.

    'package:flutter/src/rendering/viewport.dart': Failed assertion: line 1702 pos 12: 'center!.parent == this': is not true.

    I have an in-app socket notification stream system that listens messages in home. (main->app->home) When I try to navigate a page and make http call, it throws the error below.

    Edit: When I trigger it in initState() it works perfectly.

    โ•โ•โ•ก EXCEPTION CAUGHT BY SCHEDULER LIBRARY โ•žโ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•
    The following assertion was thrown during a scheduler callback:
    'package:flutter/src/rendering/viewport.dart': Failed assertion: line 1702 pos 12: 'center!.parent
    == this': is not true.
    
    Either the assertion indicates an error in the framework itself, or we should provide substantially
    more information in this error message to help you determine and fix the underlying cause.
    In either case, please report this assertion by filing a bug on GitHub:
      https://github.com/flutter/flutter/issues/new?template=2_bug.md
    
    When the exception was thrown, this was the stack:
    #2      RenderViewport.indexOfFirstChild (package:flutter/src/rendering/viewport.dart:1702:12)
    #3      RenderViewportBase.debugDescribeChildren (package:flutter/src/rendering/viewport.dart:974:17)
    #4      DiagnosticableTreeNode.getChildren (package:flutter/src/foundation/diagnostics.dart:2989:48)
    #5      DiagnosticsNode.toJsonMap.<anonymous closure> (package:flutter/src/foundation/diagnostics.dart:1562:32)
    #6      DiagnosticsNode.toJsonMap (package:flutter/src/foundation/diagnostics.dart:1603:6)
    #7      DiagnosticsNode.toJsonList.<anonymous closure> (package:flutter/src/foundation/diagnostics.dart:1627:19)
    #8      MappedListIterable.elementAt (dart:_internal/iterable.dart:413:31)
    #9      ListIterator.moveNext (dart:_internal/iterable.dart:342:26)
    #10     new _GrowableList._ofEfficientLengthIterable (dart:core-patch/growable_array.dart:188:27)
    #11     new _GrowableList.of (dart:core-patch/growable_array.dart:150:28)
    #12     new List.of (dart:core-patch/array_patch.dart:51:28)
    #13     ListIterable.toList (dart:_internal/iterable.dart:213:44)
    #14     DiagnosticsNode.toJsonList (package:flutter/src/foundation/diagnostics.dart:1628:8)
    #15     DiagnosticsNode.toJsonMap.<anonymous closure> (package:flutter/src/foundation/diagnostics.dart:1590:25)
    #16     DiagnosticsNode.toJsonMap (package:flutter/src/foundation/diagnostics.dart:1603:6)
    #17     WidgetInspectorService._nodeToJson (package:flutter/src/widgets/widget_inspector.dart:1513:18)
    #18     WidgetInspectorService._reportStructuredError (package:flutter/src/widgets/widget_inspector.dart:922:44)
    #19     FlutterError.reportError (package:flutter/src/foundation/assertions.dart:1137:14)
    #20     RenderObject._debugReportException (package:flutter/src/rendering/object.dart:1370:18)
    #21     RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:1713:7)
    #22     PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:882:18)
    #23     RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:483:19)
    #24     WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:883:13)
    #25     RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:349:5)
    #26     SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1145:15)
    #27     SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9)
    #28     SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:996:5)
    #32     _invoke (dart:ui/hooks.dart:150:10)
    #33     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:270:5)
    #34     _drawFrame (dart:ui/hooks.dart:114:31)
    (elided 5 frames from class _AssertionError and dart:async)
    โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•โ•
    
    Another exception was thrown: Updated layout information required for RenderViewport#637e1 NEEDS-LAYOUT to calculate semantics.
    flutter: EVENT FROM NOTIFICATION: Instance of 'SocketNotification'
    flutter: EVENT FROM NOTIFICATION: Instance of 'SocketNotification'
    flutter: EVENT FROM NOTIFICATION: Instance of 'SocketNotification'
    
    Another exception was thrown: RenderBox.size accessed beyond the scope of resize, layout, or permitted parent access. RenderBox can always access
    its own size, otherwise, the only object that is allowed to read RenderBox.size is its parent, if they have said they will. It you hit this assert
    trying to access a child's size, pass "parentUsesSize: true" to that child's layout().
    
    Another exception was thrown: RenderBox.size accessed beyond the scope of resize, layout, or permitted parent access. RenderBox can always access
    its own size, otherwise, the only object that is allowed to read RenderBox.size is its parent, if they have said they will. It you hit this assert
    trying to access a child's size, pass "parentUsesSize: true" to that child's layout().
    
    Another exception was thrown: Updated layout information required for RenderViewport#637e1 NEEDS-LAYOUT to calculate semantics.
    
    Another exception was thrown: RenderBox.size accessed beyond the scope of resize, layout, or permitted parent access. RenderBox can always access
    its own size, otherwise, the only object that is allowed to read RenderBox.size is its parent, if they have said they will. It you hit this assert
    trying to access a child's size, pass "parentUsesSize: true" to that child's layout().
    

    main.dart

    Future<void> main() async {
      try {
        WidgetsFlutterBinding.ensureInitialized();
        runApp(MyApp());
      } catch (error, stackTrace) {
        printDebug('$error & $stackTrace');
      }
    }
    

    my_app.dart

    class MyApp extends StatelessWidget {
      const MyApp({Key? key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return InAppNotification(
          child: MultiProvider(
            providers: getProviders(),
            child: MaterialApp(
              title: 'My App',
              theme: ThemeData(
                visualDensity: VisualDensity.adaptivePlatformDensity,
              ),
              home: Consumer<AuthProvider>(
                builder: (context, provider, child) {
                  return provider.loggedIn ? const Home() : const AuthScreen();
                },
              ),
              routes: getRoutes(),
            ),
          ),
        );
      }
    }
    

    home.dart

      @override
      void initState() {
        super.initState();
    
        listenPusher();
      }
    
      void listenPusher() {
        _pusherSubscription = _pusher.stream.listen((event) {
          switch (event.type) {
            case ChannelType.message:
              // handle
              break;
            case ChannelType.notification:
              printDebug('EVENT FROM NOTIFICATION: ${event.data}');
              InAppNotification.show(
                child: const NotificationBody(),
                context: context,
                onTap: () => print('Notification tapped!'),
                duration: const Duration(milliseconds: 30000),
              );
              break;
          }
        });
      }
    
    opened by neisburak 0
  • Notification disappears without staying on notification panel.

    Notification disappears without staying on notification panel.

    It works perfectly, but I want a notification to stay at notification panel on phone. like a WhatsApp notification, which shows and then stays at notification panel. If there is a way to do this, Guide me. Thanks.

    opened by AbRehman0346 1
Releases(v1.1.2)
  • v1.1.2(Jul 1, 2022)

    What's Changed

    • Guard size change detection by @Kurogoma4D in https://github.com/cb-cloud/flutter_in_app_notification/pull/21

    Full Changelog: https://github.com/cb-cloud/flutter_in_app_notification/compare/v1.1.1...v1.1.2

    Source code(tar.gz)
    Source code(zip)
  • v1.1.1(May 23, 2022)

    What's Changed

    • Fix CI trigger to work on PR from fork. by @Kurogoma4D in https://github.com/cb-cloud/flutter_in_app_notification/pull/19
    • Fixed a warning in flutter 3.0.0 by @tadak1 in https://github.com/cb-cloud/flutter_in_app_notification/pull/18

    New Contributors

    • @tadak1 made their first contribution in https://github.com/cb-cloud/flutter_in_app_notification/pull/18

    Full Changelog: https://github.com/cb-cloud/flutter_in_app_notification/compare/v1.1.0...v1.1.1

    Source code(tar.gz)
    Source code(zip)
  • v1.1.0(Mar 14, 2022)

    What's Changed

    • Feature: dismiss notification programmatically. by @Kurogoma4D in https://github.com/cb-cloud/flutter_in_app_notification/pull/16
    • Refactoring to get rid of StatefulWidget. by @Kurogoma4D in https://github.com/cb-cloud/flutter_in_app_notification/pull/17

    Full Changelog: https://github.com/cb-cloud/flutter_in_app_notification/compare/v1.0.2...v1.1.0

    Source code(tar.gz)
    Source code(zip)
  • v1.0.2(Mar 2, 2022)

    What's Changed

    • Refactoring and bug fixes around animation curve. by @Kurogoma4D in https://github.com/cb-cloud/flutter_in_app_notification/pull/15

    Full Changelog: https://github.com/cb-cloud/flutter_in_app_notification/compare/v1.0.1...v1.0.2

    Source code(tar.gz)
    Source code(zip)
  • v1.0.1(Jun 25, 2021)

  • v1.0.0(Jun 25, 2021)

    FEAT

    • Added horizontal swipe gesture to dismiss notifications.
    • Now, using cache of InAppNotification's state. This makes it possible to decrease overhead on showing notification.
    Source code(tar.gz)
    Source code(zip)
  • v0.3.0(Jun 17, 2021)

    FEAT

    • BREAKING: Overall, changes API.
      • Removed InAppNotification.of(). To show notificaiton, use InAppNotification.show() instead.
      • Changed usage of InAppNotification, see Usage section in README.
    • Replaced Stack with OverlayEntry on showing notification sysytem.
    • Removed minAlertHeight property. Notification size is decided from specified Widget now.
    • Removed safeAreaPadding property. Notification position is now considering safe area automatically.
    • Added curve property to InAppNotification.show() method.
    Source code(tar.gz)
    Source code(zip)
  • v0.2.0+1(Jun 7, 2021)

  • v0.2.0(Jun 7, 2021)

  • v0.1.0(Jun 7, 2021)

Owner
CBcloud
CBcloud
The easiest way to show notification.

Starlight Notification The easiest way to show notification. Features โ˜‘๏ธ Show Notification โ˜‘๏ธ Cancel Notification โ˜‘๏ธ Cancel All Notification Watch the

Ye Myo Aung 1 Oct 19, 2022
Custom Gesture Detector for Flutter. Empower your users with custom gestures.

Gestures Custom Gesture Detector for Flutter. Empower your users with custom gestures. How to use In your pubspec.yaml: dependencies: gestures: ^1.0

Andrรฉ Baltazar 11 Nov 4, 2022
Reminder App using Firebase Notification Flutter

Reminder App using Firebase Notification Flutter Reminder app which is used to create task as reminder. In this app, I have used Firebase notification

Iqrar Ijaz 3 Aug 8, 2022
Flutter Local Notification Test APP

Local Notification Test App For Testing and Learning Local Notification Information I made it by referring to the site below [flutter] local notificat

SharkBSJ 1 Nov 20, 2021
The app is for notification of notice from teachers for students with alerts.

wce_notice_board A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

mali krushna 2 Sep 24, 2022
Flutter notification using firebase fcm

fcm_flutter_notifications A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get yo

Nisha Jain 1 Jan 31, 2022
An extension of flutter local notification, to simplify local notifications

Locally flutter local notification Locally helps developers create local notification with flutter on both Android and IOS platforms, it depends on th

Samuel Ezedi 20 Oct 10, 2022
Flutter plugin for notification read & reply

Reflex Flutter plugin for notification read & reply. Compatibility โœ… Android โŒ i

Devs On Flutter 14 Dec 20, 2022
Audio manager - A flutter plugin for music playback, including notification handling.

audio_manager A flutter plugin for music playback, including notification handling. This plugin is developed for iOS based on AVPlayer, while android

Jerome Xiong 96 Oct 25, 2022
Android application checking the new notes on Pronote and warns by notification

Pronote notification Application Android vรฉrifiant les nouvelles notes sur Pronote et prรฉvient par notification Fonctionnalitรฉs Application codรฉe et t

Valentin Saugnier 1 Sep 4, 2022
A Flutter package which implements a ConvexAppBar to show a convex tab in the bottom bar. Theming supported.

English | ็ฎ€ไฝ“ไธญๆ–‡ The official BottomAppBar can only display a notch FAB with an app bar, and sometimes we need a convex FAB. BottomAppBar and NotchShape

Thinking in code 647 Dec 28, 2022
Third App on Donut Count to show Stateless and Stateful App

Third App on Donut Count to show Stateless and Stateful App A new Flutter project. This app is show how Stateful and Stateless Widgets work together f

Avinandan Bose 1 Mar 16, 2022
A Flutter package for building custom skeleton widgets to mimic the page's layout while loading.

Skeletons A Flutter package for building custom skeleton widgets to mimic the page's layout while loading. Examples Items ListView (Default) ListView

Moh Badjah 46 Dec 17, 2022
A Flutter package with custom implementation of Drawer

Flutter Zoom Drawer A Flutter package with custom implementation of the Side Menu (Drawer) Getting Started To start using this package, add flutter_zo

null 335 Dec 22, 2022
Flutter app that uses Instagram public API to show users profile

instagramfinder A new Flutter project. Getting Started This project is a starting point for a Flutter application. I used Instagram public API for fet

Wali Seddiqi 5 Sep 7, 2022
Android app to show movie ratings when browsing Netflix, Amazon Prime Video and other supported video streaming apps on the phone

Flutter - Movie Ratings You can get the latest Playstore version here on Playstore - or download directly - 0.4.5 Screenshots of master Search Page Fa

Jay Rambhia 71 Nov 23, 2022
An app to show everything bus related in Singapore, including arrival times and a directory

NextBus SG An app to show everything bus related in Singapore, including bus arrival times and a directory, with extra features. ?? Gallery Click here

null 103 Sep 13, 2022
This App Currently is a Simple Budget Manager Show Analytics Based on Your Past Transactions

Budgex [In Progress] This App Currently is a Simple Budget Manager Show Analytics Based on Your Past Transactions Features Localization Persistant Sto

Mohammad Javad Hossieni 8 Nov 14, 2022
Using Open Weather API, its app show weather forecast.

weather_forecast Using Open Weather API, its app show weather forecast. To show use this application, you have to add your apiKey into weather_forecas

ๆ‰ๅฑฑ่ˆชๅคช 0 Dec 28, 2021