Fermer

septembre 5, 2018

Préparer votre application pour iOS 12 Notifications


A propos de l'auteur

Kaya Thomas est ingénieur iOS chez Slack dans l'équipe Messaging. Elle développe pour iOS depuis 2014 et a travaillé chez Time Inc, Intuit et Apple. Kaya est…
En savoir plus sur Kaya

Avec le lancement d'iOS 12, il existe plusieurs nouvelles fonctionnalités de notification telles que de nouvelles options d'autorisation, actions rapides dynamiques et interaction utilisateur dans les notifications. En savoir plus sur la mise en œuvre de ces fonctionnalités et sur leur compatibilité avec votre application.

En 2016, Apple a annoncé une nouvelle extension qui permettra aux développeurs de mieux personnaliser leurs notifications push et locales appelées UNNotificationContentExtension . L'extension est déclenchée lorsqu'un utilisateur appuie longuement sur ou sur une touche 3D lors de l'envoi d'une notification au téléphone ou depuis l'écran de verrouillage / d'accueil. Dans l'extension de contenu, les développeurs peuvent utiliser un contrôleur de vue pour structurer l'interface utilisateur de leur notification, mais aucune interaction utilisateur n'est activée dans le contrôleur de vue – jusqu'à présent. Avec la sortie d'iOS 12 et XCode 10, le contrôleur de vue dans l'extension de contenu permet désormais l'interaction utilisateur ce qui signifie que les notifications deviendront encore plus puissantes et personnalisables.

aux paramètres de notification et comment ils apparaissent sur l'écran d'accueil. Afin de sensibiliser davantage les utilisateurs à l'utilisation des applications et au contrôle de leur utilisation par les utilisateurs, un nouveau paramètre de notification appelé «Livrer silencieusement» est disponible. Les utilisateurs peuvent configurer votre application sur Delivery Quietly depuis le Centre de notifications, ce qui signifie qu'ils ne recevront pas de bannières ni de notifications sonores de votre application, mais qu'ils apparaîtront dans le Centre de notifications. Apple utilisant un algorithme interne, qui suit probablement vos interactions avec les notifications, demandera également aux utilisateurs s'ils souhaitent toujours recevoir des notifications de certaines applications et vous encourage à activer Deliver Quiet ou les désactiver complètement.

Les notifications font l'objet d'une mise à jour importante dans iOS 12 et je n'ai fait qu'effleurer la surface. Dans la suite de cet article, nous passerons en revue le reste des nouvelles fonctionnalités de notification d'iOS 12 et comment vous pouvez les implémenter dans votre propre application.

Lecture recommandée : WWDC Agenda 2018 d'un développeur iOS

Notifications distantes et locales

Il existe deux manières d'envoyer des notifications push à un périphérique: à distance ou localement. Pour envoyer des notifications à distance, vous avez besoin d’un serveur capable d’envoyer des données utiles JSON au service Push Notification d’Apple. Outre une charge utile, vous devez également envoyer le jeton de périphérique et tout autre certificat d'authentification ou jeton qui vérifie que votre serveur est autorisé à envoyer la notification push via Apple. Pour cet article, nous nous concentrons sur les notifications locales qui ne nécessitent pas de serveur séparé. Les notifications locales sont demandées et envoyées via le UNUserNotificationCenter . Nous reviendrons plus tard sur la manière spécifique de faire une demande de notification locale.

Pour envoyer une notification, vous devez d'abord obtenir la permission de l'utilisateur sur qu'ils souhaitent ou non que vous leur envoyiez des notifications. . Avec la sortie d'iOS 12, de nombreux changements ont été apportés aux paramètres de notification et aux autorisations. Pour tester le code vous-même, assurez-vous que la version bêta de Xcode 10 est installée.

Paramètres de notification et autorisations

Livrer tranquillement

Delivery Quietly est la tentative d'Apple de permettre aux utilisateurs de mieux contrôler le bruit qu'ils peuvent recevoir. notifications. Au lieu d'aller dans l'application de paramètres et de rechercher l'application dont vous souhaitez modifier les paramètres de notification, vous pouvez désormais modifier le paramètre directement à partir de la notification. Cela signifie qu'un nombre beaucoup plus important d'utilisateurs peut désactiver les notifications pour votre application ou simplement les distribuer discrètement, ce qui signifie que l'application sera annulée et que les notifications ne s'affichent que dans le Centre de notifications. Si votre application possède ses propres paramètres de notification personnalisés, Apple vous permet de vous connecter directement à cet écran à partir de la vue de gestion des paramètres illustrée ci-dessous.


 iPhone 8 Plus affiché avec Gérer sélectionné à partir des notifications
Livraison silencieuse. ( Grand aperçu )

Pour créer un lien vers votre écran de paramètres de notification personnalisé, vous devez définir ProvideAppNotificationSettings sous la forme UNAuthorizationOption lorsque vous demandez des autorisations de notification dans le délégué d'application.

] didFinishLaunchingWithOptions ajoutez le code suivant:

 UNUserNotificationCenter.current (). requestAuthorization (options: [.alert, .badge, .sound, .providesAppNotificationSettings]) {...}

Lorsque vous cela effectuez, vous verrez maintenant vos paramètres de notification personnalisés à deux endroits:

  • Si l'utilisateur sélectionne Désactiver lorsqu'il va gérer les paramètres directement à partir de la notification;
  • Dans les paramètres de notification dans l'application Paramètres du système.

 L'iPhone 8 Plus s'affiche avec Désactiver sélectionné dans la notification, ce qui ouvre les options Désactiver toutes les notifications et Configurer dans NotificationTester.
notification dans le centre de notification. ( Grand aperçu )

 L'iPhone 8 Plus apparaît avec l'application Paramètres système ouverte avec l'écran Notifications pour l'application NotificationTester.
Lien profond vers les paramètres de notification personnalisés pour NotificationTester depuis l'application Paramètres du système. ( Grand aperçu )

Vous devez également vous assurer de gérer le rappel lorsque l'utilisateur sélectionne l'un ou l'autre moyen pour accéder à vos paramètres de notification. Votre délégué d'application ou une extension de votre délégué d'application doit être conforme au protocole UNUserNotificationCenterDelegate afin de pouvoir implémenter la méthode de rappel suivante:

 func userNotificationCenter (_ center: UNUserNotificationCenter, openSettingsFor notification: UNNotification?) {
    laissez navController = self.window? .rootViewController en tant que! UINavigationController
    let notificationSettingsVC = NotificationSettingsViewController ()
    navController.pushViewController (notificationSettingsVC, animé: true)
} 

Une autre nouvelle option UNAuthorizationOption est une autorisation provisoire. Si cela ne vous dérange pas que vos notifications soient livrées en toute tranquillité, vous pouvez définir add .provisional sur vos options d'autorisation, comme indiqué ci-dessous. Cela signifie que vous n'avez pas à demander à l'utilisateur d'autoriser les notifications – les notifications seront toujours affichées dans le Centre de notifications.

 UNUserNotificationCenter.current (). RequestAuthorization (options: [.alert, .badge, .provisional]) {...}

Maintenant que vous avez déterminé comment demander à l'utilisateur l'autorisation de fournir des notifications et de naviguer entre les utilisateurs pour accéder à vos paramètres personnalisés, examinons plus en détail les notifications réelles.

Envoi de notifications groupées [19659010] Avant d'entrer dans la personnalisation de l'interface utilisateur d'une notification, revenons sur la manière de faire la demande d'une notification locale. Tout d'abord, vous devez enregistrer toute UNNotificationCategory qui sont comme des modèles pour les notifications que vous souhaitez envoyer. Tout ensemble de notifications associé à une catégorie particulière héritera des actions ou options enregistrées avec cette catégorie. Après avoir demandé l'autorisation d'envoyer des notifications dans didFinishLaunchingWithOptions vous pouvez enregistrer vos catégories dans la même méthode.

 let hiddenPreviewsPlaceholder = "% u nouveaux épisodes de podcast disponibles"
let summaryFormat = "% u plus d'épisodes de% @"
let podcastCategory = UNNotificationCategory (identificateur: "podcast", actions: []intentIdentifiers: []hiddenPreviewsBodyPlaceholder: hiddenPreviewsPlaceholder, categorySummaryFormat: summaryFormat, options: [])
UNUserNotificationCenter.current (). SetNotificationCategories ([podcastCategory])

Dans le code ci-dessus, je commence par lancer deux variables:

  • hiddenPreviewsPlaceholder
    Cet espace réservé est utilisé lorsque l'utilisateur a désactivé l'option Afficher les aperçus pour votre application. si nous n'y avons pas de placeholder, votre notification affichera uniquement «Notification» ainsi que le texte.
  • summaryFormat
    Cette chaîne est nouvelle pour iOS 12 et coïncide avec la nouvelle fonctionnalité appelée «Notifications de groupe ”Ce qui aidera le centre de notification à être beaucoup plus propre. Toutes les notifications apparaîtront dans les piles qui représenteront toutes les notifications de l'application ou des groupes spécifiques que le développeur a configurés pour cette application.

Le code ci-dessous montre comment nous associons une notification à un groupe.

 @objc func sendPodcastNotification (pour podcastName: String) {
let content = UNMutableNotificationContent ()
content.body = "Présentation de la saison 7"
content.title = "Nouvel épisode de  (podcastName):"
content.threadIdentifier = podcastName.lowercased ()
content.summaryArgument = podcastName
content.categoryIdentifier = NotificationCategoryType.podcast.rawValue
sendNotification (avec: content)
})

Pour le moment, j'ai codé en dur le texte de la notification pour l'exemple. Le threadIdentifier est ce qui crée les groupes que nous montrons en tant que piles dans le Centre de notifications. Dans cet exemple, je souhaite que les notifications soient regroupées par podcast afin que chaque notification reçue soit séparée par le podcast auquel elle est associée. Le summaryArgument correspond à notre categorySummaryFormat que nous avons défini dans le délégué d'application. Dans ce cas, nous voulons que la chaîne pour le format: "% u plus d'épisodes de% @" soit le nom du podcast. Enfin, nous devons définir l'identifiant de la catégorie pour nous assurer que la notification a le modèle que nous avons défini dans le délégué de l'application.

 func sendNotification (pour la catégorie: String, avec le contenu: UNNotificationContent) {
laisser uuid = UUID (). uuidString
let trigger = UNTimeIntervalNotificationTrigger (timeInterval: 5, répète: false)
let request = UNNotificationRequest (identificateur: uuid, contenu: content, trigger: trigger)
UNUserNotificationCenter.current (). Add (request, withCompletionHandler: nil)
}

La méthode ci-dessus est la façon dont nous demandons que la notification soit envoyée au périphérique. L'identifiant de la requête est juste une chaîne unique aléatoire; le contenu est transmis et nous créons le contenu dans notre méthode sendPodcastNotification et, enfin, le déclencheur correspond à la date d'envoi de la notification. Si vous souhaitez que la notification soit envoyée immédiatement, vous pouvez définir ce paramètre sur zéro.


 Écran de verrouillage de l'iPhone 8 Plus affiché avec une pile de notifications groupées provenant de l'application Notification Tester.
Notifications groupées pour NotificationTester. ( Grand aperçu )

 Écran de verrouillage de l'iPhone 8 Plus affiché avec une pile de notifications groupée provenant de l'application Notification Tester contenant du contenu masqué.
La notification groupée avec les aperçus est désactivée. ( Grand aperçu )

En utilisant les méthodes décrites ci-dessus, voici le résultat sur le simulateur. J'ai un bouton qui a comme cible la méthode sendPodcastNotification . J'ai tapé sur le bouton trois fois pour que les notifications soient envoyées à l'appareil. Dans la première photo, “Afficher les aperçus” est réglé sur “Toujours”. Je vois donc le podcast et le nom des nouveaux épisodes avec le résumé qui montre que j'ai deux nouveaux épisodes à extraire. Lorsque «Afficher les prévisualisations» est réglé sur «Jamais», le résultat est la deuxième image ci-dessus. L'utilisateur ne verra pas quel podcast il doit respecter le paramètre «Pas de prévisualisation», mais il peut encore voir trois nouveaux épisodes à extraire.

Extension du contenu de la notification

Maintenant que nous avons compris comment définir nos catégories de notification et de faire la demande pour les envoyer, nous pouvons voir comment personnaliser l'apparence de la notification en utilisant les extensions Notification Service et Notification Content. L'extension Notification Service vous permet de modifier le contenu de la notification et de télécharger les pièces jointes de votre notification, telles que les images, les fichiers audio ou vidéo. L'extension Notification Content contient un contrôleur de vue et un storyboard qui vous permettent de personnaliser l'apparence de votre notification et de gérer toute interaction utilisateur dans le contrôleur de vue ou d'appuyer sur des actions de notification.

Nouveau → Cible.


 Xcode affiché après avoir sélectionné dans le menu pour ajouter une nouvelle cible, l'extension de contenu de notification est mise en surbrillance.
Ajout d'une nouvelle cible à l'application pour l'extension de contenu de notification. ( Grand aperçu )

Vous ne pouvez les ajouter qu'un par un, nommez donc votre extension et répétez le processus pour ajouter l'autre. Si une fenêtre contextuelle apparaît vous demandant d'activer votre nouveau schéma, cliquez sur le bouton «Activer» pour le configurer pour le débogage.

Pour les besoins de ce tutoriel, nous allons nous concentrer sur l'extension de contenu de notification. Pour les notifications locales, nous pouvons inclure les pièces jointes dans la requête, sur laquelle nous reviendrons plus tard.

Tout d'abord, accédez au fichier Info.plist dans la cible Extension du contenu de notification.


 Info Fichier .plist pour l'extension de contenu de notification indiqué dans Xcode.
Info.plist pour l'extension de contenu de notification. ( Grand aperçu )

Les attributs suivants sont requis:

  • UNNotificationExtensionCategory
    Valeur de chaîne égale à la catégorie de notification que nous avons créée et définie dans le délégué d'application. Cela permettra à l'extension de contenu de savoir à quelle notification vous souhaitez attribuer une interface utilisateur personnalisée.
  • UNNotificationExtensionInitialContentSizeRatio
    Un nombre compris entre 0 et 1 qui détermine le format de votre interface utilisateur. La valeur par défaut est 1, ce qui permettra à votre interface d'avoir sa hauteur totale.

J'ai également défini UNNotificationExtensionDefaultContentHidden sur "YES" pour que la notification par défaut ne s'affiche pas lorsque le contenu

Vous pouvez utiliser le storyboard pour configurer votre vue ou créer l'interface utilisateur par programme dans le contrôleur de vue. Pour cet exemple, j'ai configuré mon storyboard avec une vue qui affichera le logo du podcast, deux étiquettes pour le titre et le corps du contenu de la notification et un bouton «Like» qui affichera une image de cœur.

, pour obtenir l'image affichée pour le logo du podcast et le bouton, nous devons revenir à notre demande de notification:

 guard let pathUrlForPodcastImg = Bundle.main.url (forResource: "startup", withExtension: "jpg") ) else {return}
laissez imgAttachment = essayez! UNNotificationAttachment (identifiant: "image", url: pathUrlForPodcastImg, options: nil)

garde laisse pathUrlForButtonNormal = Bundle.main.url (forResource: "heart-outline", avecExtension: "png") else {return}
laissez buttonNormalStateImgAtt = essayez! UNNotificationAttachment (identifiant: "button-normal-image", url: pathUrlForButtonNormal, options: nil)

garde laisse pathUrlForButtonHighlighted = Bundle.main.url (forResource: "heart-filled", avecExtension: "png") else {return}
let buttonHighlightStateImgAtt = essayez! UNNotificationAttachment (identifiant: "button-highlight-image", url: pathUrlForButtonHighlighted, options: nil)

content.attachments = [imgAttachment, buttonNormalStateImgAtt, buttonHighlightStateImgAtt]

J'ai ajouté dans mon projet un dossier contenant toutes les images nécessaires à la notification afin de pouvoir y accéder via le bundle principal.


 Navigateur de projet affiché dans Xcode.
Navigateur de projet Xcode. ( Grand aperçu )

Pour chaque image, nous obtenons le chemin du fichier et l'utilisons pour créer un UNNotificationAttachment . Cela ajouté à notre contenu de notification nous permet d'accéder aux images dans l'extension de contenu de notification dans la méthode didReceive indiquée ci-dessous.

 func didReceive (_ notification: UNNotification) {
self.newEpisodeLabel.text = notification.request.content.title
self.episodeNameLabel.text = notification.request.content.body

let imgAttachment = notification.request.content.attachments [0]
let buttonNormalStateAtt = notification.request.content.attachments [1]
let buttonHighlightStateAtt = notification.request.content.attachments [2]

Garder laisser imageData = NSData (contentsOf: imgAttachment.url), laisser buttonNormalStateImgData = NSData (contentsOf: buttonNormalStateAtt.url), laisser buttonHighlightStateImgData = NSData (contentsOf: buttonHighlightStateAtt.url) else {return}

let image = UIImage (data: imageData comme Data)
letNormalStateImg = UIImage (data: buttonNormalStateImgData en tant que données) ?.RenderingMode (.alwaysOriginal)
let buttonHighlightStateImg = UIImage (data: buttonHighlightStateImgData en tant que données) ?. withRenderingMode (.alwaysOriginal)

imageView.image = image
likeButton.setImage (buttonNormalStateImg, pour: .normal)
likeButton.setImage (buttonHighlightStateImg, pour: .selected)
}

Nous pouvons maintenant utiliser les URL de chemin de fichier que nous avons définies dans la requête pour récupérer les données de l'URL et les transformer en images. Notez que j'ai deux images différentes pour les différents états des boutons, ce qui nous permettra de mettre à jour l'interface utilisateur pour l'interaction utilisateur. Lorsque je lance l'application et envoie la demande, voici à quoi ressemble la notification:


 iPhone 8 Plus affiché avec une notification personnalisée chargée après avoir appuyé sur la notification.
Extension de contenu chargée pour l'application NotificationTester. ( Grand aperçu )

Tout ce que j'ai mentionné jusqu'à présent concernant l'extension de contenu n'est pas nouveau dans iOS 12, alors explorons les deux nouvelles fonctionnalités: Interaction utilisateur et Actions dynamiques . Lorsque l'extension de contenu a été ajoutée pour la première fois dans iOS 10, il était impossible de capturer le toucher utilisateur dans une notification, mais maintenant nous pouvons enregistrer les événements UIControl et répondre lorsque l'utilisateur interagit avec un élément d'interface utilisateur. pour montrer à l'utilisateur que le bouton «J'aime» a été sélectionné ou non sélectionné. Nous avons déjà défini les images pour les états .normal et .selected nous devons donc simplement ajouter une cible pour UIButton afin de pouvoir mettre à jour l'état sélectionné.

 override func viewDidLoad () {
super.viewDidLoad ()
// Effectuez toute initialisation d'interface requise ici.
likeButton.addTarget (self, action: #selector (likeButtonTapped (expéditeur :)), pour: .touchUpInside)
} 
 @objc func likeButtonTapped (expéditeur: UIButton) {
likeButton.isSelected =! sender.isSelected
} 

Maintenant, avec le code ci-dessus, nous obtenons le comportement suivant:

 Gif de l'iPhone 8 Plus avec notification personnalisée chargée et bouton sélectionné étant sélectionné et désélectionné.
( Grand aperçu )

Dans la méthode de sélecteur likeButtonTapped nous pouvions également ajouter une logique pour enregistrer l’état aimé dans Valeurs par défaut ou dans le trousseau. notre application principale.

Les actions de notification existent depuis iOS 10, mais une fois que vous cliquez dessus, l'utilisateur sera généralement redirigé vers l'application principale ou l'extension de contenu sera supprimée. Maintenant, dans iOS 12, nous pouvons mettre à jour la liste des actions de notification affichées en réponse à l'action sélectionnée par l'utilisateur.

Revenons d'abord à notre délégué d'application où nous créons nos catégories de notification afin d'ajouter des actions à notre catégorie podcast.

 let playAction = UNNotificationAction (identifiant: "play-action", titre: "Play", options: [])
let queueAction = UNNotificationAction (identifiant: "queue-action", titre: "Queue Next", options: [])
let podcastCategory = UNNotificationCategory (identificateur: "podcast", actions: [playAction, queueAction]intentIdentifiers: []hiddenPreviewsBodyPlaceholder: hiddenPreviewsPlaceholder, categorySummaryFormat: summaryFormat, options: [])

Lorsque nous exécutons l'application et envoyons une notification, nous voyons les actions suivantes:


 iPhone 8 Plus avec notification personnalisée avec une option à lire ou à ajouter à la file d'attente.
Actions rapides de notification. ( Grand aperçu )

Lorsque l'utilisateur sélectionne «Play», nous souhaitons que l'action soit mise à jour en «Pause». Si les utilisateurs sélectionnent «Queue Next», nous souhaitons que cette action soit mise à jour en «Remove from Queue». notre méthode didReceive dans le contrôleur de vue de Notification Content Extension.

 func didReceive (_ response: UNNotificationResponse, completionHandler completion:
(UNNotificationContentExtensionResponseOption) -> Void) {
guard let currentActions = extensionContext? .notificationActions else {return}

if response.actionIdentifier == "play-action" {
let pauseAction = UNNotificationAction (identifiant: "pause-action", titre: "Pause", options: [])
let otherAction = currentActions [1]
let newActions = [pauseAction, otherAction]
extensionContext? .notificationActions = newActions

} else if response.actionIdentifier == "queue-action" {
let removeAction = UNNotificationAction (identifiant: "remove-action", titre: "Remove from Queue", options: [])
let otherAction = currentActions [0]
let newActions = [otherAction, removeAction]
extensionContext? .notificationActions = newActions

} else if response.actionIdentifier == "pause-action" {
let playAction = UNNotificationAction (identifiant: "play-action", titre: "Play", options: [])
let otherAction = currentActions [1]
let newActions = [playAction, otherAction]
extensionContext? .notificationActions = newActions

} else if response.actionIdentifier == "remove-action" {
let queueAction = UNNotificationAction (identifiant: "queue-action", titre: "Queue Next", options: [])
let otherAction = currentActions [0]
let newActions = [otherAction, queueAction]
extensionContext? .notificationActions = newActions
}
achèvement (.doNotDismiss)
} 

En réinitialisant la liste extensionContext? .NotificationActions pour qu'elle contienne les actions mises à jour, elle nous permet de modifier les actions chaque fois que l'utilisateur en choisit une. Le comportement est illustré ci-dessous.

 Gif de l'iPhone 8 Plus avec notification personnalisée chargée et les actions rapides modifiées de Play to Pause et Add to Queue to Remove from Queue.
Actions rapides de notification dynamique. ( Grand aperçu )

Résumé

Il ya beaucoup à faire avant le lancement d’iOS 12 pour s’assurer que vos notifications sont prêtes. Les étapes varient en complexité et vous n’avez pas à les mettre en œuvre. Assurez-vous de télécharger d'abord XCode 10 beta afin de pouvoir tester les fonctionnalités que nous avons utilisées. Si vous voulez jouer avec l'application de démonstration que j'ai référencée tout au long de l'article, jetez-y un coup d'oeil sur Github .

Pour vos demandes et paramètres de permissions de notification, vous devrez:

  • Déterminez si vous souhaitez ou non activer l'autorisation provisoire et l'ajouter à vos options d'autorisation.
  • Si vous avez déjà une vue de paramètres de notification personnalisée dans votre application, ajoutez ProvideAppNotificationSettings à vos options d'autorisation implémenter le rappel dans votre délégué d'application ou la classe conforme à UNUserNotificationCenterDelegate .

Pour le groupement de notifications:

  • Ajoutez un identifiant de thread à vos notifications distantes et locales afin que vos notifications soient correctement regroupées dans la notification Center.
  • Lors de l'enregistrement de vos catégories de notification, ajoutez le paramètre Summary de la catégorie si vous souhaitez que votre notification groupée soit plus descriptive que «more cations. ”
  • Si vous souhaitez personnaliser encore davantage le texte récapitulatif, ajoutez un identifiant récapitulatif correspondant à la mise en forme ajoutée pour le résumé de la catégorie.

Pour les notifications enrichies personnalisées:

  • à votre application pour créer des notifications enrichies.
  • Concevez et implémentez le contrôleur de vue pour contenir les éléments que vous souhaitez dans votre notification.
  • Mettre à jour la méthode didReceive dans le contrôleur de vue pour répondre aux actions sélectionnées et mettre à jour la liste des actions si nécessaire.

Lectures supplémentaires

 Smashing Editorial )




Source link