सामग्री पर जाएं
उपयोगकर्ता गाइड कैसे करें गाइड सहायता डेमो अनुरोध करें साइन इन करें
Pushwoosh.com

Pushwoosh इनबॉक्स UI एंड्रॉयड सेटअप करना

Pushwoosh इनबॉक्स UI, Pushwoosh इनबॉक्स बैकएंड के ऊपर एक रेडी-मेड एंड्रॉयड इनबॉक्स स्क्रीन (“बेल आइकन” ऐप इनबॉक्स) प्रदान करता है। यह पांच कार्ड प्रकारों में से एक में संदेशों को रेंडर करता है, इनलाइन CTA बटन्स का समर्थन करता है, और XML एट्रिब्यूट्स या कोड के माध्यम से स्टाइल कस्टमाइज़ेशन के लिए खुला है।

आवश्यक शर्तें

Anchor link to
  • बेस Pushwoosh एंड्रॉयड SDK पहले से ही इंटीग्रेटेड है और पुश भेज रहा है।
  • आपके ऐप मॉड्यूल में कोटलिन सपोर्ट (apply plugin: 'kotlin-android')।

लाइब्रेरी जोड़ें

Anchor link to

अपने ऐप के build.gradle में कोटलिन प्लगइन और दो Pushwoosh मॉड्यूल जोड़ें:

build.gradle
apply plugin: 'kotlin-android'


dependencies {
    implementation 'com.pushwoosh:pushwoosh-inbox:6.+'
    implementation 'com.pushwoosh:pushwoosh-inbox-ui:6.+'
}

pushwoosh-inbox और pushwoosh-inbox-ui को अपनी मौजूदा com.pushwoosh:pushwoosh डिपेंडेंसी के समान संस्करण पर पिन करें। + को Pushwoosh एंड्रॉयड SDK के वर्तमान संस्करण से बदलें।

यदि आपका ऐप कोड श्रिंकिंग के लिए ProGuard का उपयोग करता है, तो इनबॉक्स प्लगइन क्लास को रखें:

proguard-rules.pro
-keep public class com.pushwoosh.inbox.PushwooshInboxPlugin {
 *;
}

इनबॉक्स दिखाएं

Anchor link to

इनबॉक्स को एक स्टैंडअलोन स्क्रीन के रूप में प्रस्तुत करें, या इसे अपने लेआउट के अंदर एक फ्रैगमेंट के रूप में एम्बेड करें।

एक एक्टिविटी के रूप में:

startActivity(Intent(this, InboxActivity::class.java))

एक फ्रैगमेंट के रूप में:

supportFragmentManager.beginTransaction()
    .replace(R.id.inboxContainer, PushwooshInboxUi.createInboxFragment())
    .commitAllowingStateLoss()

कार्ड के प्रकार

Anchor link to

इनबॉक्स UI प्रत्येक संदेश के लिए एक कार्ड प्रकार का समाधान करता है। रिज़ॉल्वर पुश पेलोड के data ऑब्जेक्ट से displayType पढ़ता है, जिसे SDK actionParams के तहत डिलीवर करता है। एक displayType जो एक ज्ञात कार्ड प्रकार का नाम देता है, हमेशा उस प्रकार को रेंडर करता है, और केवल classic पर वापस जाता है यदि प्रकार के आवश्यक फ़ील्ड गायब हैं। यह रिज़ॉल्यूशन नीचे दी गई ह्यूरिस्टिक सेटिंग पर निर्भर नहीं करता है।

जब displayType अनुपस्थित होता है, तो संदेश एक सादे पंक्ति के रूप में रेंडर होता है जब तक कि आप इमेज/टेक्स्ट ह्यूरिस्टिक का विकल्प नहीं चुनते:

PushwooshInboxStyle.richCardsHeuristicEnabled = true

ह्यूरिस्टिक चालू होने पर, बिना शीर्षक वाली एक इमेज banner रेंडर करती है, शीर्षक और बॉडी वाली एक इमेज captioned रेंडर करती है, और बाकी सब कुछ classic पर वापस आ जाता है।

displayTypeदिखावटआवश्यक पेलोड फ़ील्डइसमें बदल जाता है
bannerफुल-ब्लीड इमेज, कोई टेक्स्ट नहींइमेज (संदेश आइकन या data.attachment)जब कोई इमेज न हो तो classic
captionedऊपर इमेज, नीचे शीर्षक + बॉडीइमेज, संदेश title और contentजब इमेज, शीर्षक या बॉडी गायब हो तो classic
classicआइकन + शीर्षक + बॉडी— (शीर्षक, बॉडी और आइकन अपेक्षित)—
carouselस्वाइप करने योग्य मल्टी-इमेज गैलरीसंदेश title और content, data.carousel (1–5 स्लाइड्स)जब कोई स्लाइड न हो या कोई शीर्षक/बॉडी न हो तो classic
videoप्ले बैज के साथ पोस्टर, टैप पर फुल-स्क्रीन प्लेयरdata.video (url + वैकल्पिक poster)जब कोई डिस्क्रिप्टर न हो तो classic

iOS InboxKit से Apple Wallet कार्ड का कोई एंड्रॉयड समकक्ष नहीं है। displayType: "wallet" वाला संदेश हमेशा एंड्रॉयड पर classic के रूप में रेंडर होता है।

कैरोसेल कार्ड

Anchor link to

स्लाइड्स data.carousel में रहती हैं। प्रत्येक स्लाइड को एक image की आवश्यकता होती है। title (कैप्शन ओवरले) और url (टैप पर खोला गया) वैकल्पिक हैं। बिना इमेज वाली स्लाइड को छोड़ दिया जाता है, और अधिकतम 5 स्लाइड दिखाई जाती हैं।

POST https://api.pushwoosh.com/json/1.3/createMessage
{
  "request": {
    "application": "XXXXX-XXXXX",
    "auth": "API_TOKEN",
    "notifications": [{
      "send_date": "now",
      "content": "Swipe through this week's drops",
      "inbox_days": 7,
      "data": {
        "displayType": "carousel",
        "carousel": [
          { "image": "https://cdn.example.com/inbox/1.jpg", "title": "New in", "url": "myapp://product/1" },
          { "image": "https://cdn.example.com/inbox/2.jpg", "title": "On sale", "url": "myapp://product/2" }
        ]
      },
      "platforms": [3]
    }]
  }
}

वीडियो कार्ड

Anchor link to

डिस्क्रिप्टर data.video में रहता है: url आवश्यक है, poster एक वैकल्पिक पूर्वावलोकन इमेज है। पोस्टर पर टैप करने से एक फुल-स्क्रीन प्लेयर खुलता है।

POST https://api.pushwoosh.com/json/1.3/createMessage
{
  "request": {
    "application": "XXXXX-XXXXX",
    "auth": "API_TOKEN",
    "notifications": [{
      "send_date": "now",
      "content": "Tap to play",
      "inbox_days": 7,
      "data": {
        "displayType": "video",
        "video": {
          "url": "https://cdn.example.com/inbox/clip.mp4",
          "poster": "https://cdn.example.com/inbox/poster.jpg"
        }
      },
      "platforms": [3]
    }]
  }
}

संदेश से कस्टम डेटा पढ़ें

Anchor link to

एक पुश को इनबॉक्स में दिखाने के लिए, Messages API createMessage अनुरोध में inbox_image, inbox_date, या inbox_days शामिल होना चाहिए। इन फ़ील्ड्स में से किसी एक के बिना, पुश एक नियमित सूचना के रूप में डिलीवर होता है और कभी भी इनबॉक्स फ़ीड तक नहीं पहुंचता है। फ्री-फॉर्म कस्टम डेटा data के तहत जाता है, जिसे SDK InboxMessage पर actionParams के रूप में उजागर करता है:

PushwooshInboxUi.onMessageClickListener = OnInboxMessageClickListener { message ->
    val params = message.actionParams?.let { JSONObject(it) }
    val promoId = params?.optString("promo_id")
    if (!promoId.isNullOrEmpty()) {
        navigateToPromo(promoId)
    }
}

इनलाइन CTA बटन जोड़ें

Anchor link to

एक संदेश data.buttons के अंदर इनलाइन कॉल-टू-एक्शन बटन ले जा सकता है:

POST https://api.pushwoosh.com/json/1.3/createMessage
{
  "request": {
    "application": "XXXXX-XXXXX",
    "auth": "API_TOKEN",
    "notifications": [{
      "send_date": "now",
      "content": "Tap a button to claim or save",
      "inbox_image": "https://cdn.example.com/inbox/promo.png",
      "inbox_days": 7,
      "data": {
        "displayType": "captioned",
        "promo_id": "SUMMER2026",
        "buttons": [
          { "title": "Claim", "url": "https://example.com/promo/SUMMER2026" },
          { "title": "Read",  "action": "markRead" },
          { "title": "Save",  "action": "custom", "tag": "save_promo" }
        ]
      },
      "platforms": [3]
    }]
  }
}

प्रत्येक बटन को एक title की आवश्यकता होती है। रिज़ॉल्यूशन इस प्राथमिकता का पालन करता है:

  • action को dismiss या markRead (केस-असंवेदनशील) पर सेट करने से वह क्रिया चलती है।
  • अन्यथा, एक गैर-खाली, पार्स करने योग्य url एक openURL क्रिया में हल हो जाता है।
  • अन्यथा, टैप एक कस्टम क्रिया में हल हो जाता है, और बटन ऑब्जेक्ट पर प्रत्येक अतिरिक्त कुंजी आपके श्रोता को उसके पेलोड के रूप में अग्रेषित की जाती है।

PushwooshInboxUi.onButtonClickListener से टैप को इंटरसेप्ट करें। SDK को बटन की डिफ़ॉल्ट क्रिया करने देने के लिए true लौटाएं, इसे दबाने के लिए false:

PushwooshInboxUi.onButtonClickListener = OnInboxButtonClickListener { message, button ->
    when (val action = button.action) {
        is InboxCardButton.Action.OpenUrl -> true
        InboxCardButton.Action.Dismiss, InboxCardButton.Action.MarkRead -> true
        is InboxCardButton.Action.Custom -> {
            when (action.payload.optString("tag")) {
                "save_promo" -> saveCurrentPromoLocally(message)
            }
            true
        }
    }
}

स्टाइल को कस्टमाइज़ करें

Anchor link to

PushwooshInboxStyle के माध्यम से कोड से रंग, फ़ॉन्ट और खाली/त्रुटि स्थितियों को सेट करें:

PushwooshInboxStyle.accentColor = ContextCompat.getColor(this, R.color.brand_accent)
PushwooshInboxStyle.titleColor = ContextCompat.getColor(this, R.color.brand_title)
PushwooshInboxStyle.listEmptyText = "You have no messages yet"
PushwooshInboxStyle.showToolbar = false

या attrs.xml में सूचीबद्ध एट्रिब्यूट्स के समान सेट को एक थीम के रूप में लागू करें: inboxAccentColor, inboxTitleColor, inboxBackgroundColor, inboxDefaultIcon, और बाकी रंग और उपस्थिति एट्रिब्यूट्स। दोनों दृष्टिकोण, साथ ही एक पूर्ण नमूना ऐप, pushwoosh-inbox-ui-android-sdk InboxSample रेपो में हैं।

अपठित संदेशों का बैज

Anchor link to
PushwooshInbox.unreadMessagesCount { result ->
    if (result.isSuccess) {
        val count = result.data
    } else {
        Log.e("App", "Failed to get unread count", result.exception)
    }
}