Personnalisation des notifications push iOS

Lorsqu’un appareil iOS reçoit une notification contenant une alerte, le système affiche le contenu de l’alerte en deux étapes. Initialement, il affiche une bannière abrégée avec le titre, le sous-titre et deux à quatre lignes de corps de texte de la notification. Si l’utilisateur appuie sur la bannière abrégée, iOS affiche l’interface de notification complète, y compris toutes les actions liées à la notification. Le système fournit l’interface pour la bannière abrégée, mais vous pouvez personnaliser l’interface complète en utilisant une extension d’application de contenu de notification.

L’extension d’application de contenu de notification gère un contrôleur de vue qui affiche votre interface de notification personnalisée. Ce contrôleur de vue peut compléter ou remplacer l’interface système par défaut pour vos notifications. Vous pouvez utiliser votre contrôleur de vue pour :

• Personnaliser le placement des éléments, y compris le titre, le sous-titre et le corps de texte de l’alerte.
• Substituer différentes polices ou styles pour les éléments de l’interface.
• Afficher des données spécifiques à l’application, par exemple, des données stockées dans des clés spécifiques à l’application de la charge utile de la notification.
• Inclure des images ou une image de marque personnalisées.

Votre extension d’application doit configurer son contrôleur de vue en utilisant les données immédiatement disponibles, telles que le contenu de la notification et les fichiers présents dans le bundle de votre extension d’application. Si vous utilisez un groupe d’applications pour partager des données entre votre application et votre extension d’application, vous pouvez également utiliser tous les fichiers trouvés dans le groupe d’applications. Pour vous assurer que vos notifications sont livrées en temps opportun, configurez les vues le plus rapidement possible. N’effectuez aucune tâche de longue durée, comme essayer de récupérer des données sur le réseau.

Pour ajouter une extension d’application de contenu de notification à votre application iOS :

1. Dans Xcode, choisissez File > New > Target.
2. Sélectionnez Notification Content Extension dans la section iOS Application Extension.
3. Cliquez sur Next.
4. Fournissez un nom pour votre extension d’application.
5. Cliquez sur Finish.

Le modèle fourni par Xcode inclut un storyboard et un contrôleur de vue à configurer. Construisez votre interface de notification personnalisée en ajoutant des vues à votre contrôleur de vue. Par exemple, utilisez des libellés pour afficher le titre, le sous-titre et le corps de texte de la notification. Vous pouvez également ajouter des vues d’image et des vues qui affichent du contenu non interactif. Vous n’avez pas besoin de fournir de contenu initial pour vos vues.

Vous pouvez ajouter des contrôles interactifs (par exemple, des boutons ou des interrupteurs) dans iOS 12 et versions ultérieures. Pour plus d’informations, consultez Prise en charge des contrôles interactifs.

Utilisez la méthode didReceive(_:) de votre contrôleur de vue pour mettre à jour ses libellés et autres vues. La charge utile (payload) de la notification contient les données à utiliser lors de la configuration de votre contrôleur de vue. Vous pouvez également utiliser des données provenant des autres fichiers de votre extension d’application. Le Listing 1 montre une version de cette méthode qui récupère le titre et le corps de texte de la charge utile de la notification et assigne les chaînes de caractères à deux contrôles UILabel, qui sont stockés en tant qu’outlets sur le contrôleur de vue.

// Configuration de l'interface de notification à l'exécution

func didReceive(_ notification: UNNotification) {
   self.bodyText?.text = notification.request.content.body
   self.headlineText?.text = notification.request.content.title
}

Si une deuxième notification arrive alors que votre contrôleur de vue est déjà visible, le système appelle à nouveau la méthode didReceive(_:) avec la nouvelle charge utile de notification.

Dans iOS 12 et versions ultérieures, vous pouvez activer les interactions utilisateur dans vos notifications personnalisées. Cela vous permet d’ajouter des contrôles interactifs, tels que des boutons et des interrupteurs, à votre interface personnalisée.

Pour activer les interactions utilisateur :

1. Ouvrez le fichier info.plist de votre extension de contenu de notification.
2. Ajoutez la clé UNNotificationExtensionUserInteractionEnabled à vos attributs d’extension. Donnez-lui une valeur booléenne, définie sur YES.

import UIKit
import Foundation
import UserNotifications
import UserNotificationsUI
import PassKit

class NotificationViewController: UIViewController, UNNotificationContentExtension, PKPaymentAuthorizationViewControllerDelegate {


    func paymentAuthorizationViewControllerDidFinish(_ controller: PKPaymentAuthorizationViewController) {
        controller.dismiss(animated: true, completion: nil)
    }


    @IBOutlet weak var buyWithApplePayButton: UIButton!
    @IBOutlet weak var containerView: UIView!
    @IBOutlet weak var payInAppButton: UIButton!
    @IBOutlet weak var segmentCustom: UISegmentedControl!

    private var amount: NSDecimalNumber = 0;

    override func viewDidLoad() {
        super.viewDidLoad()

        buttonCustomisation()

        amount = NSDecimalNumber.init(value: 5)
    }

    func buttonCustomisation () {
        self.buyWithApplePayButton.layer.masksToBounds = true
        self.buyWithApplePayButton.layer.cornerRadius = 10
        self.payInAppButton.layer.masksToBounds = true
        self.payInAppButton.layer.cornerRadius = 10
        self.containerView.layer.borderColor = UIColor.gray.cgColor
        self.containerView.layer.borderWidth = 0.7
        self.containerView.layer.masksToBounds = true
        self.containerView.layer.cornerRadius = 20
    }

    func didReceive(_ notification: UNNotification) {
        // Configuration de l'interface de notification à l'exécution
    }

    @IBAction func buyWithApplePayAction(_ sender: Any) {
        let request = PKPaymentRequest()
        request.merchantIdentifier = "merchant.com.sample.ApplePayAction"
        request.supportedNetworks = [PKPaymentNetwork.visa, PKPaymentNetwork.masterCard, PKPaymentNetwork.amex]
        request.merchantCapabilities = PKMerchantCapability.capability3DS
        request.countryCode = "US"
        request.currencyCode = "USD"

        request.paymentSummaryItems = [
            PKPaymentSummaryItem(label: "Some Product", amount: amount)
        ]

        let applePayController = PKPaymentAuthorizationViewController(paymentRequest: request)
        applePayController?.delegate = self
        self.present(applePayController!, animated: true, completion: nil)
    }

    @IBAction func payInAppButtonAction(_ sender: Any) {
        print("pay in app button tapped")
    }

    @IBAction func segmentAction(_ sender: Any) {
        switch segmentCustom.selectedSegmentIndex {
        case 0:
            amount = NSDecimalNumber.init(value: 5)
            break
        case 1:
            amount = NSDecimalNumber.init(value: 10)
            break
        case 2:
            amount = NSDecimalNumber.init(value: 20)
            break
        default:
            amount = NSDecimalNumber.init(value: 5)
            break
        }
    }
}