Sdílet prostřednictvím


Vytvoření aplikace Xamarin.iOS pomocí Azure Mobile Apps

Poznámka

Tento produkt je vyřazený. Náhradu za projekty používající .NET 8 nebo novější najdete v knihovně Community Toolkit Datasync.

V tomto kurzu se dozvíte, jak přidat cloudovou back-endovou službu do mobilní aplikace pro iOS pomocí Xamarin.iOS a back-endu mobilních aplikací Azure. Vytvoříte back-end nové mobilní aplikace i jednoduchý seznam úkolů aplikaci, která ukládá data aplikací v Azure.

Tento kurz musíte dokončit před dalšími kurzy Xamarin.iOS pomocí funkce Mobile Apps ve službě Azure App Service.

Požadavky

K dokončení tohoto kurzu potřebujete:

  • sady Visual Studio 2022 s následujícími úlohami.
    • vývoj pro ASP.NET a web
    • Vývoj pro Azure
    • Vývoj mobilních aplikací s využitím .NET
  • Účet Azure .
  • Azure CLI.
    • Přihlaste se pomocí az login a před zahájením vyberte příslušné předplatné.
  • (Volitelné) Rozhraní příkazového řádku azure pro vývojáře .
  • Dostupný Mac:
    • Instalace XCode
    • Po instalaci otevřete Xcode, aby mohl přidat další požadované součásti.
    • Po otevření vyberte Předvolby XCode...>Součástia nainstalujte simulátor iOS.
    • Postupujte podle pokynů k Spárování s mac.

K kompilaci verze iOS se vyžaduje mac.

Stažení ukázkové aplikace

  1. Otevřete úložiště azure-mobile-apps v prohlížeči.

  2. Otevřete rozevírací seznam Code a pak vyberte StáhnoutZIP .

    snímek obrazovky s nabídkou Kódu na GitHubu

  3. Po dokončení stahování otevřete složku Stažené soubory a vyhledejte soubor azure-mobile-apps-main.zip.

  4. Klikněte pravým tlačítkem na stažený soubor a vyberte Extrahovat vše....

    Pokud chcete, můžete pomocí PowerShellu rozbalit archiv:

    C:\Temp> Expand-Archive azure-mobile-apps-main.zip
    

Ukázky se nacházejí v ukázkách složce v extrahovaných souborech. Ukázka rychlého startu má název TodoApp. Ukázku můžete otevřít v sadě Visual Studio poklikáním na soubor TodoApp.sln.

Snímek obrazovky s průzkumníkem souborů pro řešení

Nasazení back-endu do Azure

Poznámka

Pokud jste už back-end nasadili z jiného rychlého startu, můžete použít stejný back-end a tento krok přeskočit.

Abychom mohli nasadit back-endovou službu, provedeme následující kroky:

  • Zřízení služby Azure App Service a Azure SQL Database do Azure
  • Pomocí sady Visual Studio nasaďte kód služby do nově vytvořené služby Azure App Service.

Provedení všech kroků pomocí Azure Developer CLI

Ukázka TodoAppu je nakonfigurovaná tak, aby podporovala Azure Developer CLI. Dokončení všech kroků (zřizování a nasazení):

  1. nainstalujteAzure Developer CLI.
  2. Otevřete terminál a změňte adresář na složku obsahující soubor TodoApp.sln. Tento adresář obsahuje také azure.yaml.
  3. Spusťte azd up.

Pokud ještě nejste přihlášení k Azure, prohlížeč se spustí a požádá vás o přihlášení. Pak se zobrazí výzva k zadání předplatného a oblasti Azure, která se má použít. Azure Developer CLI pak zřídí potřebné prostředky a nasadí kód služby do oblasti Azure a předplatného podle vašeho výběru. Nakonec azure Developer CLI zapíše příslušný soubor Constants.cs za vás.

Spuštěním příkazu azd env get-values zobrazíte ověřovací informace SQL, pokud chcete získat přímý přístup k databázi.

Pokud jste dokončili kroky pomocí Azure Developer CLI, přejděte k dalšímu kroku. Pokud nechcete používat Azure Developer CLI, pokračujte ručními kroky.

Vytvořte prostředky v Azure.

  1. Otevřete terminál a změňte adresář na složku obsahující soubor TodoApp.sln. Tento adresář obsahuje také azuredeploy.json.

  2. Ujistěte se, že jste přihlášení a vybrali předplatné pomocí Azure CLI.

  3. Vytvořte novou skupinu prostředků:

    az group create -l westus -g quickstart
    

    Tento příkaz vytvoří skupinu prostředků quickstart v oblasti USA – západ. Můžete vybrat libovolnou oblast, kterou si přejete, a vytvořit tam prostředky. Ujistěte se, že používáte stejný název a oblast všude, kde jsou uvedené v tomto kurzu.

  4. Vytvořte prostředky pomocí nasazení skupiny:

    az deployment group create -g quickstart --template-file azuredeploy.json --parameters sqlPassword=MyPassword1234
    

    Vyberte silné heslo pro heslo správce SQL. Později ho budete potřebovat při přístupu k databázi.

  5. Po dokončení nasazení získejte výstupní proměnné, protože tyto důležité informace budete potřebovat později:

    az deployment group show -g quickstart -n azuredeploy --query properties.outputs
    

    Příkladem výstupu je:

    Snímek obrazovky s výsledky příkazového řádku

  6. Poznamenejte si jednotlivé hodnoty ve výstupech pro pozdější použití.

Publikování kódu služby

Otevřete TodoApp.sln v sadě Visual Studio.

  1. V pravém podokně vybertePrůzkumníka řešení .

  2. Klikněte pravým tlačítkem myši na projekt TodoAppService.NET6 a vyberte Nastavit jako spouštěný projekt.

  3. V horní nabídce vyberte Build>Publish TodoAppService.NET6.

  4. V okně Publikovat vyberte Cíl: Azurea stiskněte Další.

    Snímek obrazovky s oknem cílového výběru

  5. Vyberte konkrétní cíl: azure App Service (Windows)a stiskněte Další.

    Snímek obrazovky s konkrétním oknem pro výběr cíle

  6. V případě potřeby se přihlaste a vyberte odpovídající název předplatného .

  7. Ujistěte se, že zobrazení je nastavená naskupiny prostředků .

  8. Rozbalte quickstart skupinu prostředků a pak vyberte službu App Service, která byla vytvořena dříve.

    Snímek obrazovky s oknem výběru služby App Service

  9. Vyberte Dokončit.

  10. Po dokončení procesu vytváření profilu publikování vyberte Zavřít.

  11. Vyhledejte závislosti služby a vyberte trojité tečky vedle databáze SQL Serveru a pak vyberte Připojit.

    Snímek obrazovky znázorňující výběr konfigurace serveru S Q L

  12. Vyberte azure SQL Databasea pak vyberte Další.

  13. Vyberte databázi rychlého startu a pak vyberte Další.

    Snímek obrazovky s oknem pro výběr databáze

  14. Vyplňte formulář pomocí uživatelského jména a hesla SQL, které byly ve výstupech nasazení, a pak vyberte Další.

    Snímek obrazovky s oknem nastavení databáze

  15. Vyberte Dokončit.

  16. Po dokončení vyberte Zavřít.

  17. Vyberte Publikovat a publikujte aplikaci do služby Azure App Service, kterou jste vytvořili dříve.

    Snímek obrazovky s tlačítkem Publikovat

  18. Po publikování back-endové služby se otevře prohlížeč. Přidejte /tables/todoitem?ZUMO-API-VERSION=3.0.0 na adresu URL:

    Snímek obrazovky s výstupem prohlížeče po publikování služby

Konfigurace ukázkové aplikace

Vaše klientská aplikace potřebuje znát základní adresu URL back-endu, aby s ní mohl komunikovat.

Pokud jste ke zřízení a nasazení služby použili azd up, vytvořil se vám soubor Constants.cs a můžete tento krok přeskočit.

  1. Rozbalte projekt TodoApp.Data.

  2. Klikněte pravým tlačítkem na projekt TodoApp.Data a vyberte Přidat>třídu....

  3. Jako název zadejte Constants.cs a pak vyberte Přidat.

    snímek obrazovky s přidáním souboru Constants.cs do projektu

  4. Otevřete soubor Constants.cs.example a zkopírujte obsah (Ctrl-A následovaný Ctrl-C).

  5. Přepněte na Constants.cs, zvýrazněte veškerý text (Ctrl-A), vložte obsah z ukázkového souboru (Ctrl-V).

  6. Nahraďte https://APPSERVICENAME.azurewebsites.net back-endovou adresou URL vaší služby.

    namespace TodoApp.Data
    {
        public static class Constants
        {
            /// <summary>
            /// The base URI for the Datasync service.
            /// </summary>
            public static string ServiceUri = "https://demo-datasync-quickstart.azurewebsites.net";
        }
    }
    

    Adresu URL back-endu služby získáte na kartě Publikovat. Ujistěte se, že používáte adresu URL https.

  7. Uložte soubor. (Ctrl-S).

Sestavení a spuštění aplikace

  1. V Průzkumníku řešení rozbalte složku xamarin-native.

  2. Klikněte pravým tlačítkem na projekt TodoApp.iOS a vyberte Nastavit jako spouštěný projekt.

  3. V horním panelu vyberte simulátor iPhone konfiguraci a cíl TodoApp.iOS:

    snímek obrazovky ukazující, jak nastavit konfiguraci spuštění pro aplikaci Xamarin pro i O S.

  4. Vyberte odpovídající simulátor iPhonu (zvolil(a) jsem iPhone SE se systémem iOS 15.5).

  5. Stisknutím klávesy F5 sestavte a spusťte projekt.

Po spuštění aplikace se zobrazí prázdný seznam a textové pole pro přidání položek v emulátoru. Můžeš:

  • Položku přidáte stisknutím tlačítka +.
  • Vyberte položku, která nastaví nebo vymaže dokončený příznak.
  • Stisknutím ikony aktualizace znovu načtěte data ze služby.

snímek obrazovky se spuštěnou aplikací pro i O S zobrazující seznam úkolů

Řešení problémů

Vzdálený simulátor, který se dodává se sadou Visual Studio 2022, není kompatibilní s XCode 13.3. Zobrazí se následující chybová zpráva:

snímek obrazovky s chybovou zprávou při spuštění simulátoru i O S.

Tento problém můžete vyřešit takto:

  • Zakažte vzdálený simulátor (Nástroje / Možnosti / Nastavení iOS / zrušte zaškrtnutí Vzdálený simulátor do systému Windows). Pokud není tato možnost zaškrtnutá, simulátor se spustí na Macu místo ve Windows. Pak můžete pracovat se simulátorem přímo na počítači Mac při používání ladicího programu atd. ve Windows.
  • Zakažte vzdálený simulátor tak, jak je uvedeno výše, aby simulátor běžel na Macu. Pak se pomocí aplikace pro vzdálenou plochu připojte k počítači Mac z Windows. Mezi možnosti vzdálené plochy patří Devolutions Remote Desktop Manager (rychlá a k dispozici je bezplatná verze) a klienti VNC (pomalejší a zdarma).
  • K otestování místo simulátoru použijte fyzické zařízení. K dokončení kurzu ověřování můžete získat bezplatný zřizovací profil.

Další kroky

Pokračujte kurzem přidáním ověřování doaplikace .