はじめに
株式会社ACCESS Advent Calender 2023の10日目の記事です。
.NET MAUIについて
.NET MAUI（Multi-platform App UI）は、C#とXAMLを使用してモバイルアプリやデスクトップアプリを開発することができるクロスプラットフォームのフレームワークです。その名の通り、Microsoftの.NETシリーズとして提供されています。
これまではXamarin.Formsという名前で提供されてきましたが、2024年5月1日にサポートが終了し.NETシリーズに統合される予定となっています。
Visual Studio for Macのサポート終了について
.NET MAUIでiOSやMacOS向けのアプリをビルドするにはmacOSの環境が必要ですが、
公式から提供される開発環境としては、Visual Studio for Macが唯一の手段となっていました。
しかしながら、2023年8月に、MicrosoftからVisual Studio for Macの廃止が発表されました。
サポートの終了する2024年8月31日以降はSDKのアップデートなどが提供されなくなることから、
各OSのバージョンアップなどに追従することができなくなります。
現時点では、後継手段として
- Windows版Visual Studio
- Visual Studio Code + 拡張機能
の2択が提供されており、macOS上で開発を続けるためには、
実質的に2つ目のVisual Studio Codeの環境を利用する必要があります。
そこで、本記事ではmacOS上でVisual Studio Code + 拡張機能を利用し、
.NET MAUIのアプリケーションの開発環境を構築してみることにします。
公式ドキュメント
前提条件
- OS: macOS Sonoma 14.1.2
- CPU: 筆者の環境はIntelですが、Apple Siliconでも同様に構築できるはずです
- 目標: .NET MAUIでAndroid / iOS / Macのネイティブアプリをビルドできるようにします
事前準備
アプリをビルドするために必要な各種ツールを予めインストールしておきます。
Xcode
iOS/iPadOSアプリをビルドするために、Xcodeおよびコマンドラインツールをインストールします。
Xcode
コマンドラインツール
以下のコマンドでインストールします。
$ xcode-select --install
Android Studio
Androidアプリをビルドするためのツールやライブラリをインストールしておきます。
Android Studio
Android Studioをインストールすることで、Androidアプリのビルドに必要なSDKなどがインストールされます。
OpenJDK
以下のリンクからOpenJDK 11を選択してインストールします。
環境に合ったインストーラーをダウンロードしてください。
インストール後、ターミナル環境変数のJAVA_HOMEにJDKのホームディレクトリを設定しておきます。
(必要に応じて.zshrc などの設定ファイルにexport文を追記してください。)
export JAVA_HOME=/Library/Java/JavaVirtualMachines/microsoft-11.jdk/Contents/Home
なお、後述でインストールする.NETバージョンによってはOpenJDK 17が必要な場合があります。
.NETのバージョンとJDKの対応については以下のドキュメントを参照してください。
https://github.com/dotnet/maui/wiki/Release-Versions
.NET / .NET MAUIのインストール
環境に合わせた.NETをインストールします。
インストーラーを実行するとCLIでdotnetコマンドが実行できるようになります。
本記事公開時の最新バージョンが8.0.100でしたのでそれを前提に解説していますが、
現時点での最新バージョンをインストールされることをお勧めします。
$ dotnet --version
8.0.100
次にMAUIの開発環境をインストールします。
$ sudo dotnet workload install maui maui-android android
上記を実行すると、maui-android, maui, androidのワークロードがインストールされます。
$ dotnet workload list
Installed Workload Id Manifest Version Installation Source
--------------------------------------------------------------------
maui-android 8.0.3/8.0.100 SDK 8.0.100
maui 8.0.3/8.0.100 SDK 8.0.100
android 34.0.43/8.0.100 SDK 8.0.100
VSCode拡張機能のインストール
VSCodeに.NET MAUI拡張をインストールします。
上記をインストールすると、.NET MAUIの他にC#, C# Dev Kitなどの依存ツールも同時にインストールされます。
プロジェクトの作成
次に.NET MAUIのプロジェクトを作成していきます。
今回プロジェクト名などはデフォルトのままとします。
VSCodeのエクスプローラーにある .NET プロジェクトを作成 からプロジェクトを作ります。
作成完了時のディレクトリ構成
正しく作成されれば、以下のようなディレクトリ構成が見えるようになると思います。
参考: CLIツールを使う場合
$ dotnet new maui
アプリのデバッグ実行
アプリを実行してデバッグしてみます。
VSCodeの実行とデバッグタブのボタン>.NET MAUIを選択すると、
macOS向けの.NET MAUIアプリが立ち上がります。
この状態であれば、VSCode上でブレークポイントを貼ることもできます。
例えば、MainPage.xaml.csのOnCounterClicked()メソッドにブレークポイントを置くと、
Click meを押すたびに実行が止まり、コールスタックや変数の値をウォッチすることができます。
デバッグなしで実行したい場合
VSCodeの 実行>デバッグなしで実行から起動します。
Androidアプリの実行
コマンドパレット(⌘+Shift+P) →.NET MAUI: スタートアップ デバイスの選択から、実行したいAndroidエミュレータ(もしくは実機)を選択し、アプリのデバッグ実行と同様の手順で起動します。
なお、起動デバイスはコマンドパレット(⌘+Shift+P) →.NET MAUI: Android デバイスの選択から、アプリを実行するデバイスからも選択することができます。
実行結果
ビルドが完了すると、エミュレータが立ち上がってアプリが起動します。
参考: CLIツールを使う場合
$ dotnet build -t:Run -f net8.0-android
iOS(iPadOS)アプリの実行
コマンドパレット(⌘+Shift+P) →.NET MAUI: スタートアップ デバイスの選択から、実行したいiOSシミュレータ(または実機)を選択し、アプリのデバッグ実行と同様の手順で起動します。
ビルドが完了すると、シミュレータが立ちあがってアプリが起動します。
参考: CLIツールを使う場合
$ dotnet build -t:Run -f net8.0-ios
トラブルシューティング
Android
Android SDK: インストールが必要です
VSCodeの画面に上のようなエラーが表示される場合、
MAUIプロジェクトのディレクトリ内で以下のコマンドを実行します。
なお、$ANDROID_HOMEはAndroid SDKのパスです。
$ dotnet build -t:InstallAndroidDependencies -f:net8.0-android -p:AndroidSdkDirectory=$ANDROID_HOME -p:AcceptAndroidSDKLicenses=True
以下のようなエラーが出た際は、カレントディレクトリがプロジェクト配下にあることを確認してください。
MSBuild のバージョン 17.8.3+195e7f5a3 (.NET)
MSBUILD : error MSB1003: プロジェクト ファイルまたはソリューション ファイルを指定してください。現在の作業ディレクトリはプロジェクト ファイルまたはソリューション ファイルを含んでいません。
error XA0010: No available device.
$ dotnet build -t:Run -f net8.0-android
...
/usr/local/share/dotnet/packs/Microsoft.Android.Sdk.Darwin/34.0.43/tools/Xamarin.Android.Common.Debugging.targets(678,5): error XA0010: No available device. [/Users/user/MauiApp1.csproj::TargetFramework=net8.0-android]
Build FAILED.
上記のエラーが出た場合は、有効なエミュレータが作成されているか(実機を接続している場合はADBに認識されているか)を確認します。
iOS
Xcodeのライセンス未同意時エラー
...
You have not agreed to the Xcode license agreements. Please run 'sudo xcodebuild -license' from within a Terminal window to review and agree to the Xcode and Apple SDKs license.
Exception: System.Xml.XmlException: Root element is missing.
at System.Xml.XmlTextReaderImpl.Throw(Exception e)
at System.Xml.XmlTextReaderImpl.ThrowWithoutLineInfo(String res)
at System.Xml.XmlTextReaderImpl.ParseDocumentContent()
at System.Xml.XmlReader.ReadToDescendant(String name)
at Xamarin.MacDev.PropertyListFormat.XmlFormat.StartReading(Stream input) in
...
Build FAILED.
Xcodeをインストールしてから一度も起動していないと、iOSアプリのビルドで上記のようなエラーが出る場合があります。
その場合は、下記のコマンドでライセンスを承諾する必要があります。
$ sudo xcodebuild -license
Failed to locate any simulator runtime matching options
$ dotnet build -t:Run -f net8.0-ios
...
<key>description</key>
<string>The operation couldn’t be completed. Failed to locate any simulator runtime matching options: {
BuildVersionString = 21A326;
Platforms = (
"com.apple.platform.iphonesimulator"
);
VersionString = "17.0";
}</string>
...
Xcodeをインストールしてから一度も起動していないと、
必要なSimuratorなどがインストールされていないために上記のようなエラーが出ます。
Xcodeを一度起動してiOSのSDKやシミュレータをダウンロードしておく必要があります。
その他のエラー
その他原因不明なエラーが出た場合は、
Xcodeのコマンドラインツールのバージョンなどが正しく指定されているかを確認します。
筆者の環境では古いバージョンのXcodeが共存しており、
コマンドラインツールが最新バージョンのXcodeを向くように設定し直す必要がありました。
$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
$ xcode-select -p
/Applications/Xcode.app/Contents/Developer
おわりに
本記事では、VSCodeで.NET MAUIの開発環境を構築する手順を紹介しました。
.NET MAUIの拡張機能は、本記事の執筆時点ではプレビュー版であり、
今後GAに向けて機能が改善されていくことが期待できます。