Azure Mobile Apps を使用して Xamarin.Android アプリをビルドする

[アーティクル]
01/19/2024

このチュートリアルでは、Xamarin と Azure mobile app バックエンドを使用してクラウドベースのバックエンドサービスを Android モバイルアプリに追加する方法を説明します。新しいモバイルアプリバックエンドと、アプリのデータを Azure に格納する簡単な Todo list アプリの両方を作成します。

Azure App Service での Mobile Apps 機能の使用に関する他の Xamarin Android チュートリアルの前に、このチュートリアルを完了する必要があります。

前提条件

このチュートリアルを完了するには、以下が必要です。

Visual Studio 2022 と次のワークロード。
- ASP.NET および Web の開発
- Azure の開発
- .NET によるモバイル開発
Azure アカウント。
Azure CLI。
- 開始する前に、az login でサインインして適切なサブスクリプションを選択します。
(オプション) Azure Developer CLI。
次の設定を使用する Android 仮想デバイス:
- 電話: 携帯電話の画像 - テストには Pixel 5 を使用します。
- システムイメージ: Android 11 (Google API を使用した API 30)

サンプルアプリをダウンロードする

お使いのブラウザーで azure-mobile-apps リポジトリを開きます。
[コード] のドロップダウンを開き、[ZIP のダウンロード] を選択します。
ダウンロードが完了したら、 ダウンロード フォルダーを開き、azure-mobile-apps-main.zip ファイルを探します。
ダウンロードしたファイルを右クリックし、[すべて展開] を選択します。

必要に応じて、PowerShell を使用してアーカイブを展開することもできます。
```
C:\Temp> Expand-Archive azure-mobile-apps-main.zip
```

サンプルは、展開されたファイル内のサンプルフォルダーにあります。このクイックスタートのサンプルは TodoApp という名前です。 TodoApp.sln ファイルをダブルクリックして、Visual Studioでサンプルを開くことができます。

Screenshot of the file explorer for the solution.

バックエンドを Azure にデプロイする

Note

別のクイックスタートで既にバックエンドをデプロイしている場合は、同じバックエンドを使用することで、この手順をスキップできます。

バックエンドサービスをデプロイするには、次の手順を実行します。

Azure App Service と Azure SQL Database を Azure にプロビジョニングします。
Visual Studio を使用して、新しく作成された Azure App Service にサービスコードをデプロイします。

Azure Developer CLI を使用してすべての手順を完了する

TodoApp サンプルは、Azure Developer CLI をサポートするように構成されています。すげての手順 (プロビジョニングとデプロイ) を完了するには、次の操作を実行します。

Azure Developer CLI をインストールします。
ターミナルを開いて、ディレクトリを TodoApp.sln ファイルのあるフォルダーに変更します。このディレクトリには azure.yaml もあります。
azd up を実行します。

Azure にまだサインインしていない場合は、ブラウザーが起動してサインインを求められます。次に、使用するサブスクリプションと Azure リージョンを指定するように求められます。その後、Azure Developer CLI によって必要なリソースのプロビジョニングが行われ、選択した Azure リージョンとサブスクリプションにサービスコードがデプロイされます。最後に、Azure Developer CLI によって適切な Constants.cs ファイルが出力されます。

データベースに直接アクセスする必要がある場合は、azd env get-values コマンドを実行して SQL 認証情報を表示できます。

Azure Developer CLI で手順を完了した場合は、次の手順に進みます。 Azure Developer CLI を使用しない場合は、手動の手順に進みます。

Azure でリソースを作成します。

ターミナルを開いて、ディレクトリを TodoApp.sln ファイルのあるフォルダーに変更します。このディレクトリには azuredeploy.json もあります。
Azure CLI を使用して、サインインし、サブスクリプションを選択していることを確認します。
新しいリソースグループを作成します。
```
az group create -l westus -g quickstart
```
このコマンドは、米国西部リージョンに quickstart リソースグループを作成します。リソースを作成できる場所であれば、希望する任意のリージョンを選択できます。このチュートリアルで言及されている場合には、それと同じ名前とリージョンを使用するようにしてください。
グループデプロイを使用してリソースを作成します。
```
az deployment group create -g quickstart --template-file azuredeploy.json --parameters sqlPassword=MyPassword1234
```
SQL 管理者パスワードとして、強力なパスワードを選択してください。後でデータベースにアクセスするときに必要になります。
デプロイが完了したら、後で必要になる重要な情報を保持している出力変数を取得します。
```
az deployment group show -g quickstart -n azuredeploy --query properties.outputs
```
出力例を次に示します。
後で使用できるように、出力の各値をメモしておきます。

サービスコードを発行する

Visual Studio で TodoApp.sln を開きます

右側のウィンドウで、[ソリューションエクスプローラー]を選択します。
TodoAppService.NET6 プロジェクトを右クリックし、[スタートアッププロジェクトに設定] を選択します。
トップメニューで、ビルド>TodoAppService.NET6 をパブリッシュ を選択します。
[パブリッシュ] ウィンドウで、[ターゲット] の [Azure] を選択してから、[次へ] を押します。
[特定のターゲット] で [Azure App Service (Windows)] を選択してから、[次へ] を押します。
必要に応じてサインインし、適切なサブスクリプション名を選択します。
[ビュー] が [リソースグループ] に設定されていることを確認します。
quickstart リソースグループを展開し、前に作成した App Service を選択します。
[完了] を選びます。
発行プロファイルの作成プロセスが完了したら、[閉じる] を選択します。
[サービスの依存関係] を見つけて、SQL Server データベースの横のトリプルドットを選択し、[接続] を選択します。
[Azure SQL Database] を選択してから、[次へ] を選択します。
[クイックスタート] データベースを選択してから、[次へ] を選択します。
デプロイでの出力に含まれていた SQL ユーザー名とパスワードを使用して、フォームを入力してから、[次へ] を選択します。
[完了] を選びます。
完了したら、[閉じる] を選択します。
[パブリッシュ] を選択して、前に作成した Azure App Service にアプリをパブリッシュします。
バックエンドサービスが発行されると、ブラウザーが開きます。 URL に /tables/todoitem?ZUMO-API-VERSION=3.0.0 を追加します。

サンプルアプリの構成

クライアントアプリケーションは、バックエンドと通信できるように、バックエンドのベース URL を認識する必要があります。

サービスのプロビジョニングとデプロイに azd up を使用した場合は、Constants.cs ファイルが自動的に作成されるため、この手順は省略できます。

TodoApp.Data プロジェクトを展開します。
TodoApp.Data プロジェクトを右クリックし、[追加]>[クラス] の順に選択します。
名前に「Constants.cs」と入力してから、[追加] を選択します。
Constants.cs.example ファイルを開き、内容をコピーします (Ctrl + A の後で Ctrl + C)。
Constants.cs に切り替え、すべてのテキストを選択し (Ctrl + A)、サンプルファイルの内容を貼り付けます (Ctrl + V)。
https://APPSERVICENAME.azurewebsites.net をご自身のサービスのバックエンド URL に置き換えます。
```
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";
    }
}
```
ご自身のサービスのバックエンド URL は、[パブリッシュ] タブで取得できます。必ず https の URL を使用してください。
ファイルを保存します。 (Ctrl + S)。

アプリをビルドして実行する

ソリューションエクスプローラーで、xamarin-native フォルダーを展開します。
TodoApp.Android プロジェクトを右クリックし、[スタートアッププロジェクトに設定] を選択します。
トップバーで、任意の CPU 構成と TodoApp.Android ターゲットを選択します。
代わりに Android Emulator が表示される場合は、Android エミュレーターを作成していません。詳細については、「Android Emulator のセットアップ」を参照してください。新しい Android エミュレーターを作成する方法:
- [ツール]>[Android]>[Android デバイスマネージャー] を選択します。
- + 新規を選択します。
- 左側で、以下の設定を選択します。
  - 名前: quickstart
  - 基本デバイス: Pixel 5
  - プロセッサ: x86_64
  - OS: Android 11.0 - API 30
  - Google API: オン
- ［作成］ を選択します
- 必要に応じて、使用許諾契約書に同意します。これにより、イメージがダウンロードされます。
- [スタート] ボタンが表示されたら、[スタート] を押します。
- Hyper-V ハードウェアアクセラレータについて確認するダイアログが表示された場合は、続行する前に、ハードウェアアクセラレータを有効にするドキュメントを参照してください。
完了したら、Android デバイスマネージャーを閉じます。

ヒント

続行する前に、Android エミュレーターを起動します。これを行うには、Android デバイスマネージャーをオープンし、選択したエミュレーターの横にある [開始] を押します。
F5 キーを押し、プロジェクトをビルドして実行します。

アプリが起動すると、エミュレーターに項目を追加するための空のリストとフローティングアクションボタンが表示されます。次のことを実行できます。

フローティングアクションボタンを押し、テキストを入力して項目を追加します。
チェックボックスをオンまたはオフにして、項目の完了をマークします。
更新アイコンを押して、サービスからデータをリロードします。

Screenshot of the running Android app.

次のステップ

アプリに認証を追加して、チュートリアルを続行します。

Azure Mobile Apps を使用して Xamarin.Android アプリをビルドする

前提条件

サンプルアプリをダウンロードする