I am using Local Notifications for my app and it is working fine on my iPhone but when firing a Notification on my Android Simulator it is not showing the Notification on top of the screen but only the dot:
The Notification actually appears fine in the Notification Center:
I am making sure to init and I a calling instantNotification which looks like this:
Future initialize() async {
FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
FlutterLocalNotificationsPlugin();
AndroidInitializationSettings androidInitializationSettings =
AndroidInitializationSettings('app_icon');
IOSInitializationSettings iosInitializationSettings =
IOSInitializationSettings();
final InitializationSettings initializationSettings =
InitializationSettings(
android: androidInitializationSettings,
iOS: iosInitializationSettings);
await flutterLocalNotificationsPlugin.initialize(initializationSettings);
}
//Instant Notifications
Future instantNofitication() async {
var android = AndroidNotificationDetails('id', 'channel', 'description');
var ios = IOSNotificationDetails();
var platform = new NotificationDetails(android: android, iOS: ios);
await _flutterLocalNotificationsPlugin.show(
0,
'Demo instant notification',
'Tap to do something',
platform,
payload: 'Welcome to demo app',
);
}
What am I missing here?
You can try setting the importance level of the notification to a maximum with this line:
importance: Importance.max
which you add to the AndroidNotificationDetails class instance. This will tell to an Android OS that notification is important for the user and a heads-up display (a little popup) on top of the screen should be displayed for a few seconds.
I think that will solve your problem after reading an Android notification documentation
Adding on to #Antonio Valentic's answer, add the following properties to the AndroidNotificationDetails
importance: Importance.max,
priority: Priority.max,
fullScreenIntent: true,
enableVibration: true,
playSound: true
As quoted from the link:
The user's activity is in fullscreen mode (the app uses fullScreenIntent).
The notification has high priority and uses ringtones or vibrations
on devices running Android 7.1 (API level 25) and lower.
The notification channel has high importance on devices running Android 8.0 (API level 26) and higher.
Related
I am trying to implement local Firebase notifications in background in Android with Flutter.
Following this tutorial, I was able to get my notifications successfully set up when the app is in foreground. But while the app is in background, I do see the local notifications, but also the original notifications sent by Firebase (which I do not see while the app is in foreground).
This is a problem. Since our server sends multiple notifications, and I am implementing android_local_notifications to filter through them, and show only selected ones though local notification channel.
This is my implementation:
void main() {
// Register local notification channel
static final AndroidNotificationChannel androidChannel =
AndroidNotificationChannel(
'android_local_notifications',
'Android Local Notifications',
description: 'Used to show foreground notifications on Android.',
importance: Importance.max,
);
static final AndroidInitializationSettings initializationSettingsAndroid =
AndroidInitializationSettings('mipmap/ic_launcher');
await flutterLocalNotificationsPlugin
.resolvePlatformSpecificImplementation<
AndroidFlutterLocalNotificationsPlugin>()
?.createNotificationChannel(androidChannel);
flutterLocalNotificationsPlugin.initialize(
InitializationSettings(android: initializationSettingsAndroid, iOS: null),
);
// set up on background
FirebaseMessaging.onBackgroundMessage(_firebaseMessagingBackgroundHandler);
runApp(MyApp());
}
/// Handle background messages by registering a onBackgroundMessage handler.
/// When messages are received, an isolate is spawned (Android only, iOS/macOS does not require a separate isolate) allowing you to handle messages even when your application is not running.
/// https://firebase.google.com/docs/cloud-messaging/flutter/receive
#pragma('vm:entry-point')
Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
// Initialize firebase
await Firebase.initializeApp();
// Creates a local notification
flutterLocalNotificationsPlugin.show(
notificationHashCode,
translatedTitleString,
translatedBodyString,
NotificationDetails(
android: AndroidNotificationDetails(
androidChannel.id,
androidChannel.name,
channelDescription: androidChannel.description,
),
),
);
}
Manifest:
<receiver android:name="com.dexterous.flutterlocalnotifications.ScheduledNotificationBootReceiver"
android:exported="true" tools:replace="android:exported"/>
How do I get to hide the original Firebase pushes while the app is in background?
I've had several issues migrating from react native firebase v5 to v6. It seems that there's no notifications() method in v6. How to properly display the notifications in foreground with react native firebase v6?
my code with v5 works:
async listenToPushNots(){
firebase.notifications().onNotificationDisplayed(notification => {
console.log("XXXXX onNotificationDisplayed", notification);
});
firebase.notifications().onNotification(notification => {
//remote notification received
console.log("XXXXX LISTENER onNotification", notification);
// notification.android.setChannelId(notification._notificationId);
// firebase.notifications().displayNotification(notification);
const localNotification = new firebase.notifications.Notification({
sound: "default",
show_in_foreground: true,
show_in_background: true
})
.setNotificationId(notification._notificationId)
.setTitle(notification._data.title)
.setSubtitle(notification._data.body)
.setBody(notification._data.body)
.setData(notification._data)
.android.setChannelId("my-app-channel")
.android.setSmallIcon("ic_stat_ic_notif") // create this icon in Android Studio
.android.setLargeIcon("ic_launcher_round")
.android.setColor("#000000") // you can set a color here
.android.setPriority(firebase.notifications.Android.Priority.High);
firebase
.notifications()
.displayNotification(localNotification)
.catch(err => console.error(err));
}
async componentDidMount(){
listenToPushNots();
}
In v6 how would firebase.notifications() be replaced? There is no reference in their official docs on how to properly migrate (https://rnfirebase.io/messaging/notifications). The messaging() method does not include notifications unlike v5.
As you can see from their documentation (https://rnfirebase.io/messaging/usage), you can't use react-native-firebase v6 for foreground notification:
The best way to add foreground notification, is to add https://github.com/zo0r/react-native-push-notification
I am using react native firebase library for push notification and i am playing two different sound for two different notification so i am playing some .mp3 sound for one notification and default for other one so problem is app is playing only that sound which is coming in first notification for app and for rest notification playing the first played sound so I think the issue is notification information is not updating that's what it is playing the same sound for all the notification which app got for first notification.even we are getting right information in notification data but it is not updating the sound.
Version:
react-native-firebase:"4.3.8"
react-native:"0.56.1"
yes I am getting data from firebase and below is my code to set Sound for notification.
this.notificationListener = firebase
.notifications()
.onNotification((notification: Notification) => {
const channel = new firebase.notifications.Android.Channel(
'test-channel',
'Test Channel',
firebase.notifications.Android.Importance.Max
).setDescription('My apps test channel');
if (notification && notification.data) {
const data = notification.data;
if (data && data.messageKey) {
//here I set the sound on basis of notification data to the channel
...
}
}
// Create the channel
firebase.notifications().android.createChannel(channel);
// Process your notification as required
notification
.android.setChannelId('test-channel')
.android.setSmallIcon(Images.logoSmall);
firebase.notifications()
.displayNotification(notification);
});
1) In android, add your custom sound file to [project_root]/android/app/src/main/res/raw
2) Create notification channel
const channel = new firebase.notifications.Android.Channel('channel_name', 'channel_name', firebase.notifications.Android.Importance.High)
.setDescription('channel_name')
3) Add sound into notification .setSound('default')
firebase.notifications().android.createChannel(channel);
const localNotification = new firebase.notifications.Notification({
sound: 'default',
show_in_foreground: true,
})
.setNotificationId(new Date().valueOf().toString())
.setTitle(noti_payload.title)
.setSound('default')
.setBody(noti_payload.message)
.setData({
now: new Date().toISOString(),
payload: noti_payload,
})
.android.setAutoCancel(true)
.android.setBigText(noti_payload.message)
.android.setLargeIcon('ic_launchers')
.android.setVibrate(1000)
.android.setColor('#74c900')
.android.setColorized(true)
.android.setChannelId('channel_name') // e.g. the id you chose above
.android.setSmallIcon('ic_launchers') // create this icon in Android Studio
.android.setPriority(firebase.notifications.Android.Priority.High);
firebase
.notifications()
.displayNotification(localNotification)
Important Note:-
After doing above step please uninstall app and delete bundles, because some time cached bundle asset contain default sound and changes are not reflected.
every time you change sound you need to build bundle again
Please check following link also
https://rnfirebase.io/docs/v4.0.x/notifications/reference/Notification
setSound() was deprecated in API 26. Use NotificationChannel.setSound() instead.
I'm using flutter_local_notifications, and to create a notfication (let's focus on android ) you do the following:
var androidPlatformChannelSpecifics =
new AndroidNotificationDetails(
'your other channel id',
'your other channel name',
'your other channel description');
var iOSPlatformChannelSpecifics =
new IOSNotificationDetails();
NotificationDetails platformChannelSpecifics = new NotificationDetails(
androidPlatformChannelSpecifics, iOSPlatformChannelSpecifics);
As you can see in the android case you provide 3 parameters related to a channel
So my quesiton is what this channel is used for and why in android we need to provide an id, a name and a description to it ?
notification channels give us the ability to group notifications and let user interact with those channels.
Let's assume you are building a chat application, you can group messages coming from Alice under channel channel-alice, and you can only mute channel-alice or do different actions to it.
Channels are required after API level 26.
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.