Delen via


Uw eerste WinUI 3-app maken

In deze reeks zelfstudies ziet u hoe u een WinUI-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 lokale app-storage. 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

Laatste schermopname van de notitie-app, met drie notities opslaan.

Notitiepagina

Laatste schermopname van de notitie-app, met een nieuwe lege notitie.

De Visual Studio project maken

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

  • Projectnaam

    Dit moet worden ingesteld op WinUINotes. Als de 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 project naam gebruikt als de standaardnaam naamruimte 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 Windows App SDK is bijgewerkt naar versie 1.7 of hoger.

Belangrijk

Als u nog geen WinUI-project hebt gemaakt, volgt u de stappen in Start 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 beschreven in Start ontwikkelen van Windows-apps), ziet u een leeg venster dat er als volgt uitziet:

Het notitie-app-venster met een titelbalk en een leeg inhoudsgebied.

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.