Notifications API'yi kullanma

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

Görünüm

Zengin bildirimler dört farklı şekilde sunulur: temel, resim, liste ve ilerleme. Tüm bildirimlerde başlık, mesaj, bildirim mesajının solunda gösterilen küçük simge ve daha açık renkli bir yazı tipiyle üçüncü metin alanı olarak gösterilen contextMessage alanı bulunur.

Temel bildirim:

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

Resim bildirimlerinde resim önizlemesi bulunur:

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

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 tepsisinde tüm yeni bildirimlerin sayısı gösterilir. Kullanıcılar sistem tepsisindeki bildirimleri gördükten sonra sayı sıfırlanır.

Bildirimlere -2 ile 2 arasında bir öncelik atanabilir. Önceliği 0'dan düşük olan bildirimler ChromeOS bildirim merkezinde gösterilir ve diğer platformlarda hataya neden olur. Varsayılan öncelik 0'dır. 0'dan büyük öncelikler, süreleri artacak şekilde gösterilir ve sistem tepsisinde daha fazla yüksek öncelikli bildirim görüntülenebilir.

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

Tüm bildirim türleri, bilgi göstermenin 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:

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 browser.notifications.create(id, options);

notifications.NotificationOptions, mevcut bildirim ayrıntılarını ve bu ayrıntıların nasıl görüntülendiğ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'ın yanı sıra bildirim mesajının solunda gösterilen küçük bir simgeye yönlendiren bağlantı olan bir 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"
}

Görsel kullanma

image şablon türünde, bildirimde önizlenen bir resmin bağlantısı olan imageUrl de bulunur. Resimlerin macOS'teki kullanıcılara gösterilmediğini unutmayın.

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

Liste bildirimi oluşturma

list şablonu, items öğesini 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 dinleyicileri ve etkinlik işleyicileri içerebilir (bkz. browser.events). Örneğin, bir notifications.onButtonClicked etkinliğine yanıt vermek için bir etkinlik işleyici yazabilirsiniz.

Etkinlik işleyici:

browser.notifications.onButtonClicked.addListener(replyBtnClick);

Etkinlik işleyici:

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

Bildirimlerin uzantı çalışmıyorken bile gösterilebilmesi için etkinlik işleyicileri ve işleyicileri hizmet çalışanına eklemeyi düşünebilirsiniz.