Zengin bildirimler API'sı

Zengin bildirimler API'si, şablonları kullanarak bildirimler oluşturmanızı ve bu bildirimleri kullanıcının sistem tepsisinde kullanıcılara göstermenizi sağlar:

Nasıl görünür?

Zengin bildirimler dört farklı şekilde sunulur: temel, resim, liste ve ilerleme durumu. Tüm bildirimler bir başlık, mesaj, bildirim mesajının sol tarafında görüntülenen küçük bir simge ve daha açık renkli yazı tipinde 3. metin alanı olarak görüntülenen bir contentMessage alanını içerir.

Temel resim:

Liste bildirimlerinde istediğiniz sayıda liste öğesi gösterilir:

Resim bildirimleri bir resim önizlemesi içerir:

İlerleme bildirimlerinde bir ilerleme çubuğu gösterilir:

Nasıl davrandıkları

ChromeOS'te bildirimler kullanıcının sistem tepsisinde görünür ve kullanıcı kapatana kadar sistem tepsisinde kalır. Sistem tepsisi tüm yeni bildirimlerin sayısını gösterir. Kullanıcı, sistem tepsisinde bildirimleri gördüğünde sayı sıfırlanır.

Bildirimlere -2 ila 2 arasında bir öncelik atanabilir. 0'dan küçük öncelikler, ChromeOS bildirim merkezinde gösterilir ve diğer platformlarda hata oluşturur. Öncelik 0, varsayılan önceliktir. Süreyi artırmak için öncelikler 0 olarak gösterilir ve sistem tepsisinde daha yüksek öncelikli bildirimler görüntülenebilir.

Tüm bildirim türleri, bilgi görüntülemenin yanı sıra en fazla iki işlem öğesi içerebilir. Kullanıcılar bir işlem öğesini tıkladığında uygulamanız uygun işlemle yanıt verebilir. Örneğin, kullanıcı "Yanıtla"yı tıkladığında e-posta uygulaması açılır ve kullanıcı yanıtı tamamlayabilir:

Nasıl geliştirilir?

Bu API'yi kullanmak için notifications.create yöntemini çağırın ve bildirim ayrıntılarını options parametresiyle iletin:

chrome.notifications.create(id, options, creationCallback);

notifications.NotificationOptions, kullanılabilir bildirim ayrıntılarını ve bu ayrıntıların nasıl görüntüleneceğini tanımlayan bir notifications.TemplateType içermelidir.

Temel bildirim oluştur

Tüm şablon türleri (basic, image, list ve progress) bir bildirim title ve message simgesinin yanı sıra, bildirim mesajının sol tarafında görüntülenen küçük bir simgenin bağlantısı olan bir iconUrl içermelidir.

Aşağıda bir basic şablonu örneği verilmiştir:

var opt = {
  type: "basic",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon"
}

Resim bildirimi oluştur

image şablon türü, bildirim içinde önizlenen bir resmin bağlantısı olan imageUrl öğesini de içerir:

var opt = {
  type: "basic",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  imageUrl: "url_to_preview_image"
}

Chrome Uygulamalarında, katı bir İçerik Güvenliği Politikası nedeniyle bu URL'ler yerel bir kaynağa yönlendirmeli ya da bir blob veya veri URL'si kullanmalıdır. Resminiz için 3:2 en boy oranını kullanın; aksi takdirde resmi siyah bir kenarlıkla çerçeveleyin.

Liste oluşturma bildirimi

items öğesi, list şablonu liste biçiminde görüntülenir:

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."}]
}

İlerleme durumu bildirimi oluştur

progress şablonunda, mevcut ilerleme durumunun 0 ile 100 arasında olduğu bir ilerleme çubuğu görüntülenir:

var opt = {
  type: "progress",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  progress: 42
}

Etkinlikleri dinleme ve yanıtlama

Tüm bildirimler, kullanıcı işlemlerine yanıt veren etkinlik işleyicileri ve etkinlik işleyicileri içerebilir (bkz. chrome.events). Örneğin, bir notifications.onButtonClicked etkinliğine yanıt vermek için bir etkinlik işleyici yazabilirsiniz.

Etkinlik işleyici:

chrome.notifications.onButtonClicked.addListener(replyBtnClick);

Olay işleyici:

function replyBtnClick {
    //Write function to respond to user action.
}

Uygulama veya uzantı çalışmıyorken bile bildirimler görüntülenebilmesi için etkinlik sayfasına etkinlik işleyicileri ve işleyicileri ekleyebilirsiniz.