💬
Get Help
NT
Nikhil Thomas

Incoming Call Screen with Push Notifications in FlutterFlow

Custom Code

Hi everyone,

We are currently facing difficulties in implementing an incoming call screen that appears when a push notification is received. Below are the details of the issue:

Context

  • We are building a communication app where users receive incoming calls.

  • We are using FlutterFlow with Firebase Cloud Messaging (FCM) for push notifications.

  • The expected behavior is:

    1. When a push notification for an incoming call arrives (whether the app is in the foreground, background, or terminated),

    2. The app should display a full-screen incoming call UI (similar to a native call screen) with options to Accept or Decline.

    3. On Accept, the user is navigated directly into the call screen.

Issues We Are Facing

  1. Foreground Behavior

    • When the app is open, we are not able to display a custom call dialog or screen triggered from the push notification.

    • Notifications are received, but there doesn’t seem to be a way in FlutterFlow to override the UI and force an incoming call screen while the user is inside the app.

  2. Background & Terminated State

    • Notifications arrive in the system tray, but we are unable to auto-display a custom incoming call screen.

    • Currently, tapping the notification navigates the user into the app, but the call screen does not appear immediately.

  3. Platform Limitations

    • On Android, we were exploring whether we could integrate with flutter_callkit_incoming or similar solutions, but custom code integration in FlutterFlow seems restrictive.

    • On iOS, we are aware that showing a full native call screen requires CallKit integration, but again, we are unsure how to achieve this in FlutterFlow.

Questions / Support Needed

  • Is there a recommended approach or best practice in FlutterFlow to show a full-screen incoming call UI triggered directly from push notifications (both foreground and background)?

  • Does FlutterFlow support CallKit / ConnectionService-like functionality for iOS and Android? If not, can this be achieved via custom code integration? We tried, but it shows an error.

  • How can we ensure the incoming call screen appears even when the app is in background or killed state?

  • Any sample workflows or community-proven patterns would be greatly appreciated.

Goal

We want to provide users with a seamless incoming call experience, similar to WhatsApp or Messenger, where the call screen immediately pops up regardless of the app state.

Thanks

What have you tried so far?

  • Implemented FCM push notifications successfully in FlutterFlow.

  • Tested both notification and data payloads from Firebase.

  • Verified that notifications are received correctly in foreground, background, and terminated states.

  • Attempted to trigger navigation to a custom "Incoming Call" page on notification tap, but failed.

  • Explored custom code integration for plugins like flutter_callkit_incoming, but it is unclear if FlutterFlow allows us to integrate them effectively.

  • Reviewed available FlutterFlow actions for push notifications but found no option to force a full-screen UI on notification arrival.

Did you check FlutterFlow's Documentation for this topic?
Yes
2