PushNotificationIOS
Handle push notifications for your app, including permission handling and
icon badge number.
To get up and running, configure your notifications with Apple
and your server-side system. To get an idea, this is the Parse guide.
To enable support for notification
and register
events you need to augment your AppDelegate.
At the top of your AppDelegate.m
:
#import "RCTPushNotificationManager.h"
And then in your AppDelegate implementation add the following:
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
[RCTPushNotificationManager application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
}
- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)notification
{
[RCTPushNotificationManager application:application didReceiveRemoteNotification:notification];
}
Methods #
static presentLocalNotification(details: Object) #
Schedules the localNotification for immediate presentation.
details is an object containing:
alertBody
: The message displayed in the notification alert.
static scheduleLocalNotification(details: Object) #
Schedules the localNotification for future presentation.
details is an object containing:
fireDate
: The date and time when the system should deliver the notification.alertBody
: The message displayed in the notification alert.
static cancelAllLocalNotifications() #
Cancels all scheduled localNotifications
static setApplicationIconBadgeNumber(number: number) #
Sets the badge number for the app icon on the home screen
static getApplicationIconBadgeNumber(callback: Function) #
Gets the current badge number for the app icon on the home screen
static addEventListener(type: string, handler: Function) #
Attaches a listener to remote notification events while the app is running
in the foreground or the background.
Valid events are:
notification
: Fired when a remote notification is received. The
handler will be invoked with an instance of PushNotificationIOS
.register
: Fired when the user registers for remote notifications. The
handler will be invoked with a hex string representing the deviceToken.
static requestPermissions(permissions?: {
alert?: boolean,
badge?: boolean,
sound?: boolean
}) #
Requests notification permissions from iOS, prompting the user's
dialog box. By default, it will request all notification permissions, but
a subset of these can be requested by passing a map of requested
permissions.
The following permissions are supported:
If a map is provided to the method, only the permissions with truthy values
will be requested.
static abandonPermissions() #
Unregister for all remote notifications received via Apple Push Notification service.
You should call this method in rare circumstances only, such as when a new version of
the app removes support for all types of remote notifications. Users can temporarily
prevent apps from receiving remote notifications through the Notifications section of
the Settings app. Apps unregistered through this method can always re-register.
static checkPermissions(callback: Function) #
See what push permissions are currently enabled. callback
will be
invoked with a permissions
object:
alert
:booleanbadge
:booleansound
:boolean
static removeEventListener(type: string, handler: Function) #
Removes the event listener. Do this in componentWillUnmount
to prevent
memory leaks
static popInitialNotification() #
An initial notification will be available if the app was cold-launched
from a notification.
The first caller of popInitialNotification
will get the initial
notification object, or null
. Subsequent invocations will return null.
constructor(nativeNotif: Object) #
You will never need to instantiate PushNotificationIOS
yourself.
Listening to the notification
event and invoking
popInitialNotification
is sufficient
getMessage() #
An alias for getAlert
to get the notification's main message string
getSound() #
Gets the sound string from the aps
object
getAlert() #
Gets the notification's main message from the aps
object
getBadgeCount() #
Gets the badge count number from the aps
object
getData() #
Gets the data object on the notif
'use strict';
var React = require('react-native');
var {
AlertIOS,
PushNotificationIOS,
StyleSheet,
Text,
TouchableHighlight,
View,
} = React;
var Button = React.createClass({
render: function() {
return (
<TouchableHighlight
underlayColor={'white'}
style={styles.button}
onPress={this.props.onPress}>
<Text style={styles.buttonLabel}>
{this.props.label}
</Text>
</TouchableHighlight>
);
}
});
class NotificationExample extends React.Component {
componentWillMount() {
PushNotificationIOS.addEventListener('notification', this._onNotification);
}
componentWillUnmount() {
PushNotificationIOS.removeEventListener('notification', this._onNotification);
}
render() {
return (
<View>
<Button
onPress={this._sendNotification}
label="Send fake notification"
/>
</View>
);
}
_sendNotification() {
require('RCTDeviceEventEmitter').emit('remoteNotificationReceived', {
aps: {
alert: 'Sample notification',
badge: '+1',
sound: 'default',
category: 'REACT_NATIVE'
},
});
}
_onNotification(notification) {
AlertIOS.alert(
'Notification Received',
'Alert message: ' + notification.getMessage(),
[{
text: 'Dismiss',
onPress: null,
}]
);
}
}
class NotificationPermissionExample extends React.Component {
constructor(props) {
super(props);
this.state = {permissions: null};
}
render() {
return (
<View>
<Button
onPress={this._showPermissions.bind(this)}
label="Show enabled permissions"
/>
<Text>
{JSON.stringify(this.state.permissions)}
</Text>
</View>
);
}
_showPermissions() {
PushNotificationIOS.checkPermissions((permissions) => {
this.setState({permissions});
});
}
}
var styles = StyleSheet.create({
button: {
padding: 10,
alignItems: 'center',
justifyContent: 'center',
},
buttonLabel: {
color: 'blue',
},
});
exports.title = 'PushNotificationIOS';
exports.description = 'Apple PushNotification and badge value';
exports.examples = [
{
title: 'Badge Number',
render(): React.Component {
PushNotificationIOS.requestPermissions();
return (
<View>
<Button
onPress={() => PushNotificationIOS.setApplicationIconBadgeNumber(42)}
label="Set app's icon badge to 42"
/>
<Button
onPress={() => PushNotificationIOS.setApplicationIconBadgeNumber(0)}
label="Clear app's icon badge"
/>
</View>
);
},
},
{
title: 'Push Notifications',
render(): React.Component {
return <NotificationExample />;
}
},
{
title: 'Notifications Permissions',
render(): React.Component {
return <NotificationPermissionExample />;
}
}];