Mostrar uma Notificação de JavaScript (ligações JS)

Este guia mostra como apresentar diretamente, a partir do JavaScript do processo principal do Electron, uma notificação de uma aplicação SDK de Aplicações Windows, recorrendo a associações JavaScript geradas.

Pré-requisitos

Antes de começar este guia, certifique-se de que:

Passo 1: Mostrar uma notificação do processo principal da Electron

Importa as ligações geradas através da #winapp/bindings importação de pacotes, cria uma notificação de aplicação e mostra-a com o gestor de notificações predefinido:

Requer @microsoft/dynwinrt-codegen0.1.0-preview.8. Os projetos mais antigos podem atualizar com npm i -D @microsoft/dynwinrt-codegen@latest && npx winapp init --add-js-bindings para que winapp init configure o mapa de importações do #winapp/bindings, ou manter a forma relativa require('../.winapp/bindings/index.js') (o caminho é relativo a src/index.js; ajusta-o se o ficheiro de entrada estiver noutro local).

// src/index.js (Electron main, CommonJS)
const {
  AppNotificationBuilder,
  AppNotificationManager,
} = require('#winapp/bindings');

function showNotification(title, message) {
  const notification = AppNotificationBuilder
    .create()
    .addText(title)
    .addText(message)
    .buildNotification();

  AppNotificationManager.default_.show(notification);
}

const createWindow = () => {
  // ... existing window creation code ...

  // Test the Windows App SDK notification
  showNotification(
    'Hello from Electron!',
    'This notification is powered by the Windows App SDK!'
  );
};

Note

AppNotificationManager.default_ mapeia a propriedade do SDK de Aplicações Windows Default. As ligações geradas adicionam o final _ porque default é uma palavra-chave JavaScript.

Passo 2: Executa

Antes de as notificações funcionarem, certifique-se de que a sua aplicação corre com identidade:

npx winapp node add-electron-debug-identity

Note

Este comando já faz parte do postinstall script adicionado no guia de configuração, por isso corre automaticamente após npm install. Executa-o manualmente sempre que modificares Package.appxmanifest, atualizares ativos da aplicação ou reinstalares dependências.

Agora inicia a aplicação:

npm start

A notificação do SDK de Aplicações Windows aparece quando o processo principal chama showNotification.

Próximas Etapas

Parabéns! Agora pode mostrar notificações do SDK de Aplicações Windows na sua aplicação Electron — sem extensão nativa, sem o passo de compilação node-gyp. 🎉

Agora está pronto para:

Ou explore outros guias:

Recursos adicionais