Een WinUI-app maken

Deze reeks zelfstudies laat zien hoe u een WinUI 3-app maakt met behulp van XAML en C#. De app die u maakt, is een notitie-app, waar de gebruiker meerdere notities kan maken, opslaan en laden. U kunt de code voor deze zelfstudie downloaden of bekijken vanuit de GitHub-opslagplaats.

In deze handleiding leer je hoe je:

• Gebruik XAML-markeringen om de gebruikersinterface van de app te definiëren.
• Interactie met XAML-elementen via C#-code.
• Bestanden opslaan en laden vanuit het lokale bestandssysteem.
• Maak weergaven en bind ze aan gegevens.
• Gebruik navigatie om naar en van pagina's in de app te gaan.
• Gebruik resources zoals documentatie en voorbeeld-apps om uw eigen app te maken.

U gebruikt Visual Studio 2022 om een app te maken die u kunt gebruiken om een notitie in te voeren en op te slaan in de lokale app-opslag. U vindt hier de broncode voor deze app. De app heeft twee pagina's:

• NotePage - een pagina voor het bewerken van één notitie.
• AllNotesPage - een pagina om alle opgeslagen notities weer te geven.

De laatste toepassing wordt hieronder weergegeven:

AllNotesPage

Notitiepagina

Het Visual Studio-project maken

Als u aan deze zelfstudie wilt beginnen, moet u een WinUI 3-app-project maken in Visual Studio met behulp van de Blank App, Packaged (WinUI 3 in Desktop) C#-projectsjabloon. Gebruik de volgende instellingen bij het maken van het project:

• Projectnaam

  Dit moet worden ingesteld op WinUINotes. Als het project een andere naam heeft, kan de code die u uit deze zelfstudie kopieert en plakt, leiden tot buildfouten. Dit komt doordat Visual Studio de projectnaam gebruikt als de standaardnaamruimte voor uw app-code.

• Windows App SDK

  In deze zelfstudie worden functies gebruikt die nieuw zijn in Windows App SDK 1.7. U moet ervoor zorgen dat het NuGet-pakket van de Windows App SDK is bijgewerkt naar versie 1.7 of hoger.

Belangrijk

Als u nog geen WinUI 3-project hebt gemaakt, volgt u de stappen in Beginnen met het ontwikkelen van Windows-apps om ervoor te zorgen dat uw ontwikkelomgeving en Visual Studio-project correct zijn ingesteld.

Wanneer u uw lege app-project uitvoert (zoals wordt beschreven in Beginnen met het ontwikkelen van Windows-apps), ziet u een leeg venster dat er als volgt uitziet:

Aanbeveling

U verwijst regelmatig naar API-referentiedocumenten en conceptuele documenten tijdens het bouwen van Windows-apps. In deze zelfstudie ziet u koppelingen inline in de tekst en in groepen met het label 'Meer informatie in de documenten:'. Deze koppelingen zijn optioneel; u hoeft deze niet te volgen om de zelfstudie te voltooien. Ze worden verstrekt als u wilt weten waar u de informatie kunt vinden die u nodig hebt wanneer u uw eigen apps gaat maken.

Doorgaan naar stap 1 - Project instellen