Met de Rich Notifications API kunt u meldingen maken met behulp van sjablonen en deze meldingen aan gebruikers weergeven in het systeemvak van de gebruiker:
Hoe ze eruit zien
Uitgebreide meldingen zijn er in vier verschillende smaken: basis, afbeelding, lijst en voortgang. Alle meldingen bevatten een titel, bericht, een klein pictogram dat links van het meldingsbericht wordt weergegeven, en een contextberichtveld, dat wordt weergegeven als een derde tekstveld in een lichter kleurenlettertype.
Een basisbeeld:
Lijstmeldingen geven een willekeurig aantal lijstitems weer:
Afbeeldingsmeldingen bevatten een afbeeldingsvoorbeeld:
Voortgangsmeldingen tonen een voortgangsbalk:
Hoe ze zich gedragen
Op ChromeOS verschijnen meldingen in het systeemvak van een gebruiker en blijven in het systeemvak totdat de gebruiker ze sluit. Het systeemvak houdt een telling bij van alle nieuwe meldingen. Zodra een gebruiker de meldingen in het systeemvak ziet, wordt de telling op nul gezet.
Aan meldingen kan een prioriteit tussen -2 en 2 worden toegewezen. Prioriteiten < 0 worden weergegeven in het ChromeOS-meldingscentrum en veroorzaken een fout op andere platforms. Prioriteit 0 is de standaardprioriteit. Prioriteiten > 0 worden weergegeven voor een langere duur en er kunnen meer meldingen met hoge prioriteit worden weergegeven in het systeemvak.
Naast het weergeven van informatie kunnen alle meldingstypen maximaal twee actie-items bevatten. Wanneer gebruikers op een actie-item klikken, kan uw app reageren met de juiste actie. Wanneer de gebruiker bijvoorbeeld op "Beantwoorden" klikt, wordt de e-mailapp geopend en kan de gebruiker het antwoord voltooien:
Hoe je ze kunt ontwikkelen
Om deze API te gebruiken, roept u de notificaties.create- methode aan en geeft u de meldingsdetails door via de options
:
chrome.notifications.create(id, options, creationCallback);
De notificaties.NotificationOptions moeten een notificaties.TemplateType bevatten, waarin de beschikbare meldingsdetails worden gedefinieerd en hoe deze details worden weergegeven.
Maak een basismelding
Alle sjabloontypen ( basic
, image
, list
en progress
) moeten een title
en message
bevatten, evenals een iconUrl
, een link naar een klein pictogram dat links van het meldingsbericht wordt weergegeven.
Hier is een voorbeeld van een basic
:
var opt = { type: "basic", title: "Primary Title", message: "Primary message to display", iconUrl: "url_to_small_icon" }
Afbeeldingsmelding maken
Het image
bevat ook een imageUrl
, een link naar een afbeelding waarvan een voorbeeld wordt weergegeven in de melding:
var opt = {
type: "basic",
title: "Primary Title",
message: "Primary message to display",
iconUrl: "url_to_small_icon",
imageUrl: "url_to_preview_image"
}
In Chrome-apps moeten deze URL's vanwege een strikt inhoudbeveiligingsbeleid verwijzen naar een lokale bron of een blob- of gegevens-URL gebruiken. Gebruik een verhouding van 3:2 voor uw afbeelding; anders omlijst een zwarte rand de afbeelding.
Lijstmelding maken
De list
geeft items
weer in een lijstindeling:
var opt = { type: "list", title: "Primary Title", message: "Primary message to display", iconUrl: "url_to_small_icon", items: [{ title: "Item1", message: "This is item 1."}, { title: "Item2", message: "This is item 2."}, { title: "Item3", message: "This is item 3."}] }
Voortgangsmelding maken
De progress
geeft een voortgangsbalk weer waarbij de huidige voortgang varieert van 0 tot 100:
var opt = {
type: "progress",
title: "Primary Title",
message: "Primary message to display",
iconUrl: "url_to_small_icon",
progress: 42
}
Luisteren naar en reageren op gebeurtenissen
Alle meldingen kunnen gebeurtenislisteners en gebeurtenishandlers bevatten die reageren op gebruikersacties (zie chrome.events ). U kunt bijvoorbeeld een gebeurtenishandler schrijven om te reageren op een notificaties.onButtonClicked -gebeurtenis.
Gebeurtenisluisteraar:
chrome.notifications.onButtonClicked.addListener(replyBtnClick);
Gebeurtenishandler:
function replyBtnClick {
//Write function to respond to user action.
}
Overweeg om gebeurtenislisteners en handlers op te nemen in de gebeurtenispagina , zodat er zelfs meldingen kunnen verschijnen als de app of extensie niet actief is.