.NET MAUI代碼一次撰寫，遊走四大平台
有想過撰寫一次代碼，遊走四大平台(Android、iOS、macOS、Windows)的實現嗎？
.NET MAUI實現了這樣的願景，它的前身是由 Xamarin.Forms 演進而來。它的完整英文是.NET Multi-platform App UI (官方中文翻譯是.NET多平台應用程式 UI)。這是使用C#撰寫代碼、XAML定義UI，經過編譯便可生成執行於 Android、iOS、macOS、Windows平台上的應用程式。
.NET 6為了實現這樣的願景，提供了一系列的平台架構，如上圖。
這一系列的平台適用於Android、iOS、Mac的.NET (.NET for Android、.NET for iOS、.NET for Mac)，還有WinUI 3程式庫。它們一致存取.NET 6 BCL (基本類別庫)，而BCL提供抽象化程序會在.NET執行階段對應到合適的執行環境，以Android、iOS、macOS來說，它們的執行環境是使用Mono Runtime，而 Windows作業系統則是.NET Core CLR。
雖然.NET MAUI提供一致的存取介面寫作方式，卻也允許開發者為個別裝置平台因差異的需要而設置不同的UI。
單一專案
Visual Studio 2022只要更新到v17.3.3之後的版本，並且安裝.NET Multi-Platform App UI開發。
建立專案時便可找到.NET MAUI應用程式的專案類型。
完成專案的建立之後，您可以透過綠色箭頭決定要執行在哪一種作業平台。
Visual Studio 2022提供四種平台的執行環境：
l Windows平台(.net6.0-windows 10)，可直接執行
l Android模擬器(.net6.0-android)，必須安裝Android SDK
l Android實機裝置(.net6.0-android)，透過連接線部署到Android手機
l iOS必須與MAC裝置配對(.net6.0-ios)，可以是MAC實機或是雲端MAC裝置
當您建立「.NET MAUI應用程式」專案範本時，裡面已經寫好一個基本範例，直接執行便可。
下圖分別是在Windows、Android模擬器上的執行結果。
設定多重目標
在測試這些環境時，不免想到在不同的平台上多少會有一些無法一致化或是需要特製化的內容(硬體設定、環境變數、權限需求…)，好奇地找尋了一下，專案中如下圖，您會看到一個Platform資料夾，可以針對不同目標平台設定特定的程式碼，以適用於該平台的特定需求。
例如以下內容是Android系統的AndroidManifest.xml檔案，其中user-permission是用來設定裝置需要的權限。這樣的設定，在不同的作業平台是有所區別的。
下圖是Windows系統的Package.appxmanifest檔案：
除此之外，在XAML當中，真的可以為不同平台<OnPlatform xxxx>進行設定。例如：
下圖分別是在Windows及Android模擬器上的執行結果。
XAML即時預覽
剛安裝上Visual Studio 2022 v17.3開啟.NET MAUI專案後，原本預期XAML設計編輯器會有類似WPF專案的設計階段圖形化介面，沒想到只有XAML編輯器沒有圖形化介面，讓我有點小小的失望，不過說真的，寫那麼久的HTML程式，也一直處於沒有圖形化設計介面的狀態，好像也沒有發生手殘的現象。而且Visual Studio是老字號開發者工具，沒有這個就一定有更方便的取而代之。
XAML即時預覽(XAML Live Preview)是使用XAML熱重新載入(XAML Hot Reload)的功能，將修改的XAML即時的反映在視窗當中，使設計人員可以即時檢視到執行階段的變更情形。
在啟動專案執行之後，您可以在視窗框的上方看見一組工具列，這個便是 XAML的偵錯工具，左邊數過來第二個按鈕就是 XAML即時預覽，如圖。
當您按下這個按鈕在Visual Studio中(應該會放在右側)會出現XAML即時預覽視窗，可以試著編輯XAML內容，將發現它會即時呈現修改的內容，如圖。
頁面檢視設計
手機App現在已經是大家熟悉的工具了，當您開始想設計手機App時，您的腦中飄過哪些頁面的樣式呢?您的應用內容要以怎樣的方式排列及呈現呢?
.NET MAUI提供了現代化多種活潑的頁面配置控制項，下圖是擷取官網的幾種頁面設計選項。
l ContentPage
單一頁面的檢視，通常會搭配Grid或是StackLayout配置頁面。
l FlyoutPage
兩個頁面，飛入頁面通常用來定義選單項目，另一個是細節頁面，呈現所選項目的詳細內容。
l NavigationPage
是一種階層式瀏覽頁面的方式，這種方式也常常在許多網頁或是行動裝置的App上看到，是一頁一頁的堆疊上去，透過倒退鍵一頁一頁的退回到前一個頁面。
l TabbedPage
像是瀏覽器上方的頁籤，透過頁籤切換頁面，頁籤可以放在上方或在下方。
除此之外，.NET MAUI還有很多豐富的功能，若您對於.NET MAUI有興趣，想了解更多訊息，歡迎參考課程「.NET MAUI跨界先鋒從桌面到移動的全平台開發旅程」。
0 意見:
張貼留言