how to display image in ios push notification?

If you want to customize the appearance of local and remote notifications, perform the following steps:

  1. Create a UNNotificationCategory and add to the UNUserNotificationCenter category:

    let newCategory = UNNotificationCategory(identifier: "newCategory",
                                             actions: [ action ],
                                             minimalActions: [ action ],
                                             intentIdentifiers: [],
                                             options: [])
    
    let center = UNUserNotificationCenter.current()
    
    center.setNotificationCategories([newCategory])
    
  2. Create a UNNotificationContentExtension:

enter image description here

then use code or storyboard to customize your UIViewController.

  1. Add category to UNNotificationContentExtension‘s plist:

enter image description here

4.Push Notification

Local Notification

Create a UNMutableNotificationContent and set the categoryIdentifier to “newCategory” which includes UNUserNotificationCenter‘s categories and UNNotificationContentExtension‘s plist:

let content = UNMutableNotificationContent()
content.title = ...
content.body = ...
content.categoryIdentifier = "newCategory"

let request = UNNotificationRequest.init(identifier: "newNotificationRequest", content: content, trigger: nil)

let center = UNUserNotificationCenter.current()
center.add(request)

Remote Notification

Set "mutable-content : 1" and "category : newCategory". Note that the category value is set to “newCategory” which matches what you previously added to UNUserNotificationCenter and UNNotificationContentExtensions plist.

Example:

 {
    "aps" : {
        "alert" : {
        "title" : "title",
        "body" : "Your message Here"
        },
        "mutable-content" : "1",
        "category" : "newCategory"
    },
    "otherCustomURL" : "http://www.xxx.jpg"
 }
  1. Note: you need a device or simulator which supports 3DTouch, otherwise you can’t show a custom UNNotificationContentExtension viewcontroller.(In iOS10 Beta1, it`s not work. But now this work without 3d touch)

And … if you just want to show an image on a push notification displayed on the lock screen, you need to add UNNotificationAttachment:

let content = UNMutableNotificationContent()
content.title = ...
content.body = ...
content.categoryIdentifier = "newCategory"

let fileURL: URL = ... //  your disk file url, support image, audio, movie

let attachement = try? UNNotificationAttachment(identifier: "attachment", url: fileURL, options: nil)
content.attachments = [attachement!]

let request = UNNotificationRequest.init(identifier: "newNotificationRequest", content: content, trigger: nil)

let center = UNUserNotificationCenter.current()
center.add(request)

enter image description here

For more detail feature,Demo

Leave a Comment