JavaScript'ten Bildirim Gösterme (JS bağlamaları)

Bu kılavuz, oluşturulan JS bağlamalarını kullanarak bir Windows Uygulama SDK'sı uygulama bildiriminin doğrudan Electron ana işlemindeki JavaScript’ten nasıl gösterileceğini açıklar.

Prerequisites

Bu kılavuza başlamadan önce şunları yaptığınızdan emin olun:

• Geliştirme ortamı kurulumu tamamlandı.

1. Adım: Elektron ana işleminden bir bildirim gösterme

Paket içeri aktarma aracılığıyla oluşturulan bağlamaları içeri aktarın #winapp/bindings , bir uygulama bildirimi oluşturun ve bunu varsayılan bildirim yöneticisiyle gösterin:

@microsoft/dynwinrt-codegen değerinin 0.1.0-preview.8 değerine eşit veya daha büyük olması gerekir. Daha eski projeler, npm i -D @microsoft/dynwinrt-codegen@latest && npx winapp init --add-js-bindings ile yükseltilerek winapp init’in #winapp/bindings import eşlemesini bağlamasını sağlayabilir ya da göreli require('../.winapp/bindings/index.js') biçimini koruyabilir (src/index.js konumuna göreli bir yoldur; giriş dosyanız başka bir yerde bulunuyorsa bunu ayarlayın).

// 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_Windows Uygulama SDK'sı Default özelliğini eşler. Oluşturulan bağlamalar, default bir JavaScript anahtar sözcüğü olduğu için sona _ ekler.

2. Adım: Çalıştırma

Bildirimler çalışmadan önce uygulamanızın kimlikle çalıştığından emin olun:

npx winapp node add-electron-debug-identity

Note

Bu komut zaten kurulum kılavuzuna postinstall eklenen betiğin bir parçasıdır, bu nedenle komutundan sonra npm installotomatik olarak çalışır. Bunu, Package.appxmanifest öğesini değiştirdiğinizde, uygulama varlıklarını güncellediğinizde veya bağımlılıkları yeniden yüklediğinizde manuel olarak çalıştırın.

Şimdi uygulamayı başlatın:

npm start

Ana süreç showNotification çağırdığında Windows Uygulama SDK'sı bildirimi görüntülenir.

Sonraki Adımlar

Tebrikler! Artık Electron uygulamanızdan Windows Uygulama SDK'sı bildirimleri gösterebiliyorsunuz — yerel eklenti yok, node-gypderleme adımı yok. 🎉

Artık şunu yapmaya hazırsınız:

• Dağıtım için Uygulamanızı Paketle — gönderebileceğiniz bir MSIX oluşturun ( @microsoft/dynwinrt çalışma zamanı zaten sizin içindedir dependencies).

Veya diğer kılavuzları keşfedin:

• JavaScript'ten Windows API'lerini çağır — bir dosya seçin ve JS bağlamalarını kullanarak görüntü boyutlarını okuyun.
• JavaScript'ten Phi Silica'yı çağırın: JS bağlamaları aracılığıyla Windows Uygulama SDK'sı AI ile metin özetleyin.
• JavaScript'ten WinML çalıştırma — ile onnxruntime-nodeWindows Uygulama SDK'sı ML sağlayıcısı bulma özelliğini kullanın.
• C++ Yerel Eklentisi oluşturma — bildirimler için yerel C++ eklentisi.
• Başlarken Genel Bakış — ana kılavuza dönün.

Ek Kaynaklar

• winapp CLI Belgeleri — tam CLI başvurusu (init, restore, node generate-bindings).
• Örnek Elektron Uygulaması — JS bağlamaları da dahil olmak üzere tam çalışma örneği.
• @microsoft/dynwinrt — oluşturulan bağlamaları destekleyen çalışma zamanı.
• @microsoft/dynwinrt-codegen — kod oluşturucu.