WhatsApp like call notification when app in background in flutter - android

On Android, I want to be able to show a persistent notification with two buttons even when the app is in the background or when the phone is locked. Basically, like a WhatsApp incoming call notification.
I know how to do it in Java but I don't know how to do it in Flutter. I've read similar questions on SO but none have provided a good answer.
FYI, I know how to send and receive FCM notifications. I know how to display a normal notification when a FCM message is sent while the app is in the background.

After wasting an entire week, here is the solution I found.
Keep your app running in the background and make sure it is not closed by the user. This tutorial explains how to do it: https://github.com/ppicas/flutter-android-background
If the solution above is too complicated, use the flutter_background to do more or less the same thing (the first solution is better because it also prevents the user from closing the app).
Make sure the flutter activity can be displayed over the lock screen by adding this to your activity's declaration in your manifest:
android:showWhenLocked="true"
Last thing is to use a wakelock in flutter when your app receives a notification, and you want to display a full screen "call received" widget.

You can use firebase_messaging and awesome_notifications
add this in your firebase background subscription handler
await AwesomeNotifications().createNotification(
content: NotificationContent(
id: createuniqueId(),
channelKey: 'basic_channel',
title: message.data['title'],
body: message.data['body'],
wakeUpScreen: true,
fullScreenIntent: true,
autoDismissible: false,
category: NotificationCategory.Call,
locked: true,
displayOnForeground: true,
),
actionButtons: [
NotificationActionButton(
key: 'accept',
label: 'Accept',
),
NotificationActionButton(
isDangerousOption: true,
key: 'reject',
label: 'Reject',
),
],
);
add this is your main()
AwesomeNotifications().initialize(
'resource://drawable/ic_icon',
[
NotificationChannel(
channelKey: 'basic_channel',
channelName: 'Basic Notification',
channelDescription: 'Hello world',
importance: NotificationImportance.High,
channelShowBadge: true,
vibrationPattern: highVibrationPattern
),
]
);

Related

awesome notifications icon just blue circle on real device

im using awesome_notifications package for my notification, when im running on emulator it works fine the icon appear but in the real device it just blue circle or white circle.
NOTE: im testing with Redmi Note 9 12.5.5 Android 11
here is my icon
here is my notifications initialize code
AwesomeNotifications().initialize(
null,
[
// notification icon
NotificationChannel(
channelGroupKey: 'basic_test',
channelKey: 'basic',
channelName: 'Basic notifications',
channelDescription: 'Notification channel for basic tests',
channelShowBadge: true,
importance: NotificationImportance.High,
enableVibration: false,
),
],
);
here is my create notifications code
AwesomeNotifications().createNotification(
content: NotificationContent(
id: id,
channelKey: 'basic',
title: title,
body: body,
autoDismissible: false,
locked: showProgress ? true : false,
notificationLayout: showProgress
? NotificationLayout.ProgressBar
: NotificationLayout.Default,
progress: progress,
fullScreenIntent: true,
backgroundColor: MyThemes.colorBlue,
),
);

Flutter when action is set on notification, the app calls BackgroundMethod even if the app is in foreground

I have a flutter app that uses local notifications https://pub.dev/packages/flutter_local_notifications.
I have a notification that is set to a certain date :
await flutterLocalNotificationsPlugin.initialize(initializationSettings,
onDidReceiveNotificationResponse: (NotificationResponse response) async {
print("FOREGORUND");
},
onDidReceiveBackgroundNotificationResponse: notificationTapBackground,
);
await flutterLocalNotificationsPlugin.zonedSchedule(
uid.hashCode,
title,
desc,
timez.TZDateTime.from(datex, timez.local),
NotificationDetails(
android: AndroidNotificationDetails(
'your channel id', 'your channel name',
channelDescription: 'your channel description',
actions: <AndroidNotificationAction>[
AndroidNotificationAction(
"CompleteID",
"Complete",
icon: DrawableResourceAndroidBitmap('complete_img'),
showsUserInterface: false,
cancelNotification: true,
),
],)
),
payload: uid,
androidAllowWhileIdle: true,
uiLocalNotificationDateInterpretation:
UILocalNotificationDateInterpretation.absoluteTime);
When I click on the complete action from the notification, the app calls "notificationTapBackground" even if the app is in foreground, so from notificationTapBackground isolate thread i can' t call setstate inside my app.
I would like to be able to click on the complete action from the notification and have :
the app calls notificationTapBackground, if the app is in the background
the app calls onDidReceiveNotificationRespons, if the app is in the foreground
all with the parameter showsUserInterface: false, inside notification actions.

Why I am not able to display image notifications?

I am developing a flutter application and displaying notifications with awesome_notifications package (https://pub.dev/packages/awesome_notifications). Below is my code.
await AwesomeNotifications().createNotification(
content: NotificationContent(
id: UniqueKey().hashCode,
groupKey: message.data["senderUid"],
channelKey: 'basic_channel',
title: message.data["title"],
body: message.data["body"],
summary: message.data["body"], // Anything you want here
bigPicture:
"https://upload.wikimedia.org/wikipedia/commons/thumb/a/a8/TEIDE.JPG/2560px-TEIDE.JPG",
notificationLayout: NotificationLayout.Messaging,
),
);
This code does not display any notifications. Instead if I remove the bigPicture, then it will show the message without the picture.
How can I show the notification image?
Use correct notificationLayout, in this case BigPicture.

How to push mandatory notification with flutter?

So I have this app in flutter, in which there are two textfeilds.
One is 'Reminder title' and another is the description/message.
Now what I want is that to push a notification with the information from the textfeilds.
And I want the notification to be there until I mark it as done from the app.
Now I have been using flutter_local_notifications. But I have been getting errors by following their documentations. Actually no notification came after pressing the button.
I need help with some code to achieve the following purpose.
We can use awesome_notifications for this purpose, in case firebase and flutter_local_notification becomes problematic.
Basically you have to initialize a channel:
import 'package:awesome_notifications/awesome_notifications.dart';
AwesomeNotifications().initialize(
// set the icon to null if you want to use the default app icon
'resource://drawable/res_app_icon',
[
NotificationChannel(
channelGroupKey: 'basic_channel_group',
channelKey: 'basic_channel',
channelName: 'Basic notifications',
channelDescription: 'Notification channel for basic tests',
defaultColor: Color(0xFF9D50DD),
ledColor: Colors.white)
],
// Channel groups are only visual and are not required
channelGroups: [
NotificationChannelGroup(
channelGroupkey: 'basic_channel_group',
channelGroupName: 'Basic group')
],
debug: true
);
and then create desired notification by =>
AwesomeNotifications().createNotification(
content: NotificationContent(
id: 10,
channelKey: 'basic_channel',
title: 'Simple Notification',
body: 'Simple body'
)
);
Read their documentation for more information.
And here is their video tutorial.

Delete previous notification(s) using react-native-push-notification

I'm writing an app that sends a local push notification every fifteen minutes while a background timer is running via react-native-push-notification. If notification n isn't acted on by the user, when notification n+1 is pushed, I'd like to delete notification n.
The things I've tried so far are to set popInitialNotification to true when running PushNotification.configure() and setting ongoing to true when calling PushNotification.localNotification(). I've also tried adding an id when calling localNotification() and then calling PushNotification.cancelLocalNotifications({id: myId}), but the documentation explicitly says that cancelLocalNotifications() only cancels scheduled notifications (and I'm pretty sure it means only future ones).
componentWillMount() {
PushNotification.configure({
permissions: {
alert: true,
badge: true,
sound: true
},
popInitialNotification: true,
});
}
doPushNotification() {
if (AppState.currentState !== 'active') {
PushNotification.localNotification({
vibration: 500,
message: 'my message',
ongoing: true,
});
}
}
Currently I'm only working on the Android version, but soon I'll work on the iOS version, so a general solution (or the solution for each) would be most helpful.
I'm not totally sold on react-native-push-notification, either, if there's a better React Native library out there; I just haven't found one.
Edit
I figured it out for Android. Setting the id when calling PushNotification.localNotification() to the same value as the previous notification will overwrite the notification.
I'm still installing XCode on my Mac, so I can't test the current behavior on iOS just yet. However, the react-native-push-notification readme says that id is an Android-only option (as is ongoing). I may still need help getting the iOS notifications to do what I want.
The docs for react-native-push-notification state that you can cancel a ios local notification using userInfo like this:
PushNotification.localNotification({
...
userInfo: { id: '123' }
...
});
PushNotification.cancelLocalNotifications({id: '123'});
I have tested this, and it works.
For android, this somehow worked:
Creating the notification :
PushNotification.localNotificationSchedule({
message: message ,
date: new Date(date),
repeatType: "minute",
id: JSON.stringify(id),
userInfo: { id: JSON.stringify(id) }
});
PushNotification.cancelLocalNotifications({ id: id});
Having the id stringified worked with cancelling the android push notification.
you can add this code inside handleAppStateChange(appState)
if (appState === 'active') {
PushNotification.cancelAllLocalNotifications()
}
if you are useing react-native-push-notification lib.
then you can use this code in componentDidMount section
PushNotification.getDeliveredNotifications((all) => {
console.log(all, "notification liast");
PushNotification.removeAllDeliveredNotifications();
});
here you can get all notification list and clear all list after open your app.
these code work for me in ANDROID device (i did not test it in IOS device)
Below code works on both iOS and Android :
We need to stringify id so that it works in android and the date must be created from Date class not from some library like moment.
const LocalNotificationSchedule = (id, afterSec, message) => {
PushNotification.localNotificationSchedule({
id: id+'',
message: message,
date: new Date(Date.now() + afterSec * 1000),
playSound: true,
soundName: 'default',
vibrate: true,
vibration: 300,
playSound: true,
soundName: 'default',
ignoreInForeground: false
})
}
const CancelLocalNotifications = (id) => {
PushNotification.cancelLocalNotifications({id: id+''})
}
Try to delete the notification with cancelLocalNotifications.

Categories

Resources