在 Windows 平台上启用电子应用程序通知的粘性行为

Nis*_*aba 5 javascript notifications electron node-notifier angular

我想在电子桌面应用程序中实现通知的粘性行为,直到用户单击通知本身。

我正在使用node-notifier来实现此文档,并使用ngx-electron使用 ElectronService 在角度组件文件中导入 main.js 文件。

这是我的main.js文件:

const notifier = require('node-notifier')
exports.notifier = (msg) =>  {
  notifier.notify({
  title: 'Notify Me',
  message: msg,
  wait: true,
  timeout: 1500000,
  sound: true,
  icon:  './assets/images/logo.png'
});
Run Code Online (Sandbox Code Playgroud)

app.component.ts :

import {ElectronService} from 'ngx-electron';
@Component({
  selector: 'app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  public main_js : any;

  constructor(private _electronService: ElectronService ) { 
    this.main_js  = this._electronService.remote.require("./main.js");
    this.getTasks();
  }

  getTasks() {
    var message = 'New Task Assigned!!!';
    this.main_js.notifier(message);
  }
}
Run Code Online (Sandbox Code Playgroud)

电子应用程序通知

电子通知

目前,我正在 Windows 平台上检查此通知行为,并且该通知保持粘性,直到并且除非用户采取任何操作,包括从键盘按下任何键或任何鼠标移动。

我希望通知卡在屏幕上,直到用户单击通知本身的关闭标签,而不是在单击屏幕的任何其他部分时关闭。

gau*_*hla 1

好吧,我无法在电子中实现通知的粘性行为。然而,我找到了一个很棒的替代方案,那就是Electron_Tray和 Node-Notifier\n Balloon_Notifications的组合。

\n\n

最好的部分是它可以在WindowsLinux上运行\n像魅力一样的平台最终提供了跨平台功能。我还没有在 mac 上测试过它,也许它也能在 mac 上运行。这是我测试过的代码:

\n\n

应用程序组件.ts

\n\n

\r\n
\r\n
import {ElectronService} from \'ngx-electron\';\r\n  @Component({\r\n    selector: \'app\',\r\n    templateUrl: \'./app.component.html\',\r\n    styleUrls: [\'./app.component.css\']\r\n  })\r\n  export class AppComponent implements OnInit {\r\n    public main_js : any;\r\n\r\n    constructor(private _electronService: ElectronService ) {\r\n      this.main_js\xc2\xa0 = this._electronService.remote.require("./main.js");\r\n      this.getTasks();\r\n    }\r\n\r\n    getTasks() {\r\n      var message = \'New Task Assigned!!!\';\r\n      this.main_js.notifier(message);\r\n  }\r\n}
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n\n

main.js

\n\n

\r\n
\r\n
let tray = null\r\n\r\nfunction createWindow () {\r\n  win = new BrowserWindow({\r\n    width: 800,\r\n    height: 600,\r\n    icon: path.join(__dirname, \'dist/assets/images/logo.png\')\r\n  })\r\n\r\n  // +++++++\xc2\xa0 TRAY NOTIFICATIONS\xc2\xa0 +++++++++ //\r\n  var icon_tray = path.join(__dirname,\'dist\',\'assets\',\'images\',\'logo.png\');\r\n\r\n  tray = new Tray(icon_tray)\r\n\r\n  const trayMenuTemplate = [\r\n  {\r\n    label: \'Maximize\',\r\n    click: function () {\r\n      //For Maximizing the Window\r\n      if(!win.isVisible()) { win.show() }\r\n    }\r\n  },\r\n\r\n  {\r\n    label: \'Minimize\',\r\n    click: function () {\r\n      //For Minimizing the Window\r\n      if(win.isVisible()) { win.hide() }\r\n    }\r\n  }]\r\n\r\n  tray.setToolTip(\'I am Notifier!!!\')\r\n  let trayMenu = Menu.buildFromTemplate(trayMenuTemplate)\r\n  tray.setContextMenu(trayMenu)\r\n  tray.displayBalloon({\r\n    title: \'Notifier Realm\',\r\n    content: \'Greetings!!!\',\r\n    icon: icon_tray\r\n  });\r\n\r\n  tray.on(\'click\', () => {\r\n    win.isVisible() ? win.hide() : win.show()\r\n  })\r\n}\r\n\r\nexports.notifier = (msg) =>\xc2\xa0 {\r\n// pops out the app window if minimized and show the notification \r\n  if(win.isVisible()){\r\n    // win.hide()\r\n  } else {\r\n    win.show()\r\n  }\r\n  if(msg != undefined) {\r\n    notifier.notify({\r\n      title: \'Nethues Notify\',\r\n      message: msg,\r\n      wait: true,\r\n      icon:\xc2\xa0 \'./assets/images/logo.png\'\r\n    });\r\n  }\r\n}
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n\n

现在,每当应用程序窗口最小化并且由不同的用户分配新任务时,该窗口就会在所有应用程序(无论在屏幕上打开的任何应用程序)上方弹出,并向用户显示新分配的任务通知。

\n