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 thị những thông báo này thông báo cho người dùng trong khay hệ thống của người dùng:
Giao diện của quảng cáo
Thông báo đa dạng thức có 4 loại: 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 đề, tin nhắn, biểu tượng nhỏ hiển thị ở bên trái thông báo tin nhắn và trườngContextMessage, được 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 về hình ảnh bao gồm một 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à vẫn nằm trong khay hệ thống cho đến khi người dùng loại bỏ chúng. Khay hệ thống sẽ đếm 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 sẽ được đặt lại về 0.
Bạn có thể chỉ định mức độ ưu tiên cho thông báo từ -2 đến 2. Mức độ ưu tiên < 0 xuất hiện trong ChromeOS trung tâm thông báo 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. Ưu tiên > 0 được hiển thị để tăng thời lượng và có thể có nhiều thông báo có mức độ ưu tiên cao hơn được 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 có thể bao gồm tối đa 2 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 việc 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, chuyển thông tin chi tiết về thông báo 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 là xác định các chi tiết thông báo có sẵn và cách hiển thị những chi tiết đó.
Tạo thông báo cơ bản
Tất cả các loại mẫu (basic, image, list và progress) đều phải bao gồm một thông báo title và
message, cũng như iconUrl, là một liên kết đến một biểu tượng nhỏ được hiển thị ở bên trái
nội dung thông báo.
Dưới đây là ví dụ về mẫu basic:
var opt = { type: "basic", title: "Primary Title", message: "Primary message to display", iconUrl: "url_to_small_icon" }
Thông báo tạo hình ảnh
Loại mẫu image cũng bao gồm imageUrl, là đường liên kết đến một 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, do Chính sách bảo mật nội dung nghiêm ngặt, các URL này phải trỏ tới hoặc dùng blob hay URL dữ liệu. Sử dụng tỷ lệ 3:2 cho hình ảnh của bạn; nếu không thì viền đen tạo khung hình ảnh.
Tạo thông bá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."}] }
Thông báo về tiến trình tạo
Mẫu progress hiển thị một 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
}
Lắng nghe và phản hồi sự kiện
Tất cả thông báo có thể bao gồm trình nghe sự kiện và trình xử lý sự kiện phản hồi hành động 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 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.
}
Hãy cân nhắc việc đưa trình nghe và trình xử lý sự kiện vào trang sự kiện để các 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.