最初のアプリを構築する

このチュートリアルでは、Windows の Visual Studio 2022 または Windows、macOS、または Linux の Visual Studio Code で、最初の .NET マルチプラットフォーム アプリ UI (.NET MAUI) アプリを作成して実行する方法について説明します。 これは、開発環境が正しく設定されていることを確認するのに役立ちます。

前提条件

  • .NET マルチプラットフォーム アプリ UI ワークロードがインストールされている Visual Studio 2022 17.12 以降。 詳細については、「インストール」を参照してください。

アプリを作成する

このチュートリアルでは、Visual Studio 2022 で最初の .NET MAUI アプリを作成し、Android Emulator で実行します。

Windows で iOS 用の .NET MAUI アプリを開発するには、Mac ビルド ホストが必要です。 特に iOS をターゲットにする必要がなく、Mac がない場合は、代わりに Android または Windows から開始することを検討してください。

このチュートリアルでは、Visual Studio で最初の .NET MAUI アプリを作成し、iOS エミュレーターで実行します。

このチュートリアルでは、Visual Studio 2022 で最初の .NET MAUI アプリを作成し、Windows で実行します。

  1. Visual Studio 2022 を起動します。 [スタート] ウインドウで、[新しいプロジェクトを作成] をクリックして新しいプロジェクトを作成します。

    新しいソリューション。

  2. [新しいプロジェクトを作成] ウィンドウの [すべてのプロジェクトの種類] ドロップダウンで [MAUI] を選択し、[.NET MAUI アプリ] テンプレートを選択し、[次へ] ボタンをクリックします。

    テンプレートを選択します。

  3. [新しいプロジェクトを構成] ウィンドウで、プロジェクトの名前を指定し、適切な場所を選んで、[次へ] ボタンをクリックします。

    プロジェクトを構成します。

  4. [追加情報] ウィンドウで、対象とする .NET のバージョンを選択し、[作成] ボタンをクリックします。

    追加情報。

  5. プロジェクトが作成され、それらの依存関係が復元されるまで待ちます。

    復元された依存関係。

  1. Visual Studio のツール バーで、[デバッグ ターゲット] ドロップダウンを使用して [Android Emulator] を選択し、[Android Emulator] エントリを選択します。

    .NET MAUI 用の Android Emulator デバッグ ターゲットを選択します。

  2. Visual Studio のツール バーで [Android Emulator] ボタンを押します。

    [Android Emulator] ボタン。

    Visual Studio は、既定の Android SDK と Android Emulator をインストールするプロセスを開始します。

  3. [Android SDK - ライセンスの同意] ウィンドウで、[同意する] ボタンを押します。

    最初の Android SDK ライセンス契約ウィンドウ。

  4. [ユーザー アカウント制御] ダイアログで、[はい] ボタンを押します。

    [Android SDK ライセンス ユーザー アカウント制御] ダイアログ。

    Visual Studio によって既定の Android SDK と Android Emulator がダウンロードされるのを待ちます。

  5. [ユーザー アカウント制御] ダイアログで、[はい] ボタンを押します。

    [Android デバイス マネージャー ユーザー アカウント制御] ダイアログ。

  6. [Android SDK プラットフォームが見つかりません] ダイアログで、[インストール] ボタンを押します。

    [Android SDK プラットフォームが見つかりません] ダイアログ。

  7. [Android SDK - ライセンスの同意] ウィンドウで、[同意する] ボタンを押します。

    2 番目の Android SDK ライセンス契約ウィンドウ。

    Visual Studio が Android SDK コンポーネントをインストールするまで待ちます。

  8. [新しいデバイス] ウィンドウで、[作成] ボタンを押します。

    新しい Android デバイス ウィンドウ。

    Visual Studio によって Android Emulator がダウンロード、解凍、作成されるのを待ちます。

  9. [Android デバイス マネージャー] ウィンドウを閉じます。

    Android デバイス マネージャー ウィンドウ。

  10. Visual Studio ツール バーで、[Pixel 7 - API 35 (Android 15.0 - API 35)] ボタンを押します。

    Pixel 7 API 35 エミュレーター ボタン。

  11. [Android SDK - ライセンスの同意] ウィンドウで、[同意する] ボタンを押します。

    3番目の Android SDK ライセンス契約ウィンドウ。

  12. [ユーザー アカウント制御] ダイアログで、[はい] ボタンを押します。

    [Android SDK ライセンス ユーザー アカウント制御] ダイアログ。

    Visual Studio がインストールされ、Android SDK がダウンロードされるまで待ちます。

  13. Visual Studio ツール バーで、[Pixel 7 - API 35 (Android 15.0 - API 35)] ボタンを押して、アプリをビルドして実行します。

    Pixel 5 API 35 エミュレーター ボタン。

    Visual Studio によって Android Emulator が開始され、アプリがビルドされて、アプリが Emulator に配置されます。

    警告

    Android Emulator のパフォーマンスを最大化するには、ハードウェア アクセラレーションを有効にする必要があります。 これを行わないと、Emulator の実行速度が遅くなります。 詳細については、「Android Emulator (Hyper-V & AEHD) でハードウェア アクセラレーションを有効にする方法」を参照してください。

  14. Android Emulator で実行中のアプリで、[ここをクリック] ボタンを数回押して、ボタンのクリック数が増加していることを確認します。

    Android Emulator で実行されているアプリ。

トラブルシューティング

アプリのコンパイルに失敗した場合は、「既知の問題をトラブルシューティングする」を参照してください。問題の解決策が見つかる場合があります。 問題が、Android Emulator に関連する場合は、「Android Emulator のトラブルシューティング」を参照してください。

  1. Visual Studio ツールバーで [Windows マシン] ボタンを押し、アプリをビルドして実行します。

    Visual Studio ボタンで .NET MAUI アプリを実行します。

  2. 実行中のアプリで、[ここをクリック] ボタンを数回押して、ボタンのクリック数が増加していることを確認します。

    Windows で実行中の .NET MAUI アプリ。

トラブルシューティング

アプリのコンパイルに失敗した場合は、「既知の問題をトラブルシューティングする」を参照してください。問題の解決策が見つかる場合があります。

  1. Visual Studio で、IDE を Mac ビルド ホストとペアリングします。 詳細については、「iOS 開発のために Mac とペアリングする」を参照してください。

  2. Visual Studio のツールバーで、[デバッグ ターゲット] ドロップダウンを使用して [iOS シミュレーター] を選択し、次に特定の iOS シミュレーターを選択します。

    Visual Studio iOS シミュレーター デバッグ ターゲット。

  3. Visual Studio ツールバーで、選択した iOS シミュレーターの [開始] ボタンを押して、アプリをビルドして実行します。

    Visual Studio iOS シミュレーター デバッグ ターゲットの選択。

    Visual Studio はアプリをビルドし、Windows 用のリモート iOS シミュレーターを起動し、リモート シミュレーターにアプリをデプロイします。 Windows 用のリモート iOS シミュレーターの詳細については、「Windows 向け リモート iOS シミュレーター」を参照してください。

  4. 実行中のアプリで、[ここをクリック] ボタンを数回押して、ボタンのクリック数が増加していることを確認します。

    Mac の iOS シミュレーターで実行中の .NET MAUI アプリ。

トラブルシューティング

アプリのコンパイルに失敗した場合は、「既知の問題をトラブルシューティングする」を参照してください。問題の解決策が見つかる場合があります。

Mac Catalyst を対象とする .NET MAUI アプリは、Visual Studio Code を使用してのみ起動およびデバッグできます。

コマンド ラインからアプリを作成する

.NET 11 以降では、コマンド ラインからアプリを作成することもできます。 まず、.NET 11 SDK と .NET MAUI ワークロードをインストールします。

C# UI を作成する

XAML ではなく C# でアプリ UI を作成するには、次のコマンドを実行します。

dotnet new maui -n MyApp --ui csharp

このテンプレートは、組み込みの.NET MAUI API を使用してApp.cs、AppShell.cs、およびMainPage.csを生成します。 追加の C# UI ライブラリは必要ありません。 シェルとページ UI は C# で定義されていますが、 App.xaml と XAML リソース ディクショナリはアプリ リソース用に残ります。 --ui csharpを省略しても、XAML は既定値のままです。

--sample-content オプションは XAML 専用です。 --ui csharpと組み合わせると、テンプレートによってサンプル コンテンツなしで C# UI が作成され、警告が表示されます。

Avalonia デスクトップ プロジェクトを追加する

別の方法として、オプションの Avalonia デスクトップ プロジェクトを含むマルチプロジェクト ソリューションを作成します。

dotnet new maui-multiproject -n MyApp --avalonia

このコマンドを実行すると、共有 .NET MAUI プロジェクトと、Windows、macOS、Linux 用の MyApp.Desktop プロジェクトが作成されます。 Avalonia は既定では含まれていないので、このオプションでは WebAssembly プロジェクトは追加されません。 ネイティブ アプリ プロジェクトも含めるには、 --avalonia を --android、 --ios、 --macos、または --windowsと組み合わせます。

次のステップ

このチュートリアルでは、最初の .NET マルチプラットフォーム アプリ UI (.NET MAUI) アプリを作成して実行する方法について説明しました。

.NET MAUI を使用してアプリを構築する際の基礎については、「.NET MAUI アプリを作成する」を参照してください。 または、完全な .NET MAUI トレーニング コースについては、「.NET MAUI を使用してモバイルおよびデスクトップ アプリを構築する」を参照してください。

  • 最終更新: