Rich Notification: wat het is, mediacontent en het maken van meldingen

Wat is Rich Notification

Rich Notification is een iOS-pushmelding die niet alleen tekst bevat, maar ook media-bijlagen, interactieve elementen en een aangepaste interface. De term „rich“ (rijk) weerspiegelt de mogelijkheid om afbeeldingen, video, audio, actieknoppen en tekstinvoer in de melding op te nemen, waardoor een eenvoudige waarschuwing verandert in een volledig interactief element.

Evolutie van meldingen in iOS

Apple introduceerde ondersteuning voor Rich Notification in iOS 10 samen met het UserNotifications-framework. Daarvoor konden pushmeldingen alleen tekst, geluid en een badge bevatten. iOS 10 introduceerde UNNotificationServiceExtension en UNNotificationContentExtension, die de mogelijkheid openden om inhoud te wijzigen en aangepaste interfaces te maken. In latere versies werden ondersteuning voor SwiftUI in Content Extension, geanimeerde GIF's en verbeterde mediaschaling toegevoegd.

Voordelen ten opzichte van standaardmeldingen

Rich Notification verhoogt de gebruikersbetrokkenheid aanzienlijk. Uit Apple-onderzoek blijkt dat meldingen met afbeeldingen 30–40% meer interacties krijgen in vergelijking met tekstuele. Een productafbeelding, videovoorbeeld of knop voor snel antwoord stelt de gebruiker in staat om direct vanuit de melding een beslissing te nemen zonder de app te openen. Dit verkort de weg naar de doelactie en verbetert de gebruikerservaring.

Soorten media-bijlagen en hun formaten

UNNotificationAttachment ondersteunt drie mediacategorieën: afbeeldingen, video en audio. Elk type heeft zijn eigen beperkingen qua formaat, grootte en duur. Het systeem schaalt afbeeldingen automatisch naar de meldingsgrootte en beperkt de videoduur tot 30 seconden voor optimalisatie van de prestaties.

Afbeeldingen en geanimeerde GIF's

Afbeeldingen worden automatisch bijgesneden en geschaald door het systeem voor weergave in de compacte en uitgebreide meldingsweergave. Geanimeerde GIF's worden ondersteund vanaf iOS 12 en worden automatisch afgespeeld bij het bekijken van de melding. De aanbevolen afbeeldingsgrootte is 1024x1024 pixels, wat zorgt voor een heldere weergave op alle apparaten, inclusief iPad met groot scherm.

Video- en audio-bijlagen

Video in Rich Notification wordt standaard zonder geluid afgespeeld — de gebruiker kan het geluid inschakelen via een knop in de speler. Maximale videoduur is 30 seconden, waarna het afspelen stopt. Audio-bijlagen kunnen worden gebruikt voor spraakberichten of geluidsvoorbeelden en worden afgespeeld bij het tikken op de melding in de uitgebreide weergave.

Interactieve knoppen en acties

Interactieve acties stellen de gebruiker in staat om rechtstreeks vanuit de melding bewerkingen uit te voeren zonder de app te openen. Acties worden geregistreerd via UNNotificationCategory en UNNotificationAction bij het starten van de app. Elke actie kan op de achtergrond (zonder de app te openen) of op de voorgrond (opent de app om de bewerking te voltooien) zijn.

UNNotificationAction en UNTextInputNotificationAction

UNNotificationAction is een knop met een titel en optionele modificatoren, zoals requiresAuthentication (vereist Face ID/Touch ID) of destructive (rood gemarkeerd). UNTextInputNotificationAction breidt deze mogelijkheid uit door een tekstinvoerveld toe te voegen — ideaal voor snel antwoord op een bericht of opmerking. Acties worden weergegeven bij lang indrukken van de melding of naar beneden vegen.

Registratie van categorieën en acties

Meldingscategorieën verbinden het inhoudstype met de set beschikbare acties. Het registratieproces wordt uitgevoerd in AppDelegate bij het starten van de app via UNUserNotificationCenter.current().setNotificationCategories. De categorie wordt op de server gespecificeerd in het category-veld van de JSON-payload, en het systeem past automatisch de bijbehorende set acties op de melding toe.

Verwerking van klikken op acties

Wanneer de gebruiker op een knop klikt of tekst verzendt, roept het systeem de delegate UNUserNotificationCenterDelegate aan met de methode didReceive response. UNNotificationResponse bevat de actie-identificatie en de ingevoerde tekst (voor UNTextInputNotificationAction). Op basis van deze informatie voert de app de bijbehorende bedrijfslogica uit: een bericht verzenden, de actie bevestigen of een specifiek scherm openen.

Implementatie van Rich Notification in Swift

Laten we de volledige cyclus van het maken van een Rich Notification bekijken: van registratie van categorieën in AppDelegate tot verwerking in Service Extension en weergave. AppDelegate registreert de categorie met knoppen, de server verzendt de melding met de afbeeldings-URL, Service Extension downloadt de media en Content Extension geeft de aangepaste interface met knoppen weer.

// AppDelegate — registratie van categorieën en acties
func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions:
    [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {

    let replyAction = UNTextInputNotificationAction(
        identifier: "reply",
        title: "Antwoorden",
        options: [.authenticationRequired])

    let likeAction = UNNotificationAction(
        identifier: "like",
        title: "Vind ik leuk",
        options: [])

    let category = UNNotificationCategory(
        identifier: "social_post",
        actions: [replyAction, likeAction],
        intentIdentifiers: [],
        options: [])

    UNUserNotificationCenter.current()
        .setNotificationCategories([category])
    return true
}

Service Extension voor het downloaden van afbeeldingen

Na ontvangst van een pushmelding met de categorie „social_post“ en de afbeeldings-URL in het aangepaste veld, wordt Service Extension geactiveerd. De extensie downloadt de afbeelding via het netwerk, maakt een UNNotificationAttachment met een unieke identificatie en voegt deze toe aan de inhoud. Het is belangrijk om de grootte van het gedownloade bestand te controleren — als het groter is dan 10 MB, wordt de attachment niet gemaakt en toont het systeem de melding zonder media.

class NotificationService: UNNotificationServiceExtension {

    override func didReceive(
        _ request: UNNotificationRequest,
        withContentHandler contentHandler:
        @escaping (UNNotificationContent) -> Void
    ) {
        let content = (request.content.mutableCopy()
            as! UNMutableNotificationContent)
        guard let urlString = content.userInfo["media-url"]
            as? String,
            let url = URL(string: urlString)
        else { contentHandler(request.content); return }

        URLSession.shared.downloadTask(with: url) {
            location, _, _ in
            guard let location = location else {
                contentHandler(content); return }
            let attachment = try! UNNotificationAttachment(
                identifier: "media", url: location,
                options: [UNNotificationAttachmentOptionsTypeHintKey:
                    "jpg"])
            content.attachments = [attachment]
            contentHandler(content)
        }.resume()
    }
}

Testen van Rich Notification

Voor het testen van Rich Notification zonder server gebruikt u de iOS-simulator en verzendt u push via de terminal met xcrun simctl push. In de payload moet u verplicht mutable-content: 1 opgeven voor activatie van Service Extension en category voor weergave van acties. De opdracht verzendt push vanuit een JSON-bestand rechtstreeks naar de geselecteerde simulator, wat snelle iteratie mogelijk maakt zonder serverinfrastructuur.

Content Extension en aangepaste interface

UNNotificationContentExtension maakt het mogelijk om de standaard meldingsinterface volledig te vervangen door een willekeurige UIKit- of SwiftUI-weergave. De extensie wordt geactiveerd wanneer de gebruiker de melding uitvouwt (force touch of naar beneden vegen) en kan knoppen, schuifregelaars, animaties en andere UI-componenten bevatten. De interfacegrootte wordt aangepast aan de inhoud via Auto Layout.

Storyboard en SwiftUI in Content Extension

Content Extension is gebaseerd op een storyboard met een weergave die overerft van UIViewController. SwiftUI View wordt geïntegreerd via UIHostingController vanaf iOS 16, wat moderne benaderingen voor het bouwen van de interface mogelijk maakt. Voor achterwaartse compatibiliteit met iOS 14–15 wordt aanbevolen UIKit met xib-bestanden te gebruiken. De interface ontvangt de gewijzigde inhoud van Service Extension via UNNotificationContent.

Verwerking van gebruikersacties

Content Extension implementeert het protocol UNNotificationContentExtension met de methode didReceive response. UNNotificationResponse bevat informatie over de ingedrukte knop of ingevoerde tekst. De extensie kan de interface bijwerken zonder de melding te sluiten of een completion handler aanroepen om deze te sluiten. Dit maakt het mogelijk om snelle interactiescenario's te creëren, zoals „like“ met visuele feedback direct in de melding.

Ontwerpaanbevelingen

Apple raadt aan om Content Extension beknopt en functioneel te houden, met vermijding van overbodige elementen. Maximale hoogte van de uitgevouwen melding is ongeveer 400 punten, waarna de inhoud scrollt. Gebruik systeemlettertypen en -afstanden voor uniformiteit met andere meldingen. Test op verschillende schermformaten om ervoor te zorgen dat de interface correct wordt weergegeven op zowel iPhone als iPad.