Notifications API'yi kullanma

chrome.notifications API, şablonları kullanarak bildirimler oluşturmanıza ve şu bildirimleri kullanıcının sistem tepsisinde kullanıcılara göstermenize olanak tanır:

Sistem kullanıcı tepsisindeki bildirimler

Nasıl görünür?

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

Temel bir bildirim:

Temel bildirim

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

Liste bildirimi

Resim bildirimleri bir resim önizlemesi içerir:

Resim bildirimi

İlerleme bildirimleri bir ilerleme çubuğu gösterir:

İlerleme durumu bildirimi

Nasıl davrandıkları

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

Bildirimlere -2 ile 2 arasında bir öncelik atanabilir. 0'dan küçük öncelikler, ChromeOS bildirim merkezinde gösterilir ve diğer platformlarda hata mesajı verir. Varsayılan öncelik 0'dır. Sürenin uzaması için 0'dan büyük öncelikler gösterilir ve sistem tepsisinde daha yüksek öncelikli bildirimler görüntülenebilir.

priority ayarı, macOS'te bildirimlerin sırasını etkilemez.

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 uzantını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:

Bildirimdeki işlem

Bunlar nasıl geliştirilir?

Bu API'yi kullanmak için options parametresini kullanarak bildirim ayrıntılarını ileterek notifications.create() yöntemini çağırın:

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

notifications.NotificationOptions, mevcut 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şturma

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

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

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

Resim kullanın

image şablon türü, bildirim içinde önizlenen bir resmin bağlantısı olan imageUrl öğesini de içerir. Resimlerin macOS'teki kullanıcılara gösterilmediğine dikkat edin.

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

Liste oluşturma bildirimi

list şablonu, items öğelerini liste biçiminde gösterir. macOS'teki kullanıcılara yalnızca ilk öğenin gösterildiğini unutmayın.

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

### Create progress notification {: #progress }

The `progress` template displays a progress bar where current progress ranges from 0 to 100. On macOS the progress bar displays as a percentage value in the notification title instead of in the progress bar.

```js
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 verecek 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.
}

Uzantı çalışmıyorken bile bildirimlerin görüntülenebilmesi için hizmet çalışanına etkinlik işleyiciler ve işleyiciler eklemeyi düşünün.