Útmutató: A Windows-alkalmazás létrehozása a GitHub Copilot segítségével

Ebben az oktatóanyagban a GitHub Copilot ügynök módban egy teljes WinUI 3-alkalmazás létrehozásához használja – egy egyszerű notes alkalmazás jegyzetlistával, bejegyzések hozzáadásának és törlésének lehetőségével, valamint egy beállításoldallal. Pontosan láthatja, hogy az egyes lépések során mely utasításokat kell használnia, és hogyan biztosítja a Copilot folyamatos pontosságát a WinUI 3 bővítmény és a Learn MCP-kiszolgáló.

WinUI 3-projekt kezdeti felállítása Copilot segítségével
XAML felhasználói felületet generáljon Copilot használatával
Üzleti logika hozzáadása a Copilot segítségével
Windows-értesítés hozzáadása a Learn MCP-kiszolgálóval
Az alkalmazás becsomagolása a winapp parancssori felületével

Előfeltételek

GitHub Copilot beállítása a WinUI 3 beépülő modullal és a Learn MCP kiszolgálóval — lásd: Set up GitHub Copilot for Windows development
Visual Studio 2026 a WinUI alkalmazásfejlesztés feladatkörrel
winapp CLI telepítve (winget install Microsoft.winappcli)

1. rész: A projekt állványzata

A WinUI-projekt létrehozása

Hozzon létre egy új WinUI 3 project: a Visual Studio válassza a File>New>Project, szűrjön WinUI alapján, és válassza a WinUI Blank App (Packaged) C# sablont. Nevezze el a projektet NotesApp , és nyissa meg.

Nyissa meg Copilot-ügynök módot, és építse fel a szerkezetet

Nyissa meg a Copilot Chat panelt Visual Studio, és váltson agent módra. Ezután írja be a következőt:

"Van egy új üres WinUI 3 projektem NotesApp néven. Állítson be egy MVVM-architektúrát a következő struktúrával: egy MainWindow navigációs nézettel, három oldallal (Jegyzetek, Kedvencek, Beállítások), egy ViewModels-mappával egy alapszintű ViewModel-osztálysal és egy NotesViewModel-tal, valamint egy Olyan Modell mappával, amely rendelkezik Azonosító, Cím, Tartalom és CreatedAt tulajdonságokkal. CommunityToolkit.Mvvm használata.

Copilot létrehozza a mappastruktúrát, hozzáadja a CommunityToolkit.Mvvm NuGet-csomag referenciáját, létrehozza az alaposztályokat, és leköti a NavigationView-t. Tekintse át a kimenetet – ha valami rosszul néz ki, kérje meg Copilot, hogy javítsa ki ugyanabban a csevegési munkamenetben.

Jótanács

Ha a Copilot Windows.UI.Xaml helyett Microsoft.UI.Xaml névtereket generál, a WinUI 3 beépülő modul egyéni utasításainak ennek fel kell ismernie. Ha ezt látja, kérje: "Javítsa ki a Windows.UI.Xaml minden példányát — ez egy WinUI 3-projekt, így minden XAML-névtérnek a Microsoft.UI.Xaml-t kell használni."

2. rész: A felhasználói felület létrehozása

A Jegyzetek lap létrehozása

"Hozza létre az XAML-t a Jegyzetek laphoz. A ListView-ben a jegyzeteknek meg kell jeleníteniük a Cím és a csonkolt tartalom előnézetét, alul el kell helyezni egy szövegmezőt és egy gombot az új jegyzet hozzáadásához, valamint minden elemhez egy Törlés gombot kell elhelyezni. Kössük hozzá a NotesViewModelhez. WinUI 3 vezérlők és Fluent Design térköz használata."

Copilot létrehozza a ViewModelhez kötött XAML-t. Kérje meg, hogy szükség szerint módosítsa a stílust vagy az elrendezést – például:

"A listaelemek olyan kártyastílust használnak, amely finom árnyékkal rendelkezik, hasonlóan a WinUI-katalógus kártyáinak példáihoz."

A Beállítások lap létrehozása

Hozzon létre egy Beállítások oldalt, amely tartalmaz egy sötét/világos téma közötti váltókapcsolót és egy "Minden jegyzet törlése" gombot egy megerősítő párbeszédpanellel. A ContentDialog használata a megerősítéshez – nem a MessageDialoghoz."

A WinUI 3 beépülő modul utasítása a Copilot számára ContentDialog (a helyes WinUI 3 megközelítést) irányítja, és az elavult MessageDialog irányából távolítja el.

3. rész: Üzleti logika hozzáadása

Jegyzetmegőrzés megvalósítása

"A jegyzetmegőrzés megvalósítása a NotesViewModelben a System.Text.Json használatával a jegyzetgyűjtemény szerializálásához és deszerializálásához az ApplicationData.Current.LocalFolder fájlban. Jegyzetek betöltése indításkor és mentés, amikor a gyűjtemény megváltozik."

Copilot létrehozza a terhelési/mentési logikát. Kérje meg, hogy adjon hozzá hibakezelést:

Tegyen try/catch blokkot a fájlműveletek köré, és naplózza a hibákat a debug kimenetre.

Témaváltás implementálása

"Implementálja a téma kapcsolót a SettingsViewModel-ben. Amikor a kapcsoló megváltozik, frissítse a RequestedTheme-et az alkalmazás főablakában a megfelelő WinUI 3 megközelítéssel."

4. rész: Windows-értesítés hozzáadása

A csomag identitása szükséges Windows értesítésekhez. Először állítsa be a winapp parancssori felületével:

winapp create-debug-identity --publisher "CN=NotesApp"

Most kérje meg Copilot, hogy adjon hozzá egy értesítést, amely egy jegyzet mentésekor aktiválódik:

"Adjon hozzá egy Windows alkalmazásértesítést, amely a jegyzetcímmel együtt a "Mentett jegyzet" feliratot jeleníti meg, ha egy jegyzetet sikeresen megőriz a lemezen. Használja a Windows App SDK AppNotificationManagert."

A Learn MCP-kiszolgáló csatlakoztatásával Copilot megkeresheti az aktuális AppNotificationBuilder API-t, és létrehozhatja a megfelelő értesítési kódot. A következőhöz hasonlót kell létrehoznia:

var notification = new AppNotificationBuilder()
    .AddText("Note saved")
    .AddText(note.Title)
    .BuildNotification();
AppNotificationManager.Default.Show(notification);

5. rész: Az alkalmazás csomagolása

Ha készen áll a Microsoft Store terjesztésére vagy közzétételére, hozzon létre egy megfelelő MSIX-csomagot:

winapp pack --output ./publish

Ez létrehoz egy aláírt MSIX-csomagot, amely készen áll az alternatív telepítésre vagy a Store-beküldésre. Kérj segítséget a Copilot-tól a csomagjegyzék frissítéséhez.

"Mutasd meg, hogyan frissíthető a Package.appxmanifest, hogy beállítsuk a megjelenítendő nevet, a leírást és a közzétevőt az Áruházba történő beküldéshez."

Összefoglalás

Készített egy komplett WinUI 3 jegyzetalkalmazást az alábbiak használatával:

Copilot-ügynök mód vázépítéshez, felhasználói felület generálásához és üzleti logikai feladatokhoz
WinUI 3 beépülő modul, amely biztosítja, hogy a Copilot végig a modern és helyes API-kat használja
MCP szerver megismerése a Windows App SDK értesítési API-k kereséséhez
winapp CLI csomagazonosításhoz és MSIX-csomagoláshoz

Nem kötelező: Eszközalapú AI hozzáadása az alkalmazáshoz

A jegyzetalkalmazás teljes mértékben működőképes – de továbbléphet egy olyan AI-funkció hozzáadásával, amely teljes egészében a felhasználó eszközén fut. A Foundry Local egyszerűvé teszi ezt: helyileg futtat egy nyelvi modellt, és egy OpenAI-kompatibilis API-t tesz elérhetővé.

Az Foundry Local telepítése és modell letöltése

winget install Microsoft.AIFoundry.Local
foundry model run phi-4-mini

A modell elindulása után figyel a következőre: http://localhost:5272/openai/v1.

A NuGet-csomag hozzáadása

dotnet add package Azure.AI.OpenAI

"Összegzés" gomb hozzáadása a Jegyzetek laphoz

Kérdezze meg Copilotot:

Adjunk hozzá egy "Összegző" gombot a Jegyzetek laphoz. Kattintáskor a kijelölt jegyzet tartalmát el kell küldenie a http://localhost:5272/openai/v1 helyi AI-végpontra az Azure.AI.OpenAI csomag használatával, és megjeleníteni az összegzést egy ContentDialogban. A modell neve phi-4-mini."

Copilot létrehozza a AzureOpenAIClient hívást és párbeszédpanelt – az OpenAI-kompatibilis API azt jelenti, hogy a kód ugyanúgy néz ki, mint egy felhőalapú API-hívás, csak a localhostra mutatva:

var client = new AzureOpenAIClient(
    new Uri("http://localhost:5272/openai/v1"),
    new ApiKeyCredential("foundry-local"));

var completion = await client.GetChatClient("phi-4-mini")
    .CompleteChatAsync($"Summarize this note in 2 sentences: {note.Content}");

Mit érzékel a felhasználó

Nincs szükség internetkapcsolatra. Nincs API-kulcs. A modell a PC-jükön fut – gyors, privát és ingyenes!