Image and button display

👍

Expected result of the “Image and button display” step:

On long press, the push notification expands and displays a full-width image and the configured action buttons.

You can verify that the image and action buttons appear on long press by following this guide.

1.Creating the Extension

  1. In Xcode, select File > New > Target.
  2. Choose Notification Content Extension and click Next.
  3. Enter MindboxNotificationContentExtension as the product name, then click Finish.
  4. In the Activate scheme dialog, click Activate.

2. Extension Setup

2.1 iOS Deployment Target

Make sure the iOS Deployment Target versions match for the following targets:

  1. Main target
  2. Service Extension
  3. Content Extension

You can find this setting here: Your Project Name → Targets → Target Name → General → Minimum Deployments → iOS

❗️

The iOS Deployment Target is critical for proper operation of the Service Extension and Content Extension.

Make sure to double-check this setting, especially after upgrading to a new Xcode version.
iOS Deployment Target may update automatically after that, which can cause the Service Extension and Content Extension to stop working correctly.

2.2 App Groups

  1. Open the project settings.

  2. Select the MindboxNotificationContentExtension target.

  3. Go to the Signing & Capabilities tab.

  4. Click + Capability and select App Groups.

  5. Add a new group using the following format: group.cloud.Mindbox.{app bundle ID}

    For example, if the app bundle ID is Maestra-Sample-App, the App Group value should be:
    group.cloud.Mindbox.Maestra-Sample-App

❗️

Configuring an App Group is mandatory for the Mindbox SDK.

Skipping this step may cause the extension to crash when handling push notifications, making the issue hard to debug.

2.3 Extension Signing

The extension must be signed with the same certificate as the main app. If you’re using automatic signing, Xcode will handle this for you. If you’re using manual signing, make sure to create the required certificates for the extension target and configure them in Signing & Capabilities.

2.4. Verifying Rich Push Notifications Using Xcode Debug Builds

In Xcode, go to Target → Build Phases → Embed App Extensions and make sure the Copy only when installing checkbox is unchecked.

❗️

Uncheck this option ONLY if you plan to test Rich Push Notifications using debug builds created directly in Xcode.

3. Adding the SDK to the project

  1. In Xcode, click File → Add Packages in the top menu.
  2. In the dialog that opens, add the Mindbox SDK repository URL https://github.com/mindbox-cloud/ios-sdk and click Add Package.
  3. After the package is downloaded, assign the targets:
  • Add MindboxNotificationsService to the previously created MindboxNotificationServiceExtension
  • Add MindboxNotificationsContent to the previously created MindboxNotificationContentExtension

4. Implementing the Extension Code in the App

To complete the implementation, follow these two steps:

  • Import the library into NotificationViewController.swift file and call MindboxNotificationService().
  • Update the settings in the Info.plist file.
import UserNotificationsUI
import MindboxNotifications

class NotificationViewController: UIViewController, UNNotificationContentExtension {

  lazy var mindboxService: MindboxNotificationContentProtocol = MindboxNotificationService()

  func didReceive(_ notification: UNNotification) {
    mindboxService.didReceive(notification: notification, viewController: self, extensionContext: extensionContext)
  }
}

Configuring Info.plist

In the Info.plist file for MindboxNotificationContent, make the following changes:

  • Remove the NSExtensionMainStoryboardkey;
  • Add the following keys:
KeyValue
NSExtensionPrincipalClass

It is constructed using the following format:
{extension name}.{controller name}

If everything is set up exactly as described, the value should be:
MindboxNotificationContentExtension.NotificationViewController

UNNotificationExtensionCategoryIf you use the basic Service Extension implementation: MindBoxCategoryIdentifier.
UNNotificationExtensionInitialContentSizeRatio0,0001

Example:

Removing MainInterface.storyboard

When you create the extension, a .storyboard file is added to the extension folder. Remove this file, since the UI is handled by our method.

📘

If the approach above doesn’t work for your use case, consider the advanced implementation.
To use a custom Rich Push layout, you need to implement the entire extension code yourself.

There are no specific recommendations for this approach, and no additional methods are required.

👍

Verify the result of the “Image and button display” step:

On long press, the push notification expands and displays a full-width image and the configured action buttons.