API thông báo đa dạng thức cho phép bạn tạo thông báo bằng các mẫu và hiện những thông báo này cho người dùng trong khay hệ thống của người dùng:
Quảng cáo tìm kiếm động trông như thế nào
Thông báo phong phú có 4 phiên bản: cơ bản, hình ảnh, danh sách và tiến trình. Tất cả thông báo bao gồm tiêu đề, thông báo, biểu tượng nhỏ hiển thị ở bên trái thông báo và trường contextMessage hiển thị dưới dạng trường văn bản thứ 3 với phông chữ màu sáng hơn.
Hình ảnh cơ bản:
Thông báo danh sách hiển thị số lượng mục danh sách bất kỳ:
Thông báo hình ảnh bao gồm bản xem trước hình ảnh:
Thông báo tiến trình hiển thị một thanh tiến trình:
Hành vi của họ
Trên ChromeOS, thông báo xuất hiện trong khay hệ thống của người dùng và ở trong khay hệ thống cho đến khi người dùng đóng các thông báo này. Khay hệ thống lưu trữ số lượng tất cả thông báo mới. Sau khi người dùng thấy thông báo trong khay hệ thống, số lượng thông báo sẽ được đặt lại về 0.
Bạn có thể chỉ định mức độ ưu tiên cho thông báo trong khoảng từ -2 đến 2. Các mức độ ưu tiên < 0 xuất hiện trong trung tâm thông báo của ChromeOS và gây ra lỗi trên các nền tảng khác. Mức độ ưu tiên 0 là mức độ ưu tiên mặc định. Mức độ ưu tiên > 0 hiển thị để tăng thời lượng và nhiều thông báo có mức độ ưu tiên cao hơn có thể hiển thị trong khay hệ thống.
Ngoài việc hiển thị thông tin, tất cả các loại thông báo đều có thể bao gồm tối đa hai mục hành động. Khi người dùng nhấp vào một mục hành động, ứng dụng của bạn có thể phản hồi bằng hành động thích hợp. Ví dụ: khi người dùng nhấp vào "Trả lời", ứng dụng email sẽ mở ra và người dùng có thể hoàn tất thư trả lời:
Cách phát triển
Để sử dụng API này, hãy gọi phương thức notifications.create, truyền vào thông tin chi tiết về thông báo thông qua tham số options
:
chrome.notifications.create(id, options, creationCallback);
Thông báo notifications.NotificationOptions phải bao gồm một notifications.TemplateType. Mục này xác định các thông tin chi tiết về thông báo có sẵn và cách hiển thị các thông tin đó.
Tạo thông báo cơ bản
Tất cả các loại mẫu (basic
, image
, list
và progress
) phải bao gồm title
và message
thông báo cũng như iconUrl
(đường liên kết đến một biểu tượng nhỏ hiển thị ở bên trái của nội dung thông báo).
Dưới đây là ví dụ về một mẫu basic
:
var opt = { type: "basic", title: "Primary Title", message: "Primary message to display", iconUrl: "url_to_small_icon" }
Tạo thông báo bằng hình ảnh
Loại mẫu image
cũng bao gồm imageUrl
, là đường liên kết đến hình ảnh được xem trước trong thông báo:
var opt = {
type: "basic",
title: "Primary Title",
message: "Primary message to display",
iconUrl: "url_to_small_icon",
imageUrl: "url_to_preview_image"
}
Trong Ứng dụng Chrome, theo Chính sách bảo mật nội dung nghiêm ngặt, các URL này phải trỏ đến một tài nguyên cục bộ hoặc sử dụng URL dữ liệu hoặc blob. Sử dụng tỷ lệ 3:2 cho hình ảnh; nếu không, hãy dùng một đường viền màu đen để tạo khung hình ảnh.
Thông báo về việc tạo danh sách
Mẫu list
hiển thị items
ở định dạng danh sách:
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."}] }
Tạo thông báo về tiến trình
Mẫu progress
hiển thị thanh tiến trình, trong đó tiến trình hiện tại nằm trong khoảng từ 0 đến 100:
var opt = {
type: "progress",
title: "Primary Title",
message: "Primary message to display",
iconUrl: "url_to_small_icon",
progress: 42
}
Nghe và phản hồi các sự kiện
Tất cả các thông báo đều có thể bao gồm trình nghe sự kiện và trình xử lý sự kiện phản hồi thao tác của người dùng (xem chrome.events). Ví dụ: bạn có thể viết một trình xử lý sự kiện để phản hồi một sự kiện notifications.onButtonClicked.
Trình nghe sự kiện:
chrome.notifications.onButtonClicked.addListener(replyBtnClick);
Trình xử lý sự kiện:
function replyBtnClick {
//Write function to respond to user action.
}
Cân nhắc việc đưa trình xử lý và trình nghe sự kiện vào trang sự kiện để thông báo có thể bật lên ngay cả khi ứng dụng hoặc tiện ích không chạy.