使用 Electron 调用基本或附带图像的通知

GT 发布于2019-08-21 16:58 / 3274人阅读

摘要：使用调用基本或附带图像的通知此系列文章的应用示例已发布于可以或下载后运行查看欢迎使用中的模块可以允许你增加基本的桌面通知允许开发者使用发送通知并使用当前操作系统的原生通知来显示注意由于这是一个它只能在渲染器进程中使用在浏览器中查看完整

使用 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 支持, 谢谢.

GPU云服务器云服务器 electron使用webrtc jdbc调用数据库的基本步骤验证码或短信通知数据库的基本使用

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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