إعداد صندوق الرسائل لـ React Native
تأتي إضافة Pushwoosh React Native مع صندوق الرسائل (Message Inbox) (أيقونة الجرس “App Inbox”) كجزء من نفس حزمة pushwoosh-react-native-plugin المستخدمة للإشعارات الفورية. لا حاجة لخطوة تثبيت إضافية.
المتطلبات الأساسية
Anchor link to- SDK الأساسي لـ Pushwoosh React Native مدمج بالفعل ويرسل الإشعارات.
عرض الصندوق الوارد
Anchor link toimport Pushwoosh from 'pushwoosh-react-native-plugin';
Pushwoosh.presentInboxUI();تعرض presentInboxUI() شاشة أصلية (view controller على iOS، و Activity على Android) خارج شجرة عرض React، بالمظهر الافتراضي لـ SDK.
تخصيص النمط
Anchor link toمرر كائن نمط إلى presentInboxUI(). يجب أن تمر قيم الألوان عبر processColor() الخاصة بـ React Native. كل مفتاح اختياري:
| المفتاح | ما يخصصه |
|---|---|
dateFormat | تنسيق التاريخ |
defaultImageIcon | الأيقونة الافتراضية بجانب الرسالة التي لا تحتوي على صورة |
unreadImage | علامة الرسائل غير المقروءة (iOS فقط) |
listErrorImage | تُعرض عند فشل تحميل القائمة |
listEmptyImage | تُعرض عندما لا تحتوي القائمة على رسائل |
listErrorMessage | نص الخطأ (غير مترجم) |
listEmptyMessage | نص القائمة الفارغة (غير مترجم) |
defaultTextColor | لون النص الافتراضي (iOS فقط) |
accentColor | لون التمييز |
backgroundColor | لون الخلفية |
highlightColor | لون التحديد |
titleColor | لون عنوان الرسالة |
readTitleColor | لون العنوان للرسائل المقروءة (Android فقط) |
descriptionColor | لون وصف الرسالة |
readDescriptionColor | لون الوصف للرسائل المقروءة (Android فقط) |
dateColor | لون تاريخ الرسالة |
readDateColor | لون التاريخ للرسائل المقروءة (Android فقط) |
dividerColor | لون الفاصل |
barBackgroundColor | لون خلفية شريط العنوان |
barAccentColor | لون زر الرجوع في شريط العنوان |
barTextColor | لون نص شريط العنوان |
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: "No messages yet"});إدارة الرسائل برمجيًا
Anchor link toقم بتحميل قائمة الرسائل، وعدد الرسائل المقروءة، والتصرف في الرسائل الفردية دون فتح الشاشة المدمجة. هذا مفيد لواجهة مستخدم مخصصة للصندوق الوارد أو شارة غير مقروءة:
Pushwoosh.loadMessages( (messages) => { messages.forEach((msg) => { console.log(msg.title + ": " + msg.message); }); }, (error) => console.error("Failed to load: " + error));
Pushwoosh.unreadMessagesCount((count) => { console.log("Unread messages: " + count);});
Pushwoosh.messagesCount((count) => { /* total messages */ });Pushwoosh.messagesWithNoActionPerformedCount((count) => { /* not yet acted on */ });
Pushwoosh.readMessage(messageId);Pushwoosh.deleteMessage(messageId);Pushwoosh.performAction(messageId); // runs the message's default action, e.g. opening a URL