最初の Xamarin.Forms アプリをビルドする

このビデオを視聴し、作業を進めて、 による最初のモバイル アプリを作成します。

Windows での手順の詳細

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

上記のビデオと共に以下の手順に従います。

  1. [ファイル] [ > 新しいProject...]を選択するか、または [新しいプロジェクトの>します。

    新しいプロジェクトを作成する

  2. "Xamarin" を検索するか、 [プロジェクト タイプ] メニューから [モバイル] を選択します。 プロジェクト タイプ [モバイル アプリ ()] を選択します。

    Xamarin プロジェクトのフィルター処理

  3. プロジェクト名を選択します。この例では "AwesomeApp" を使用します。

    プロジェクト名を選択する

  4. のプロジェクト タイプをクリックして、確実に [Android][iOS] が選択されているようにします。

    Android と iOS、.NET Standard

  5. NuGet パッケージが復元される (ステータス バーに "復元が完了しました" メッセージが表示される) まで待ちます。

  6. 新しい Visual Studio 2019 のインストールには、Android エミュレーターが構成されていません。 [デバッグ] ボタンのドロップダウン矢印をクリックし、 [Android Emulator の作成] を選択して、エミュレーターの作成画面を起動します。

    Android アプリの作成Emulatorドロップダウン

  7. エミュレーターの作成画面で、既定の設定を使用して、 [作成] ボタンをクリックします。

    Android エミュレーターの作成画面

  8. エミュレーターを作成すると、[デバイス マネージャー] ウィンドウに戻ります。 [開始] ボタンをクリックして、新しいエミュレーターを起動します。

    デバイス マネージャー の Android エミュレーター

  9. Visual Studio 2019 では [デバッグ] ボタンに新しいエミュレーターの名前が表示されるようになりました。

    [デバッグ] ボタンの Android エミュレーター名

  10. [デバッグ] ボタンをクリックして、アプリケーションをビルドし、Android エミュレーターにデプロイします。

    アプリケーションを表示する Android エミュレーター

アプリケーションをカスタマイズする

アプリケーションをカスタマイズして、対話機能を追加することができます。 アプリケーションにユーザーの操作を追加するには、次の手順を実行します。

  1. MainPage.xaml を編集し、 の末尾の前にこの XAML を追加します

    <Button Text="Click Me" Clicked="Button_Clicked" />
    
  2. MainPage.xaml.cs を編集し、クラスの末尾にこのコードを追加します。

    int count = 0;
    void Button_Clicked(object sender, System.EventArgs e)
    {
        count++;
        ((Button)sender).Text = $"You clicked {count} times.";
    }
    
  3. Android 上のアプリのデバッグ:

    Android アプリ

Note

このサンプル アプリケーションには、ビデオで説明されていない追加の対話機能が含まれています。

Visual Studio 2019 で iOS アプリをビルドする

ネットワーク接続された Mac コンピューターで Visual Studio から iOS アプリをビルドし、デバッグすることができます。 詳細については、セットアップ手順を参照してください。

このビデオでは、Windows で Visual Studio 2019 を使用して iOS アプリをビルドおよびテストするプロセスについて説明しています。

Windows での手順の詳細

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

上記のビデオと共に以下の手順に従います。

  1. [ファイル ] > [新しいProject...]を選択するか、[新しいプロジェクトの作成>ボタンをクリックし、[Visual C# クロスプラットフォーム モバイル アプリ ( ) ] を> 選択します Xamarin.Forms

    Mobile App (<span class=Xamarin.Forms Mobile App (<span class= )"data-linktype="relative-path"/>

  2. .NET Standard コード共有と共に、 [Android][iOS] が確実に選択されているようにします。

    Android と iOS、.NET Standard

  3. NuGet パッケージが復元される (ステータス バーに "復元が完了しました" メッセージが表示される) まで待ちます。

  4. [デバッグ] ボタン (または [デバッグのデバッグの開始] メニュー項目) を押して、Android エミュレーターを 起動します。

  5. MainPage.xaml を編集し、 の末尾の前にこの XAML を追加します

    <Button Text="Click Me" Clicked="Button_Clicked" />
    
  6. MainPage.xaml.cs を編集し、クラスの末尾にこのコードを追加します。

    int count = 0;
    void Button_Clicked(object sender, System.EventArgs e)
    {
        count++;
        ((Button)sender).Text = $"You clicked {count} times.";
    }
    
  7. Android 上のアプリのデバッグ:

    スクリーンショットには Android Emulator が表示されています。

    ヒント

    ネットワーク接続された Mac コンピューターで Visual Studio から iOS アプリをビルドし、デバッグすることができます。 詳細については、セットアップ手順を参照してください。

Mac での手順の詳細

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

上記のビデオと共に以下の手順に従います。

  1. [新しい ソリューションのファイル] を選択するか、[新しいソリューション] Project...ボタンを押し、[マルチプラットフォーム アプリの空のフォーム アプリ] を選択します

    空のフォーム アプリ

  2. .NET Standard コード共有と共に、 [Android][iOS] が確実に選択されているようにします。

    Android と iOS、.NET Standard

  3. ソリューションを右クリックして、NuGet パッケージを復元します。

    スクリーンショットでは、ソリューションのコンテキスト メニューから選択された [NuGet パッケージの復元] が表示されています。

  4. [デバッグ] ボタン (または [デバッグの開始] ) を押して、Android エミュレーターを起動します

  5. MainPage.xaml を編集し、 の末尾の前にこの XAML を追加します

    <Button Text="Click Me" Clicked="Handle_Clicked" />
    
  6. MainPage.xaml.cs を編集し、クラスの末尾にこのコードを追加します。

    int count = 0;
    void Handle_Clicked(object sender, System.EventArgs e)
    {
        count++;
        ((Button)sender).Text = $"You clicked {count} times.";
    }
    
  7. Android 上のアプリのデバッグ:

    スクリーンショットには Android Emulator が表示されています。

  8. 右クリックして、iOS をスタートアップ プロジェクトに設定します。

    スタートアップ プロジェクトを iOS に設定する

  9. iOS 上のアプリのデバッグ:

    iOS アプリ

サンプル ギャラリーから完成したコードをダウンロードしたり、GitHub でそのコードを表示したりすることができます。

次の手順