Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the BSD License.
©2013 Google
| Description: | Use the chrome.notifications module
to create rich notifications using templates and
show these notifications to users in the system tray
(see Usage). |
| Availability: | Google Chrome Dev Channel Only |
| Permissions: | "notifications" |
| Learn more: | Chrome Apps Office Hours: Rich Notifications |
Warning: Currently this API only works on ChromeOS and Windows.
To use this API,
call the create method,
passing in the notification details
via the options parameter:
chrome.notifications.create(id, options, creationCallback);
The NotificationOptions must include a TemplateType, which defines available notification details and how those details are displayed.
All template types
(basic, image, and list)
must include a notification title and message,
as well as an iconUrl, which is a link to a small icon that
is displayed to the left of the notification message. The image
template type also includes an imageUrl, which is a link to
an image that is previewed within the notification.
Due to a strict Content Security Policy
in packaged apps, these URLs must point to a local resource or use a
data URL.
Here's an example of a basic template:
var opt = {
type: "basic",
title: "Primary Title",
message: "Primary message to display",
iconUrl: "url_to_small_icon"
}
The list template displays items
in a list format:
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."}]
}
Let us know if you have ideas for new templates with varying layouts by filing a crbug!
All notifications can include event listeners and event handlers that respond to user actions. For example, you can write an event handler to respond to an onButtonClicked event.
Consider including event listeners and handlers within the event page, so that notifications can pop-up even when the app or extension isn't running.
Creates and displays a notification having the contents in |options|, identified by the id |notificationId|. If |notificationId| is empty, |create| generates an id. If |notificationId| matches an existing notification, |create| first clears that notification before proceeding with the create operation. |callback| returns the notification id (either supplied or generated) that represents the created notification.
The callback parameter should specify a function that looks like this:
function(string notificationId) {...};
Updates an existing notification having the id |notificationId| and the options |options|. |callback| indicates whether a matching notification existed.
The callback parameter should specify a function that looks like this:
function(boolean wasUpdated) {...};
Given a |notificationId| returned by the |create| method, clears the corresponding notification. |callback| indicates whether a matching notification existed.
The callback parameter should specify a function that looks like this:
function(boolean wasCleared) {...};