使用 Electron 調用基本或附帶圖像的通知

GT 發布于2019-08-21 16:58 / 3271人閱讀

摘要：使用調用基本或附帶圖像的通知此系列文章的應用示例已發布于可以或下載后運行查看歡迎使用中的模塊可以允許你增加基本的桌面通知允許開發者使用發送通知并使用當前操作系統的原生通知來顯示注意由于這是一個它只能在渲染器進程中使用在瀏覽器中查看完整

使用 Electron 調用基本或附帶圖像的通知

此系列文章的應用示例已發布于 GitHub: electron-api-demos-Zh_CN. 可以 Clone 或下載后運行查看. 歡迎 Star .

使用 Electron 中的 notification 模塊可以允許你增加基本的桌面通知.

Electron 允許開發者使用 HTML5 Notification API 發送通知, 并使用當前操作系統的原生通知 API 來顯示.

注意: 由于這是一個 HTML5 API, 它只能在渲染器進程中使用.

在瀏覽器中查看完整 API 文檔 .

基本通知

支持: Win 7+, macOS, Linux (支持 libnotify) | 進程: 渲染器

此示例演示了一個基本的通知. 只含有文字.

渲染器進程

const notification = {
  title: "基本通知",
  body: "短消息部分"
}
const notificationButton = document.getElementById("basic-noti")

notificationButton.addEventListener("click", function () {
  const myNotification = new window.Notification(notification.title, notification)

  myNotification.onclick = () => {
    console.log("Notification clicked")
  }
})

附帶圖像的通知

支持: Win 7+, macOS, Linux (支持 libnotify) | 進程: 渲染器

此示例演示了一個基本的通知. 同時含有文字和圖像.

渲染器進程

const path = require("path")

const notification = {
  title: "附帶圖像的通知",
  body: "短消息附帶自定義圖片",
  icon: path.join(__dirname, "../../../assets/img/programming.png")
}
const notificationButton = document.getElementById("advanced-noti")

notificationButton.addEventListener("click", function () {
  const myNotification = new window.Notification(notification.title, notification)

  myNotification.onclick = () => {
    console.log("Notification clicked")
  }
})

如果這邊文章對您有幫助, 感謝下方點贊或 Star GitHub: electron-api-demos-Zh_CN 支持, 謝謝.

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/88980.html

開發了一款寫作軟件(OSX,Windows)，附帶Electron開發指南

摘要：本來寫這個項目時就沒打算來自己實現富文本編輯器，本著能用開源就用開源的原則，在項目里測試了一些開源的編輯器，發現或多或少都有些問題，后來一琢磨，反正這個項目的富文本編輯器需求不復雜，就自己實現一個好了。斷斷續續寫了個把月，終于在昨天完成了第一版… 筆落寫作一款幫助網絡寫手更方便地進行小說創作的PC軟件，目前支持 OSX/Windows 名字靈感來自于杜甫的一首詩，前兩句是：《寄...

OnlyLing 2019-08-22 17:16 評論0 收藏0
React Native 常用的 15 個庫

摘要：聲明式用法只需使用動畫的名稱，該動畫將在加載該元素時立即生效。實際案例這個庫支持本地推送通知功能比較全面。實際案例具有縮放支持，回調，縮放以適應和滾動指示器支持的組件。這是圖像上傳或圖像處理的基本庫。本篇 React native 庫列表不是從網上隨便找的，這些是我在我的應用中親自使用的庫。這些庫功能可能跟其它庫也有，但經過大量研究并在我的程序中嘗試后，我選擇了這些庫。想閱讀更...

Juven 2019-08-23 16:56 評論0 收藏0
FCC 成都社區·前端周刊第 10 期

摘要：正式發布在過去的一周，正式發布，帶來大量改進和修復。這是自開展以來的第七個主要版本，并將在年月成為下一個分支。以后，如果使用具有已知安全問題的代碼，的用戶會收到警告通知。將自動檢查針對數據庫的安裝請求，并在代碼包含漏洞時發出警告通知。 1. Node.js 10 正式發布在過去的一周，Node.js 10.0.0 正式發布，帶來大量改進和修復。這是自 Node.js Foundati...

BigNerdCoding 2019-08-29 15:13 評論0 收藏0
FCC 成都社區·前端周刊第 10 期

摘要：正式發布在過去的一周，正式發布，帶來大量改進和修復。這是自開展以來的第七個主要版本，并將在年月成為下一個分支。以后，如果使用具有已知安全問題的代碼，的用戶會收到警告通知。將自動檢查針對數據庫的安裝請求，并在代碼包含漏洞時發出警告通知。 1. Node.js 10 正式發布在過去的一周，Node.js 10.0.0 正式發布，帶來大量改進和修復。這是自 Node.js Foundati...

li21 2019-08-26 11:51 評論0 收藏0