Membuat addon pemberitahuan C++ untuk Electron

Panduan ini menunjukkan cara membuat addon asli C++ yang menggunakan API pemberitahuan Windows App SDK di aplikasi Electron Anda. Ini adalah titik awal yang bagus untuk memahami addon asli sebelum menyelami skenario yang lebih kompleks.

Prasyarat

• Menyelesaikan penyiapan lingkungan pengembangan
• Windows 11

Langkah 1: Membuat addon asli C++

Gunakan CLI winapp untuk menghasilkan templat addon C++:

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

Ini membuat sebuah folder nativeWindowsAddon/ dengan:

• addon.cc - Kode C++ Anda yang akan memanggil API Windows
• binding.gyp - Konfigurasi build untuk kompilasi asli

Perintah ini juga menambahkan build-addon skrip ke dalam package.json Anda.

Membangun fungsi tambahan:

npm run build-addon

Langkah 2: Tambahkan kode pemberitahuan

Buka nativeWindowsAddon/addon.cc dan perbarui untuk menggunakan API pemberitahuan Windows App SDK. Templat yang dihasilkan mencakup header Windows SDK dan Windows App SDK yang diperlukan.

Tambahkan termasuk untuk API pemberitahuan:

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

Tambahkan fungsi yang memperlihatkan pemberitahuan 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();
    }
}

Daftarkan fungsi dalam Init metode :

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

Langkah 3: Bangun addon

npm run build-addon

Langkah 4: Uji pemberitahuan

Buka src/index.js dan muat addon:

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

Tambahkan panggilan pengujian:

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

Jalankan aplikasi:

npm start

Anda akan melihat pemberitahuan Windows muncul.

Langkah 5: Memperbarui identitas debug

Setiap kali Anda memodifikasi appxmanifest.xml, jalankan:

npx winapp node add-electron-debug-identity

Langkah berikutnya

• Membuat addon Phi Silica - Gunakan API AI di perangkat
• Buat addon WinML - Menjalankan model machine learning
• Pengemasan untuk distribusi - Buat Paket MSIX Bertanda Tangan

Topik terkait

• Menyiapkan Electron untuk pengembangan WINDOWS API
• CLI winapp referensi
• API pemberitahuan Windows App SDK