comment afficher une image dans une notification push ios ?

Question

IOS 10 a introduit des mises à jour du cadre des notifications push,

UserNotificationsUI.framework

Comme écrit dans la documentation d'Apple, il nous permet de personnaliser l'apparence des notifications locales et distantes lorsqu'elles apparaissent sur l'appareil de l'utilisateur.

Donc, si quelqu'un a une idée de comment afficher l'image dans la notification push quand sur l'écran de verrouillage. même comme la notification push andorid font.

Merci,

Answer 1

Si vous souhaitez personnaliser l'apparence des notifications locales et distantes, procédez comme suit

1. Créer un UNNotificationCategory et ajouter à la UNUserNotificationCenter catégorie :

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

2. Créer une UNNotificationContentExtension :

puis utilisez le code ou le storyboard pour personnaliser votre UIViewController .

3. Ajouter une catégorie à UNNotificationContentExtension s plist :

4. notification push

Notification locale

Créer un UNMutableNotificationContent et définir les categoryIdentifier à "newCategory" qui comprend UNUserNotificationCenter et les catégories de l 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)

Notification à distance

Définir "mutable-content : 1" y "category : newCategory" . Notez que la valeur de la catégorie est fixée à "newCategory", ce qui correspond à ce que vous avez ajouté précédemment dans le champ UNUserNotificationCenter y UNNotificationContentExtension s plist.

Ejemplo:

 {
    "aps" : {
        "alert" : {
        "title" : "title",
        "body" : "Your message Here"
        },
        "mutable-content" : "1",
        "category" : "newCategory"
    },
    "otherCustomURL" : "http://www.xxx.jpg"
 }

5. Remarque : vous devez disposer d'un appareil ou d'un simulateur qui prend en charge 3DTouch, sinon vous ne pourrez pas afficher un écran personnalisé. UNNotificationContentExtension Dans iOS10 Beta1, cela ne fonctionne pas. Mais maintenant cela fonctionne sans 3d touch

Et ... si vous voulez simplement afficher une image sur une notification push affichée sur l'écran de verrouillage, vous devez ajouter 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)

Pour plus de détails, Démo

Answer 2

En fait, si vous configurez une notification locale et que vous souhaitez simplement qu'une image apparaisse dans la notification elle-même, vous n'avez pas besoin de vous préoccuper de NotificationsUI.framework ou de UNNotificationContentExtensions. Cela n'est utile que si vous voulez une interface utilisateur personnalisée lorsque l'utilisateur touche ou développe la notification en 3D.

Pour ajouter une image qui se trouve déjà sur l'appareil (soit livrée avec l'application, soit générée/stockée par l'application à un moment donné avant la création de la notification), il suffit d'ajouter un UNNotificationAttachment avec une URL de fichier dont le chemin d'accès se termine par .png (ou .jpg fonctionnera probablement aussi ?). Quelque chose comme ceci :

UNMutableNotificationContent *content = [UNMutableNotificationContent new];
content.title = @"Title";
content.body = @"Body";
content.sound = [UNNotificationSound defaultSound];
NSURL *imageURL = [NSURL URLWithString:@"file:/some/path/in/app/image.png"];
NSError *error;
UNNotificationAttachment *icon = [UNNotificationAttachment attachmentWithIdentifier:@"image" URL:imageURL options:nil error:&error];
if (error)
{
    NSLog(@"error while storing image attachment in notification: %@", error);
}
if (icon)
{
    content.attachments = @[icon];
}

Ensuite, lorsque la notification apparaît, l'image s'affiche sur le côté droit de la bannière de notification, comme c'est le cas pour les notifications de Messages. Et vous n'avez pas besoin de passer par toutes les étapes de la configuration d'une extension de contenu avec un categoryIdentifier, etc.

EDIT : Mis à jour pour ajouter que cette solution n'est valable que pour les notifications locales.

Answer 3

Vous devez faire un peu de travail sur la création de la notification push et aussi quand vous la manipulez.

1. Lorsque vous créez une charge utile, vous devez ajouter un attribut supplémentaire, comme ci-dessous :

   {        
       aps : {
           alert: { },
           mutable-content:1
       }
       my-attachment = "url to resource"
   }

2. Lorsque vous recevrez la notification, le système appellera didReceive extension de la méthode de service, extension de la notification de dérogation didReceive comme ceci

   public func didReceive(_ request:UNNotificationRequest, withContentHandler contentHandler:(UNNotificatinContent) -> Void) {
       let fileUrl = //
       let attachment = UNNotificationAttachment(identifier : "image", url: fileUrl, options: nil)
       let content = request.content.mutableCopy as! UNMutableNotificationContent
       content.attachment = [attachment]
       contentHandler(content)
   }

Ici est le discours vidéo de la WWDC sur ce sujet.

Answer 4

Mettez en œuvre la vue personnalisée de votre notification en utilisant un UIViewController conforme à UNNotificationContentExtension.

Voir https://developer.apple.com/reference/usernotificationsui/unnotificationcontentextension