次の方法で共有

Electron の C++ 通知アドオンの作成

このガイドでは、Electron アプリでWindows App SDK通知 API を使用する C++ ネイティブ アドオンを作成する方法について説明します。 これは、より複雑なシナリオに進む前にネイティブ アドオンを理解するための優れた出発点です。

[前提条件]

手順 1: C++ ネイティブ アドオンを作成する

winapp CLI を使用して C++ アドオン テンプレートを生成します。

npx winapp node create-addon --template cpp --name nativeWindowsAddon

これにより、次の nativeWindowsAddon/ フォルダーが作成されます。

  • addon.cc - Windows API を呼び出す C++ コード
  • binding.gyp - ネイティブ コンパイルのビルド構成

このコマンドでは、build-addonにpackage.json スクリプトも追加します。

アドオンをビルドします。

npm run build-addon

手順 2: 通知コードを追加する

nativeWindowsAddon/addon.cc を開き、Windows App SDK通知 API を使用するように更新します。 生成されたテンプレートには、必要な Windows SDK とWindows App SDKヘッダーが含まれています。

通知 API のインクルードを追加します。

#include <winrt/Microsoft.Windows.AppNotifications.h>
#include <winrt/Microsoft.Windows.AppNotifications.Builder.h>

Windows 通知を表示する関数を追加します。

Napi::Value ShowNotification(const Napi::CallbackInfo& info) {
    Napi::Env env = info.Env();

    try {
        std::string title = info[0].As<Napi::String>().Utf8Value();
        std::string message = info[1].As<Napi::String>().Utf8Value();

        winrt::Microsoft::Windows::AppNotifications::Builder::AppNotificationBuilder builder;
        builder.AddText(winrt::to_hstring(title));
        builder.AddText(winrt::to_hstring(message));

        auto notification = builder.BuildNotification();
        winrt::Microsoft::Windows::AppNotifications::AppNotificationManager::Default().Show(notification);

        return Napi::Boolean::New(env, true);
    } catch (const winrt::hresult_error& e) {
        Napi::Error::New(env, winrt::to_string(e.message())).ThrowAsJavaScriptException();
        return env.Null();
    }
}

Init メソッドに関数を登録します。

exports.Set("showNotification", Napi::Function::New(env, ShowNotification));

手順 3: アドオンをビルドする

npm run build-addon

手順 4: 通知をテストする

src/index.jsを開き、アドオンを読み込みます。

const addon = require('../nativeWindowsAddon/build/Release/nativeWindowsAddon.node');

テスト呼び出しを追加します。

addon.showNotification('Hello from Electron!', 'This notification uses the Windows App SDK.');

アプリを実行します。

npm start

Windows 通知が表示されます。

手順 5: デバッグ ID を更新する

appxmanifest.xmlを変更するたびに、次のコマンドを実行します。

npx winapp node add-electron-debug-identity

次のステップ

  • Last updated on