Vytvořte svou první aplikaci

V tomto kurzu se dozvíte, jak vytvořit a spustit první aplikaci .NET Multi-Platform App UI (.NET MAUI) v sadě Visual Studio 2022 ve Windows nebo Visual Studio Code ve Windows, macOS nebo Linuxu. Pomůže vám to zajistit správné nastavení vývojového prostředí.

Visual Studio

Požadavky

• Visual Studio 2022 17.12 nebo novější s nainstalovanou úlohou uživatelského rozhraní pro více platforem .NET Další informace naleznete v tématu Instalace.

Vytvořit aplikaci

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v sadě Visual Studio 2022 a spustíte ji v emulátoru Androidu:

Vývoj aplikací .NET MAUI pro iOS ve Windows vyžaduje hostitele buildu Pro Mac. Pokud konkrétně nepotřebujete cílit na iOS a nemáte Mac, zvažte místo toho, jak začít s Androidem nebo Windows.

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v sadě Visual Studio a spustíte ji v simulátoru iOS:

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v sadě Visual Studio 2022 a spustíte ji ve Windows:

1. Spusťte Visual Studio 2022. V úvodním okně klikněte na Vytvořit nový projekt a vytvořte nový projekt:

   

2. V okně Vytvořit nový projekt vyberte MAUI v rozevíracím seznamu Všechny typy projektů, vyberte šablonu aplikace .NET MAUI a klikněte na tlačítko Další:

   

3. V okně Konfigurovat nový projekt pojmenujte projekt, zvolte pro něj vhodné umístění a klikněte na tlačítko Další:

   

4. V okně Další informace zvolte verzi rozhraní .NET, na kterou chcete cílit, a klikněte na tlačítko Vytvořit:

   

5. Počkejte, až se projekt vytvoří a obnoví se jeho závislosti:

   

6. Na panelu nástrojů sady Visual Studio pomocí rozevíracího seznamu Cíl ladění vyberte emulátory Androidu a potom položku Android Emulator:

   

7. Na panelu nástrojů sady Visual Studio stiskněte tlačítko Android Emulator :

   

   Visual Studio spustí proces instalace výchozí sady Android SDK a Android Emulatoru.

8. V okně Android SDK – Licenční smlouva stiskněte tlačítko Přijmout :

   

9. V dialogovém okně Řízení uživatelských účtů stiskněte tlačítko Ano:

   

   Počkejte, až sada Visual Studio stáhne výchozí sadu Android SDK a Android Emulator.

10. V dialogovém okně Řízení uživatelských účtů stiskněte tlačítko Ano:

    

11. V dialogovém okně Pro platformu Android SDK chybí stiskněte tlačítko Nainstalovat :

    

12. V okně Android SDK – Licenční smlouva stiskněte tlačítko Přijmout :

    

    Počkejte, až sada Visual Studio nainstaluje součásti sady Android SDK.

13. V okně Nové zařízení stiskněte tlačítko Vytvořit :

    

    Počkejte, až visual Studio stáhne, rozbalí a vytvoří emulátor Androidu.

14. Zavřete okno Správce zařízení Androidu:

    

15. Na panelu nástrojů sady Visual Studio stiskněte tlačítko Pixel 7 – API 35 (Android 15.0 – API 35 ):

    

16. V okně Android SDK – Licenční smlouva stiskněte tlačítko Přijmout :

    

17. V dialogovém okně Řízení uživatelských účtů stiskněte tlačítko Ano:

    

    Počkejte, až se sada Visual Studio nainstaluje, aby se stáhla sada Android SDK.

18. Na panelu nástrojů sady Visual Studio stisknutím tlačítka Pixel 7 – API 35 (Android 15.0 – API 35) sestavte a spusťte aplikaci:

    

    Visual Studio spustí emulátor Androidu, sestaví aplikaci a nasadí ji do emulátoru.

    Upozorňující

    Aby se maximalizoval výkon emulátoru Androidu, musí být povolená hardwarová akcelerace. Pokud to neuděláte, dojde k velmi pomalému spuštění emulátoru. Další informace naleznete v tématu Jak povolit hardwarovou akceleraci pomocí emulátorů Androidu (Hyper-V &AEHD).

19. V běžící aplikaci v emulátoru Androidu několikrát stiskněte tlačítko Kliknout na mě a všimněte si, že počet kliknutí na tlačítko se zvýší.

    

Řešení problému

Pokud se vaší aplikaci nepodaří zkompilovat, projděte si řešení známých problémů, které můžou mít řešení vašeho problému. Pokud problém souvisí s emulátorem Androidu, přečtěte si téma Řešení potíží s emulátorem Androidu.

6. Na panelu nástrojů sady Visual Studio stisknutím tlačítka Počítače s Windows sestavte a spusťte aplikaci:

   

7. V běžící aplikaci několikrát stiskněte tlačítko Kliknout na mě a všimněte si, že počet kliknutí na tlačítko se zvýší:

   

Řešení problému

Pokud se vaší aplikaci nepodaří zkompilovat, projděte si řešení známých problémů, které můžou mít řešení vašeho problému.

6. V sadě Visual Studio spárujte integrované vývojové prostředí (IDE) s hostitelem sestavení mac. Další informace najdete v tématu Párování s Macem pro vývoj pro iOS.

7. Na panelu nástrojů sady Visual Studio vyberte pomocí rozevíracího seznamu Cíl ladění simulátory iOS a pak konkrétní simulátor iOS:

   

8. Na panelu nástrojů sady Visual Studio stiskněte tlačítko Start pro vybraný simulátor iOS a sestavte a spusťte aplikaci:

   

   Visual Studio sestaví aplikaci, spustí vzdálený simulátor iOS pro Windows a nasadí aplikaci do vzdáleného simulátoru. Další informace o vzdáleném simulátoru iOS pro Windows naleznete v tématu Vzdálený simulátor iOS pro Windows.

9. V běžící aplikaci několikrát stiskněte tlačítko Kliknout na mě a všimněte si, že počet kliknutí na tlačítko se zvýší.

   

Řešení problému

Pokud se vaší aplikaci nepodaří zkompilovat, projděte si řešení známých problémů, které můžou mít řešení vašeho problému.

Aplikace .NET MAUI, které cílí na Mac Catalyst, je možné spustit a ladit pouze pomocí editoru Visual Studio Code.

Visual Studio Code

Požadavky

• Visual Studio Code s nainstalovaným a nakonfigurovaným rozšířením .NET MAUI:
  • Váš účet Microsoft je připojen k sadě C# Dev Kit.
  • Nainstalovaná sada .NET SDK.
  • Nainstalovaná sada .NET MAUI SDK.
  • Xcode nainstalovaný na vašem Macu, včetně runtime simulátoru a nástrojů příkazového řádku Xcode pro cílení na platformy Apple.
  • Microsoft OpenJDK, Android SDK a emulátor Android nainstalovaný na vašem počítači, pokud cílí na Android.

Další informace naleznete v tématu Instalace.

Vytvořit aplikaci

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v editoru Visual Studio Code a spustíte ji v emulátoru Androidu:

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v editoru Visual Studio Code na Macu a spustíte ji v simulátoru iOS:

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v editoru Visual Studio Code na Macu a spustíte ji v systému macOS:

V tomto kurzu vytvoříte svou první aplikaci .NET MAUI v editoru Visual Studio Code ve Windows a spustíte ji ve Windows:

1. Spusťte editor Visual Studio Code. V Průzkumníkustiskněte Vytvořit projekt .NET:

   

   Můžete také stisknout kombinaci kláves Ctrl+Shift+P ve Windows nebo Cmd+Shift+P v macOS a pak příkaz .NET: Nový projekt...

2. V příkazové paletě vyberte šablonu .NET MAUI aplikace:

   

3. V dialogovém okně Umístění projektu vyberte umístění, kam chcete nový projekt vytvořit.

   Důležitý

   Projekty musí být vytvořeny v prázdné složce.

4. Na paletě příkazů zadejte název nového projektu a stiskněte ENTER:

   

5. Na paletě příkazů stiskněte Vytvořit projekt:

   

   Počkejte na vytvoření projektu a v případě potřeby přijměte složku jako důvěryhodné umístění.

6. V průzkumníku rozbalte kořenový uzel projektu a otevřete soubor jazyka C#, například MainPage.xaml.cs:

   

7. V editoru Visual Studio Code ověřte, že je vaše prostředí Androidu správně nakonfigurované, a to stisknutím kombinace kláves Ctrl+Shift+P ve Windows nebo Cmd+Shift+P v systému macOS a následným výběrem možnosti .NET MAUI: Konfigurace Androidu a následným aktualizací prostředí Android. Všechny zjištěné chyby musí být vyřešeny.

8. Na stavovém řádku v dolní části editoru Visual Studio Code stiskněte symbol složených závorek { } a ujistěte se, že Debug Target je nastavená na konkrétní emulátor Androidu:

   

   Cíl ladění můžete nastavit také stisknutím kombinace kláves Ctrl+Shift+P ve Windows nebo Cmd+Shift+P v systému macOS a výběrem možnosti .NET MAUI: Vybrat zařízení s Androidem z palety příkazů.

9. Sestavte a spusťte aplikaci v Androidu stisknutím F5 nebo stisknutím tlačítka Spustit v pravém horním rohu editoru Visual Studio Code:

   

   Pokud se zobrazí výzva k výběru ladicího programu na paletě příkazů, vyberte C# a pak spusťte konfiguraci projektu.

10. Ve spuštěné aplikaci ve zvoleném emulátoru Androidu několikrát stiskněte tlačítko Klikněte na mě a všimněte si, že počet kliknutí na tlačítko se zvýší:

    

Ladění aplikace na zařízení s Androidem

Ladění aplikace na zařízení s Androidem:

1. Ujistěte se, že je vaše zařízení nastavené pro nasazení. Další informace najdete v tématu Nastavení zařízení pro nasazení.
2. Připojte zařízení k počítači a vyberte ho jako cíl ladění v editoru Visual Studio Code.
3. Spusťte aplikaci.

7. V editoru Visual Studio Code ověřte, že je prostředí Apple správně nakonfigurované, a to stisknutím kláves Cmd+Shift+P a následným výběrem možnosti .NET MAUI: Konfigurovat Apple a potom aktualizovat prostředí Apple. Všechny zjištěné chyby musí být vyřešeny.

8. Na stavovém řádku v dolní části editoru Visual Studio Code stiskněte symbol složených závorek { } a ujistěte se, že Debug Target je nastaven na konkrétní simulátor iOS:

   

   Cíl ladění můžete nastavit také tak, že stisknete Cmd+Shift+P a vyberete .NET MAUI: Vyberte zařízení s iOSem z palety příkazů.

9. Sestavte a spusťte aplikaci v iOSu stisknutím F5 nebo stisknutím tlačítka Spustit v pravém horním rohu editoru Visual Studio Code:

   

   Pokud se zobrazí výzva k výběru ladicího programu na paletě příkazů, vyberte C# a pak spusťte konfiguraci projektu.

10. Ve spuštěné aplikaci ve zvoleném simulátoru iOS několikrát stiskněte tlačítko Klikněte na mě a všimněte si, že počet kliknutí na tlačítko se zvýší:

    

Ladění aplikace na zařízení s iOSem

Ladění aplikace na zařízení s iOSem:

1. Ujistěte se, že jste přidali Apple ID do Xcode v Xcode > nastavení > účty.
2. Pokud patříte do programu Apple Developer Program, ujistěte se, že je vaše zařízení zaregistrované ve vašem týmu.
3. Povolte vývojářský režim na svém zařízení. Při prvním spuštění aplikace se na zařízení může zobrazit automaticky otevírané okno – ujistěte se, že vyberete Povolit. Další informace o vývojářském režimu najdete v tématu Povolení vývojářského režimu na zařízení na developer.apple.com.
4. Připojte zařízení k počítači a vyberte ho jako cíl ladění v editoru Visual Studio Code.
5. Spusťte aplikaci.

7. V editoru Visual Studio Code ověřte, že je prostředí Apple správně nakonfigurované, a to stisknutím kláves Cmd+Shift+P a následným výběrem možnosti .NET MAUI: Konfigurovat Apple a potom aktualizovat prostředí Apple. Všechny zjištěné chyby musí být vyřešeny.

8. Na stavovém řádku dole v editoru Visual Studio Code klikněte na symbol složených závorek { } a ujistěte se, že je cílová platforma pro ladění nastavena na váš Mac.

   

   Cíl ladění můžete nastavit také tak, že stisknete Cmd+Shift+P a vyberete .NET MAUI: Vyberte zařízení s macOS z palety příkazů.

9. Sestavte a spusťte aplikaci v macOS stisknutím F5 nebo stisknutím tlačítka Spustit v pravém horním rohu editoru Visual Studio Code:

   

   Pokud se zobrazí výzva k výběru ladicího programu na paletě příkazů, vyberte C# a pak spusťte konfiguraci projektu.

10. V běžící aplikaci několikrát stiskněte tlačítko Kliknout na mě a všimněte si, že počet kliknutí na tlačítko se zvýší:

    

7. Na stavovém řádku v dolní části editoru Visual Studio Code stiskněte symbol složených závorek { } a ujistěte se, že Debug Target je nastavený na Windows:

   

   Cíl ladění můžete nastavit také stisknutím kombinace kláves Ctrl+Shift+P a výběrem možnosti .NET MAUI: Vybrat zařízení s Windows z palety příkazů.

8. Sestavte a spusťte aplikaci ve Windows stisknutím klávesy F5 nebo stisknutím tlačítka Spustit v pravém horním rohu editoru Visual Studio Code:

   

   Pokud se zobrazí výzva k výběru ladicího programu na paletě příkazů, vyberte C# a pak spusťte konfiguraci projektu.

9. V běžící aplikaci několikrát stiskněte tlačítko Kliknout na mě a všimněte si, že počet kliknutí na tlačítko se zvýší:

   

Řešení problému

Pokud se vaší aplikaci nepodaří sestavit a nasadit, projděte si Řešení známých problémů, které můžou mít řešení vašeho problému.

Další kroky

V tomto kurzu jste se naučili, jak vytvořit a spustit první aplikaci .NET Pro víceplatformní aplikace (.NET MAUI).

Pokud se chcete naučit základy vytváření aplikace pomocí .NET MAUI, přečtěte si téma Vytvoření aplikace .NET MAUI. Případně si můžete pro kompletní školicí kurz .NET MAUI prohlédnout si téma Vytváření mobilních a desktopových aplikací pomocí .NET MAUI.