自2010年以來，移動應用開發是非常熱門的一個方向，從技術上我們經歷了原生應用開發、基于 H5 的 Web App、混合模式的移動應用開發，再到跨平臺移動應用開發。.NET 不僅是一個跨平臺的應用，也是一個跨應用場景的平臺。.NET的移動應用方案最開始基于 Mono , 從 MonoTouch , 到 MonoDroid ，到跨平臺移動應用方案 Xamarin , 再到現在整合到 .NET 6 的 MAUI。通過 .NET MAUI 你可以通過一份代碼，一個項目快速構建具備原生性能的 iOS / Android / Windows / MacOS / Linux 應用。

一

Visual Studio Code 的 MAUI 環境安裝

官方現在基本上都是推薦用最新預覽版本的 Visual Studio 2022 在 Windows 平臺上做開發，macOS 的 Visual Studio 支持 MAUI 還沒有準備好！記得 2020 年 Build 大會上微軟是有展示過在 Visual Studio Code 上開發的， 當時我也非常期待， 但一直沒有下文。實際上， 在 Visual Studio Code 上的 .NET 跨平臺開發組件已經有了， 通過開源項目存在。要用 Visual Studio Code 開發 MAUI ，請按照以下步驟來完成：

0..NET 6 環境安裝

通過鏈接?https://dotnet.microsoft.com/en-us/download?安裝最新的 .NET 6

1.MAUI 環境安裝

無論你在 Windows / macoOS 建議使用 maui-check (https://github.com/Redth/dotnet-maui-check) 對 MAUI 所需要的環境進行安裝，這里面包含了 Android SDK / iOS SDK 等 相關配置的檢查。

在命令行安裝 maui-check

dotnet tool install -g Redth.Net.Maui.Check

在終端執行 maui-check

maui-check

如下圖， maui-check 會對你對你系統里依賴的如 JDK , Android SDK , Xcode , Visual Studio ，.NET SDK 以及 MAUI 相關的包等環境掃描一次，如果缺少，他會提示你安裝。

2.用 .NET Tools 安裝 Comet

Comet 是 .NET 基于 MVU 設計模式的前端實現框架， 你可以把它應用于 Windows , Android , iOS , macOS , Blazor 應用開發中。你可以從?https://github.com/dotnet/comet?了解更多。

*

什么是 MVU?

MVU (Model-View=Update) 是?種功能響應式編程、架構設計模式。在 MVU 中 UI 是不可變的。所以每次你想更新?個屬性時，你都必須重建你的 UI。不變性是函數式編程的特性。C# 9.0 后?持函數式編程范式。UI 和業務都使?相同的語?（例如 C#）編寫。數據流是單向的。它?常適合應?程序的熱重載。您不需要學習 XAML 來開發 UI，?是??種語?開發完整的應?程序。如下代碼, 通過描述式表達完成了??和邏輯構建：

public?class?MyPage?:?View?{readonly?State<int>?clickCount?=?new?State<int>?(1);public MyPage() {Body = () => new VStack {new Text (() => $"Click Count: {clickCount}"),new Button("Update Text", () => {clickCount.Value++;}};} }

3.安裝Comet for Visual Studio Code 組件

二

通過Visual Studio Code管理你的MAUI項目

1.通過命令行創建一個 MAUI 項目

mkdir mauidemo cd mauidemo dotnet?new?comet

2.通過命令行嘗試運行該項目

dotnet build mauidemo -t:Run -f net6.0-android dotnet build mauidemo -t:Run -f net6.0-ios

運行結果如下：

3.用 Visual Studio Code 打開該項目

打開后，Comet 組件就會檢測你的 MAUI 項目 ， 我們可以看到左下角

你可以點擊選擇選擇相關的運?環境

4.選擇 iOS / Android 直接 在 Visual Studio Code 中運行和調試

打開后，Comet 組件就會檢測你的 MAUI 項目 ， 我們可以看到左下角， 系統會檢測到相關的環境， 并且可以選擇你要運行的設備

設置一個斷點看看

注意：

1.Comet for .NET Mobile 組件還在開發中， 在 MAUI Preview 13 的版本上 Visual Studio Code不能成功加載 Android 設備， 所以例子以 iOS 為主。

2.在 Windows 環境下，如果要調試 iOS 程序，還是得用 Visual Studio 和 macOS 做鏈接，具體方式可以點擊鏈接?https://docs.microsoft.com/zh-cn/xamarin/ios/get-started/installation/windows/connecting-to-mac/進行了解。

三

HotReload 作為補充

之前提過Comet創建的項目是基于MVU模式，界面和業務都是基于函數式的方式去完成。這個時候 HotReload 就非常重要了，可以所編即所得，這也是對 Visual Studio Code 開發 MAUI 應用的補充 ，接下來我也介紹一下。

1.Reloadify 安裝

Reloadify 3000 是一個支持HotReload 的 .NET 組件 ， 已經內置于 Comet 的 MAUI 項目中。安裝腳本如下：

dotnet tool install -g Redth.Net.Maui.Check

2.設置?

進入項目，輸入如下命令

? ? ? iOS:

reloadify mauiappdemo.csproj -t ios

? ??? Andriod

reloadify?mauiappdemo.csproj?-t?android

之后你就可以在 Visual Studio Code 下編寫代碼間同步你的代碼在模擬器, 實現在編即所得。

最后給?家看看我? Visual Studio Code 完成的 MAUI Demo

四

展望

通過 Visual Studio Code 開發 MAUI 應用是值得期待的，也為 MAUI 拓寬了開發場景。結合 Hot Reload會讓跨平臺應用開發更有效率。我期待正式版本能和MAUI有更好的結合！?

總結

以上是生活随笔為你收集整理的CA周记 - 用 Visual Studio Code 做基于 .NET MAUI 跨平台移动应用开发的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。