Debug School

rakesh kumar
rakesh kumar

Posted on

How to Show Notifications in Flutter (Firebase Messaging – Foreground Notifications)

When your app is open (foreground), Firebase does NOT show system notifications automatically.
So you must manually display them using a popup, dialog, or local notification.

main() — Initialize Firebase Before Notification Features Work
R:\firebase\firebase\lib\main.dart

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(const MyApp());
}
Enter fullscreen mode Exit fullscreen mode

👉 Simple Explanation

Makes sure Firebase is ready before the UI loads.

Without this, messaging listeners (onMessage) won’t work.

2️⃣ initState() — Start Permission, Token, and Listeners
R:\firebase\firebase\lib\home_screen.dart

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

  _notificationServices.requestNotificationPermission();
  _notificationServices.listenToTokenRefresh();

  _notificationServices.getDeviceToken().then((value) {
    print(value);
  });

  _notificationServices.firebaseInit(context);
  _notificationServices.handleNotificationClick(context);
}
Enter fullscreen mode Exit fullscreen mode

👉 Simple Explanation

firebaseInit() — Listen for Foreground Messages
R:\firebase\firebase1\firebase\lib\notification_services.dart

void firebaseInit(BuildContext context) {
  FirebaseMessaging.onMessage.listen((RemoteMessage message) {
    print("Foreground message received: ${message.notification?.title}");

    if (message.notification != null) {
      _showForegroundNotificationDialog(
        context,
        title: message.notification!.title ?? "Notification",
        body: message.notification!.body ?? "",
      );
    }
  });
}
Enter fullscreen mode Exit fullscreen mode

output

Top comments (0)