Einrichten der Message Inbox für React Native

Das Pushwoosh React Native Plugin liefert die Message Inbox (die „Glockensymbol“ App Inbox) als Teil desselben pushwoosh-react-native-plugin-Pakets, das auch für Push-Benachrichtigungen verwendet wird. Es ist kein zusätzlicher Installationsschritt erforderlich.

Voraussetzungen

Das Basis-Pushwoosh React Native SDK ist bereits integriert und sendet Pushes.

Die Inbox anzeigen

import Pushwoosh from 'pushwoosh-react-native-plugin';

Pushwoosh.presentInboxUI();

presentInboxUI() präsentiert einen nativen Bildschirm (einen View Controller unter iOS, eine Activity unter Android) außerhalb des React-View-Baums, mit dem Standardaussehen des SDKs.

Den Stil anpassen

Übergeben Sie ein Stilobjekt an presentInboxUI(). Farbwerte müssen über processColor() von React Native verarbeitet werden. Jeder Schlüssel ist optional:

Schlüssel	Passt an
`dateFormat`	Datumsformatierung
`defaultImageIcon`	Das Standardsymbol neben einer Nachricht ohne Bild
`unreadImage`	Die Markierung für ungelesene Nachrichten (nur iOS)
`listErrorImage`	Wird angezeigt, wenn das Laden der Liste fehlschlägt
`listEmptyImage`	Wird angezeigt, wenn die Liste keine Nachrichten enthält
`listErrorMessage`	Fehlertext (nicht lokalisiert)
`listEmptyMessage`	Text für leere Liste (nicht lokalisiert)
`defaultTextColor`	Standardtextfarbe (nur iOS)
`accentColor`	Akzentfarbe
`backgroundColor`	Hintergrundfarbe
`highlightColor`	Hervorhebungsfarbe
`titleColor`	Farbe des Nachrichtentitels
`readTitleColor`	Titelfarbe für gelesene Nachrichten (nur Android)
`descriptionColor`	Farbe der Nachrichtenbeschreibung
`readDescriptionColor`	Beschreibungsfarbe für gelesene Nachrichten (nur Android)
`dateColor`	Farbe des Nachrichtendatums
`readDateColor`	Datumsfarbe für gelesene Nachrichten (nur Android)
`dividerColor`	Trennlinienfarbe
`barBackgroundColor`	Die Hintergrundfarbe der Titelleiste
`barAccentColor`	Die Farbe des Zurück-Buttons der Titelleiste
`barTextColor`	Die Textfarbe der Titelleiste

import Pushwoosh from 'pushwoosh-react-native-plugin';
import { processColor } from 'react-native';

Pushwoosh.presentInboxUI({
    dateFormat: "dd.MM.yyyy",
    accentColor: processColor('#3498db'),
    backgroundColor: processColor('#ffffff'),
    titleColor: processColor('#333333'),
    descriptionColor: processColor('#666666'),
    listEmptyMessage: "Noch keine Nachrichten"
});

Nachrichten programmatisch verwalten

Laden Sie die Nachrichtenliste, die Anzahl der gelesenen Nachrichten und reagieren Sie auf einzelne Nachrichten, ohne den integrierten Bildschirm zu öffnen. Dies ist nützlich für eine benutzerdefinierte Inbox-Benutzeroberfläche oder ein Abzeichen für ungelesene Nachrichten:

Pushwoosh.loadMessages(
    (messages) => {
        messages.forEach((msg) => {
            console.log(msg.title + ": " + msg.message);
        });
    },
    (error) => console.error("Laden fehlgeschlagen: " + error)
);

Pushwoosh.unreadMessagesCount((count) => {
    console.log("Ungelesene Nachrichten: " + count);
});

Pushwoosh.messagesCount((count) => { /* Gesamtzahl der Nachrichten */ });
Pushwoosh.messagesWithNoActionPerformedCount((count) => { /* noch keine Aktion ausgeführt */ });

Pushwoosh.readMessage(messageId);
Pushwoosh.deleteMessage(messageId);
Pushwoosh.performAction(messageId); // führt die Standardaktion der Nachricht aus, z. B. das Öffnen einer URL