Kurz: Vytvoření první aplikace Windows App SDK v sadě Visual Studio pomocí XAML a jazyka C#

V tomto úvodu do integrovaného vývojového prostředí (IDE) sady Visual Studio vytvoříte aplikaci Hello World, která běží na jakémkoli zařízení s Windows 10 nebo novějším. K tomu použijete šablonu projektu sady Windows App SDK (WinUI 3), jazyk XAML (Extensible Application Markup Language) a programovací jazyk C#.

Poznámka

WinUI 3 je nativní komponenta platformy uživatelského rozhraní, která se dodává s Windows App SDK (zcela oddělená od sad SDK pro Windows). Další informace naleznete v tématu WinUI 3.

Pokud jste sadu Visual Studio ještě nenainstalovali, přejděte na stránku ke stažení sady Visual Studio a nainstalujte ji zdarma.

Požadavky

• K dokončení tohoto kurzu potřebujete Visual Studio. Navštivte stránku stažení sady Visual Studio pro bezplatnou verzi.

• Úlohy a komponenty potřebné k vývoji pomocí WinUI a sady Windows App SDK. Pokud chcete ověřit nebo nainstalovat úlohu v sadě Visual Studio, vyberte Tools>Získat nástroje a funkce. Další informace najdete v tématu Změna úloh nebo jednotlivých komponent.

  Na kartě Úlohy instalačního programu sady Visual Studio vyberte následující úlohy a komponenty:

  Visual Studio 2022 verze 17.10 a novější

  • Pokud chcete vývoj aplikací jazyka C# pomocí sady Windows App SDK, vyberte vývoj aplikací pro Windows.

  Visual Studio 2022 verze 17.1 – 17.9

  • Pokud chcete vývoj aplikací jazyka C# pomocí sady Windows App SDK, vyberte vývoj desktopových aplikací .NET.
  • Potom v podokně podrobností o instalaci dialogového okna instalace vyberte šablony sady Windows App SDK C# (v dolní části seznamu).

Vytvoření projektu

Nejprve vytvořte projekt WinUI 3. Typ projektu obsahuje všechny soubory šablony, které potřebujete, ještě předtím, než něco přidáte.

1. Otevřete Visual Studio a v úvodním okně zvolte Vytvořit nový projekt.

2. Na obrazovce Vytvořit nový projekt zadejte do vyhledávacího pole WinUI, zvolte šablonu jazyka C# pro Prázdnou aplikaci, zabalenou (WinUI 3 v desktopovéverzi) a pak zvolte Další.

   

3. Pojmenujte projekt, HelloWorld a zvolte Vytvořit.

   

   Poznámka

   Pokud jste k vytvoření aplikace Windows App SDK použili Visual Studio poprvé, může se zobrazit dialogové okno nastavení. Zvolte Vývojářský režim a pak zvolte Ano.
   
   
   
   Visual Studio za vás nainstaluje další balíček vývojářského režimu. Po dokončení instalace balíčku zavřete dialogové okno nastavení.

Vytvoření aplikace

Je čas začít vyvíjet. Přidáte ovládací prvek tlačítka, přidáte do něj akci a pak spustíte aplikaci Hello World, abyste viděli, jak vypadá.

Přidejte tlačítko na plátno návrhu

1. V Průzkumníku řešení dvojklikem na MainWindow.xaml otevřete editor značek XAML.

   

   Editor XAML je místo, kde můžete přidávat nebo měnit značkování. Na rozdíl od projektů UPW nemá WinUI 3 návrhové zobrazení.

   

2. Zkontrolujte ovládací prvek Button vnořený v StackPanel v kořenovém adresáři okna.

   

Změna popisku na tlačítku

1. V editoru XAMLzměňte hodnotu obsahu tlačítka z "Click me" na "Hello World!".

   

2. Všimněte si, že tlačítko obsahuje také obslužnou rutinu události Click s názvem myButton_Click zadána. K tomu se dostaneme v dalším kroku.

   

Úprava obslužné rutiny události

Obslužná rutina události zní složitě, ale je to jen jiné označení pro kód, který se spouští, když dojde k události. V tomto případě přidá akci aktivovanou tlačítkem "Hello World!".

1. V Průzkumníku řešenídvakrát klikněte na MainWindow.xaml.cs, na stránku s kódem.

2. Upravte kód obslužné rutiny události v okně editoru C#, které se otevře.

   Tady je místo, kde jsou věci zajímavé. Výchozí obslužná rutina události vypadá takto:

   

   Pojďme ho změnit, aby vypadal takto:

   

   Tady je kód, který chcete zkopírovat a vložit:

   private async void myButton_Click(object sender, RoutedEventArgs e)
   {
       var welcomeDialog = new ContentDialog()
       {
           Title = "Hello from HelloWorld",
           Content = "Welcome to your first Windows App SDK app.",
           CloseButtonText = "Ok",
           XamlRoot = myButton.XamlRoot
       };
       await welcomeDialog.ShowAsync();
   }
   

Co jsme udělali?

Kód používá ovládací prvek ContentDialog k zobrazení uvítací zprávy v modálním vyskakovacím okně v aktuálním okně. (Další informace o používání Microsoft.UI.Xaml.Controls.ContentDialognaleznete v tématu ContentDialog – třída.)

Spuštění aplikace

Je čas sestavit, nasadit a spustit aplikaci "Hello World" sady Windows App SDK, abyste viděli, jak vypadá. Tady je postup.

1. Pomocí tlačítka Přehrát (obsahuje text HelloWorld (balíček)) spusťte aplikaci na místním počítači.

   

   (Můžete také zvolit Ladění>Spustit ladění na liště nabídek nebo stisknutím F5 spustit svou aplikaci.)

2. Zobrazte si aplikaci, která se zobrazí brzy po tom, co úvodní obrazovka zmizí. Aplikace by měla vypadat podobně jako na tomto obrázku:

   

3. Vyberte tlačítko Hello World.

   Vaše zařízení s Windows 10 nebo novějším zobrazí zprávu "Vítejte v první aplikaci Windows App SDK" s názvem "Hello from HelloWorld". Kliknutím na OK zprávu zavřete.

   

4. Aplikaci zavřete tak, že na panelu nástrojů vyberete tlačítko Zastavit ladění. (Případně zvolte Ladění>Zastavit ladění na panelu nabídek nebo stiskněte Shift+F5.)

Další kroky

Blahopřejeme k dokončení tohoto kurzu! Doufáme, že jste se naučili některé základní informace o sadě Windows App SDK, WinUI 3 a integrovaném vývojovém prostředí sady Visual Studio. Další informace najdete v následujícím kurzu:

Kurz: Vytvoření jednoduchého prohlížeče fotek pomocí WinUI 3

Viz také

• Psaní aplikací pro Windows: Výběr vývojové technologie
• Přehled sady Windows App SDK
• ukázky sady Windows App SDK / WinUI 3