Aracılığıyla paylaş


Azure Mobile Apps ile Xamarin.Forms uygulaması oluşturma

Not

Bu ürün kullanımdan kaldırıldı. .NET 8 veya üzerini kullanan projelerin yerini alması için bkz. Community Toolkit Datasync kitaplığı.

Bu öğreticide, Xamarin.Forms ve Azure mobil uygulaması arka ucu kullanarak platformlar arası bir mobil uygulamaya bulut tabanlı arka uç hizmetinin nasıl ekleneceği gösterilmektedir. Hem yeni bir mobil uygulama arka ucu hem de Azure'da uygulama verilerini depolayan basit bir Yapılacaklar listesi uygulama oluşturacaksınız.

Azure App Service'teki Mobile Apps özelliğini kullanarak diğer Xamarin Forms öğreticilerinden önce bu öğreticiyi tamamlamanız gerekir.

Önkoşullar

Bu öğreticiyi Mac veya Windows'da tamamlayabilirsiniz. Bu öğreticiyi tamamlamak için şunları yapmanız gerekir:

  • Visual Studio 2022 aşağıdaki iş yükleriyle.
    • ASP.NET ve web geliştirme
    • Azure geliştirme
    • .NET ile mobil geliştirme
  • Azure hesabı.
  • Azure CLI.
    • az login ile oturum açın ve başlamadan önce uygun aboneliği seçin.
  • (İsteğe bağlı) azure geliştirici CLI.
  • Aşağıdaki ayarlarla bir Android Sanal Cihaz:
    • Telefon: Herhangi bir telefon görüntüsü - Test için Pixel 5'i kullanırız.
    • Sistem Görüntüsü: Android 11 (Google API'leri ile API 30)

Uygulamanın iOS sürümünü derlediyseniz, kullanılabilir bir Mac'iniz olmalıdır:

  • XCode yükleme
  • Xcode'u yükledikten sonra açın; böylece ek gerekli bileşenler ekleyebilir.
  • Açıldıktan sonra, XCode Tercihleri...>Componentsöğesini seçin ve bir iOS simülatörü yükleyin.
  • Windows'ta öğreticiyi tamamlarsanız Mac ile Eşleştirmekılavuzunu izleyin.

Örnek uygulamayı indirme

  1. azure-mobile-apps deposunu tarayıcınızda açın.

  2. Code açılan listesini açın ve zipindir'i seçin.

    GitHub'da Kod menüsünün ekran görüntüsü.

  3. İndirme işlemi tamamlandıktan sonra İndirmeler klasörünüzü açın ve azure-mobile-apps-main.zip dosyasını bulun.

  4. İndirilen dosyaya sağ tıklayın ve Tümünü Ayıkla...seçin.

    İsterseniz, arşivi genişletmek için PowerShell'i kullanabilirsiniz:

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

Örnekler, ayıklanan dosyaların içindeki örnekleri klasöründe bulunur. Hızlı başlangıç örneği TodoAppolarak adlandırılır. TodoApp.sln dosyasına çift tıklayarak örneği Visual Studio'da açabilirsiniz.

Çözüm için dosya gezgininin ekran görüntüsü.

Arka ucu Azure'a dağıtma

Not

Arka ucu zaten başka bir hızlı başlangıçtan dağıttıysanız, aynı arka ucu kullanabilir ve bu adımı atlayabilirsiniz.

Arka uç hizmetini dağıtmak için şunları yapacağız:

  • Azure'a bir Azure App Service ve Azure SQL Veritabanı sağlama.
  • Hizmet kodunu yeni oluşturulan Azure App Service'e dağıtmak için Visual Studio'yu kullanın.

Tüm adımları tamamlamak için Azure Geliştirici CLI'sini kullanma

TodoApp örneği, Azure Geliştirici CLI'sını destekleyecek şekilde yapılandırılmıştır. Tüm adımları (sağlama ve dağıtma) tamamlamak için:

  1. Azure Developer CLIyükleyin.
  2. Bir terminal açın ve dizini TodoApp.sln dosyasını içeren klasörle değiştirin. Bu dizin azure.yamlde içerir.
  3. azd upçalıştırın.

Azure'da henüz oturum açmadıysanız tarayıcı, oturum açmanızı istemek için başlatılır. Daha sonra kullanmak üzere bir abonelik ve Azure bölgesi istenir. Ardından Azure Geliştirici CLI'si gerekli kaynakları sağlar ve hizmet kodunu seçtiğiniz Azure bölgesine ve aboneliğine dağıtır. Son olarak Azure Geliştirici CLI'sı sizin için uygun bir Constants.cs dosyası yazar.

Veritabanına doğrudan erişmek istiyorsanız SQL kimlik doğrulama bilgilerini görmek için azd env get-values komutunu çalıştırabilirsiniz.

Azure Geliştirici CLI ile adımları tamamladıysanız sonraki adıma geçin. Azure Geliştirici CLI'sini kullanmak istemiyorsanız, el ile uygulanan adımlarla devam edin.

Azure'da kaynak oluşturma.

  1. Bir terminal açın ve dizini TodoApp.sln dosyasını içeren klasörle değiştirin. Bu dizin azuredeploy.jsonde içerir.

  2. Azure CLI kullanarak oturum açtığınızdan ve bir abonelik seçtiğinizden emin olun.

  3. Yeni bir kaynak grubu oluşturun:

    az group create -l westus -g quickstart
    

    Bu komut, Batı ABD bölgesinde quickstart kaynak grubunu oluşturur. İstediğiniz bölgeyi seçerek orada kaynak oluşturabilirsiniz. Bu öğreticide bahsedilen her yerde aynı adı ve bölgeyi kullandığınızdan emin olun.

  4. Grup dağıtımı kullanarak kaynakları oluşturun:

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

    SQL Yöneticisi parolanız için güçlü bir parola seçin. Daha sonra veritabanına erişirken ihtiyacınız olacak.

  5. Dağıtım tamamlandıktan sonra çıkış değişkenlerini alın, bunlar daha sonra ihtiyacınız olan önemli bilgileri barındırır:

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

    Örnek çıkış:

    Komut satırı sonuçlarının ekran görüntüsü.

  6. Çıkışlardaki değerlerin her birini daha sonra kullanmak üzere not edin.

Hizmet kodunu yayımlama

Visual Studio'da TodoApp.sln açın.

  1. Sağ bölmede çözüm gezginiseçin.

  2. projesine sağ tıklayın ve başlangıç projesi olarak ayarlaseçin.

  3. Üstteki menüde TodoAppService.NET6DerlemeYayımla'yı seçin.

  4. Yayımla penceresinde Hedef: Azure'i seçin ve İleribasın.

    Hedef seçim penceresinin ekran görüntüsü.

  5. Belirli bir hedef: azure app service (Windows)öğesini seçin ve ardından İleribasın.

    Belirli bir hedef seçim penceresinin ekran görüntüsü.

  6. Gerekirse oturum açın veuygun bir Abonelik adı seçin.

  7. Görünüm'nin Kaynak grubuolarak ayarlandığından emin olun.

  8. quickstart kaynak grubunu genişletin ve daha önce oluşturulan App Service'i seçin.

    App Service seçim penceresinin ekran görüntüsü.

  9. sonseçin.

  10. Yayımlama profili oluşturma işlemi tamamlandıktan sonra Kapat'ı seçin.

  11. Hizmet Bağımlılıkları'nı bulun ve SQL Server Veritabanı'nın yanındaki üç noktayı seçin, ardından Bağlanseçeneğini belirleyin.

    S Q L sunucu yapılandırma seçimini gösteren ekran görüntüsü.

  12. Azure SQL Veritabanıöğesini ve ardından İleriseçin.

  13. hızlı başlangıç veritabanını ve ardından İleriseçin.

    Veritabanı seçim penceresinin ekran görüntüsü.

  14. Dağıtımın çıktılarında yer alan SQL kullanıcı adını ve parolasını kullanarak formu doldurun, ardından İleriseçin.

    Veritabanı ayarları penceresinin ekran görüntüsü.

  15. sonseçin.

  16. tamamlandığında kapat'ı seçin.

  17. Uygulamanızı daha önce oluşturduğunuz Azure App Service'e yayımlamak için Yayımla'ı seçin.

    Yayımla düğmesini gösteren ekran görüntüsü.

  18. Arka uç hizmeti yayımlandıktan sonra bir tarayıcı açılır. URL'ye /tables/todoitem?ZUMO-API-VERSION=3.0.0 ekleyin:

    Hizmet yayımlandıktan sonra tarayıcı çıkışını gösteren ekran görüntüsü.

Örnek uygulamayı yapılandırma

İstemci uygulamanızın onunla iletişim kurabilmesi için arka ucunuzun temel URL'sini bilmesi gerekir.

Hizmeti sağlamak ve dağıtmak için azd up kullandıysanız, Constants.cs dosyası sizin için oluşturulmuştur ve bu adımı atlayabilirsiniz.

  1. TodoApp.Data projesini genişletin.

  2. TodoApp.Data projesine sağ tıklayın ve >Sınıfı Ekle... öğesini seçin..

  3. Ad olarak girin, ardındanEkle seçin.

    projeye Constants.cs dosyasını ekleme ekran görüntüsü.

  4. Constants.cs.example dosyasını açın ve içeriği kopyalayın (Ctrl-A ve ardından Ctrl-C).

  5. Constants.csgeçiş yapın, tüm metni vurgulayın (Ctrl-A), ardından örnek dosyadaki (Ctrl-V) içeriği yapıştırın.

  6. https://APPSERVICENAME.azurewebsites.net hizmetinizin arka uç URL'si ile değiştirin.

    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";
        }
    }
    

    Hizmetinizin arka uç URL'sini Yayımla sekmesinden alabilirsiniz. https URL kullandığınızdan emin olun.

  7. Dosyayı kaydedin. (Ctrl-S).

Android uygulamasını derleme ve çalıştırma

  1. Çözüm gezgininde xamarin-forms klasörünü genişletin.

  2. projesine sağ tıklayın ve başlangıç projesi olarak ayarlaseçin.

  3. Üst çubukta Herhangi bir CPU yapılandırması ve TodoApp.Forms.Android hedefini seçin:

    Android için Xamarin Forms uygulaması için çalıştırma yapılandırmasını ayarlamayı gösteren ekran görüntüsü.

  4. Bunun yerine Android Öykünücüsü görürseniz, Android öykünücüsü oluşturmamışsınızdır. Daha fazla bilgi için bkz. Android öykünücüsü kurulumu. Yeni bir Android öykünücüsü oluşturmak için:

    • AndroidAndroid Cihaz YöneticisiAraçları'nı seçin.
    • + Yeniöğesini seçin.
    • Sol tarafta aşağıdaki seçenekleri belirleyin:
      • Ad: quickstart
      • Temel Cihaz: Piksel 5
      • İşlemci: x86_64
      • İşletim sistemi: android 11.0 - API 30
      • Google API'leri: denetlenen
    • oluştur'u seçin.
    • Gerekirse lisans sözleşmesini kabul edin. Ardından görüntü indirilir.
    • Başlat düğmesi görüntülendiğinde Başlangıçbasın.
    • Hyper-V donanım hızlandırması istenirse devam etmeden önce donanım hızlandırmayı etkinleştirmek için belgeleri okuyun. Öykünücü, donanım hızlandırmayı etkinleştirmeden yavaş olacaktır.

    Bahşiş

    Devam etmeden önce Android öykünücünüzü başlatın. Android Cihaz Yöneticisi'ni açıp seçtiğiniz öykünücünün yanındaki Başlat basarak bunu yapabilirsiniz.

  5. Projeyi oluşturmak ve çalıştırmak için F5 basın.

Uygulama başlatıldıktan sonra öykünücüye öğe eklemek için boş bir liste ve metin kutusu görürsünüz. Şunları yapabilirsiniz:

  • Kutuya metin girin, sonra yeni öğe eklemek için Enter tuşuna basın.
  • Tamamlanmış bayrağı ayarlamak veya temizlemek için bir öğe seçin.
  • Hizmetten verileri yeniden yüklemek için yenileme simgesine basın.

çalışan Android uygulamasının ekran görüntüsü .

iOS uygulamasını derleme ve çalıştırma

Not

Mac ile Eşleştirkılavuzu izlemeniz . iOS uygulamalarını eşleştirilmiş Mac olmadan derlerken veya çalıştırırken hata alırsınız.

  1. Çözüm gezgininde xamarin-forms klasörünü genişletin.

  2. projesine sağ tıklayın ve başlangıç projesi olarak ayarlaseçin.

  3. Üst çubukta iPhone Simulator yapılandırması'nı ve TodoApp.Forms.iOS hedef seçin:

    I O S için Xamarin Forms uygulamasının çalıştırma yapılandırmasını ayarlamayı gösteren ekran görüntüsü.

  4. iPhone Simülatörünü seçin

  5. Projeyi oluşturmak ve çalıştırmak için F5 basın.

Uygulama başlatıldıktan sonra öykünücüye öğe eklemek için boş bir liste ve metin kutusu görürsünüz. Şunları yapabilirsiniz:

  • Kutuya metin girin, sonra yeni öğe eklemek için Enter tuşuna basın.
  • Tamamlanmış bayrağı ayarlamak veya temizlemek için bir öğe seçin.
  • Hizmetten verileri yeniden yüklemek için yenileme simgesine basın.

Yapılacaklar listesini gösteren çalışan i O S uygulamasının ekran görüntüsü.

Sorun giderme

Visual Studio 2022 ile birlikte gelen uzak simülatör XCode 13.3 ile uyumsuz. Aşağıdaki hata iletisini alırsınız:

i O S simülatörü başlatılırken hata iletisinin ekran görüntüsü.

Bu sorunu geçici olarak çözmek için:

  • Uzak simülatörü devre dışı bırakın (Araçlar / Seçenekler / iOS Ayarları / WindowsIçin Uzak Simülatörü seçeneğinin işaretini kaldırın). İşareti kaldırıldığında simülatör Windows yerine Mac'te çalışır. Daha sonra Windows'da hata ayıklayıcısını vb. kullanırken doğrudan Mac'inizde simülatörle etkileşim kurabilirsiniz.
  • Yukarıdaki gibi uzak simülatörü devre dışı bırakın, böylece simülatör Mac'te çalışır. Ardından, Windows'tan Mac masaüstüne bağlanmak için bir uzak masaüstü uygulaması kullanın. Uzak masaüstü seçenekleri arasında Devolutions Uzak Masaüstü Yöneticisi (hızlı ve ücretsiz sürüm var) ve VNC istemcileri (daha yavaş ve ücretsiz) bulunur.
  • Simülatör yerine test etmek için fiziksel bir cihaz kullanın. Kimlik doğrulama öğreticisini tamamlamak için ücretsiz sağlama profili edinebilirsiniz.

Sonraki adımlar

uygulamaya kimlik doğrulaması ekleyerek öğreticiye devam edin.