VSCode & .NET MAUIでAdnroidアプリ開発環境を構築する【Windows】
初稿:
- 6 min read -
この記事のゴール
- VSCode(Windows)に、.NET MAUIアプリ開発環境を構築する
- 構築する項目は以下のとおり
- .NET MAUIテンプレートからプロジェクトを新規作成する
- Android emulatorを起動する
- Androidアプリをデバッグする
環境
- OS - Windows 11 Pro 23H2
- VSCode - v1.91.2
- .NET - v8.0.400
- Android - API Level 34
前提
WindowsにVSCodeをインストール済みであること
作業一覧
- .NET 8.0 インストール
- .NET MAUI 拡張機能インストール
- .NET MAUIプロジェクト作成
- OpenJDK / Android SDK インストール
- VSCodeの設定
- Android Emulatorインストール・設定
- デバッグ実行
作業詳細
.NET 8.0 インストール
- 参考サイト
- .NET インストーラ―またはwingetコマンドで、.NET 8 をインストールする
.NET MAUI 拡張機能インストール
- VSCodeの拡張機能タブより、「.NET MAUI」をインストールする
- VSCodeのターミナルで以下コマンドを実行し、.NET MAUI の workload をインストールする(時間がかかる)
.NET MAUIプロジェクト作成
- VSCodeのコマンドパレット(Ctrl+Shift+P)→ .NET と入力 →「.NET: 新しいプロジェクト / .NET: New Project」を選択
- .NET MAUIアプリを選択
- プロジェクト名を入力
- Android SDKが無いエラーポップアップが表示されるが次の作業で対処するため無視してOK
- .csprojを開き、net8.0-android 以外を削除する
OpenJDK / Android SDK インストール
- Androidアプリのビルドやデバッグに「OpenJDK」と「Android SDK」が必要となる
- インストール方法は複数があるが、実際に試した次の2つを記す
- InstallAndroidDependencies を使用する
- Visual Studio 2022 経由でインストールする(Windowsのみ)
- 公式ではInstallAndroidDependenciesを推奨しているが、Visual Studio経由の方が簡単
- その他の方法については以下を参照
InstallAndroidDependenciesによるインストール
参考サイト
VSCodeのターミナルで以下コマンドを実行し、Androidアプリのデバッグで必要なJDKとAndroid SDKをインストールする
- Android SDKとJDKのインストールパスは任意の場所を指定する
- フルパスを記述すること
- システム環境変数に以下を追加する
変数名 | 変数値 |
---|---|
ANDROID_HOME | C:\workload\android\sdk |
JAVA_HOME | C:\workload\jdk |
ANDROID_AVD_HOME | C:\Users\ユーザ名.android\avd |
- システム環境変数のPathに以下を追加する
- %ANDROID_HOME%\cmdline-tools\13.0\bin
- %ANDROID_HOME%\platform-tools
- cmdline-toolsのバージョン番号は実際のディレクトリを確認の上、適宜変更
- Pathは追加しなくても問題ないが、sdkmanager等を使用する際に便利
Visual Studio によるインストール
- 以下リンクからVisual Studio Community 2022 をダウンロードしインストールする
- ワークロード選択画面で、「.NET マルチプラットフォーム アプリのUI開発」にチェックを入れる
- インストールが完了したら、Visual Studioを起動し、「メニューバー」→「ツール」→「オプション」を開く
- 「Xamarin」→「Android設定」の以下を控えておく
- Java Development Kit の位置情報
- Android SDK の場所
- 値はそれぞれ以下のようなパス
- C:\Program Files (x86)\Android\openjdk\jdk-17.0.8.101-hotspot
- C:\Program Files (x86)\Android\android-sdk
- 前の「InstallAndroidDependenciesによるインストール」で示した、システム環境変数の追加をする
VSCodeの設定
Android SDK 設定
- VSCodeのコマンドパレット →「.NET MAUI: Androidの構成」→「Android SDK パスを設定する」を選択する
- フォルダ選択ウインドウより、先ほどインストールしたAndroid SDKのパスを選択する
OpenJDK 設定
- VSCodeのコマンドパレット →「.NET MAUI: Androidの構成」→「Java SDKのパスを設定します」を選択する
- フォルダ選択ウインドウより、先ほどインストールしたJDKのパスを選択する
※SDKの設定情報は、settings.jsonに記述される
Android Emulatorインストール・設定
InstallAndroidDependenciesでインストールした場合
- ターミナルでsdkmanagerが存在するパスへ移動(Pathを設定している場合はどこからでもOK)
- 以下コマンドを実行し、Emulatorをインストールする
- 以下コマンドで、ライセンス同意を行う(ひたすら「y」)
- 以下コマンドを実行し、Emulatorを作成する
- -nパラメータはEmulatorの名前
Visual Studioでインストールした場合
公式ドキュメント
「メニューバー」→「ツール」→「Android」→「Android SDKマネージャー」を開く
プラットフォームタブで任意のAndroid SDKにチェックを入れる(Android SDK Platform 34 など)
- インストール時間短縮のため、内容を展開し、Google TVなど不要なSDKのチェックを外す
ツールタブのAndroid Emulatorにチェックを入れる
「変更を適用」ボタンをクリックし、インストールする
「メニューバー」→「ツール」→「Android」→「Android デバイスマネージャー」を開く
「新規」ボタンより、各種設定の上、Emulatorを作成する
デバッグ実行
VSCodeのサイドバー「実行とデバッグ」より、
MAUIプロジェクトのファイルを開く(MauiProgram.csなど)
VSCodeのステータスバー右下の「」をクリック
「デバッグターゲット」をクリック
作成したAndroid Emulatorを選択する
F5 → C# → プロジェクト名を選択するとデバッグが始まる
まとめ
OpenJDKとAndroid SDKのインストールは、時間がかかるがVisual Studio経由で行った方が、その後のデバイス追加・変更の際にGUIを使用できる。
また今回は記載しなかったが、Android Studio経由でインストールしても同様である。
前回、Ubuntu(WSL2)で同様の作業を行ったが、Windowsの方が必要なパッケージや設定作業も少なく簡単だった。
以上