Hello, 各位 iT 邦幫忙 的粉絲們大家好~~~

在本系列文會利用目前 Visual Studio 內建的專案樣本建立一個初始的 .NET MAUI 專案，並且透過此 .NET MAUI 專案來把 TopStore App 的開發從 Xamairn.Forms 轉換到 .NET MAUI 上進行。

本篇是 Re: 從零改成用 .NET MAUI 技術來繼續過去用 Xamarin 開發的一個 App : TopStore 系列 系列文的 EP07。

最後來進行已被移除的類別庫與調整。

由於升級這件事，必然會遭遇部分類別庫當中的 API 或是屬性無法直接對應，在目前 TopStoreApp 開發於 Xamarin.Forms 版本中所寫到的部分，有使用到 Frame 這個 UI 元件，其中的 OutlineColor 屬性，在微軟官方文件當中就已經明確告知已移除，並請改換 BorderColor 使用：
https://learn.microsoft.com/dotnet/api/Xamarin.Forms.Frame.OutlineColor

根據過去 Xamarin.Forms 的原始碼 PR 修正，可觀看此連結：
https://github.com/xamarin/Xamarin.Forms/pull/1385

所以，如果是已經歷經前 6 回調整的 .NET MAUI 版本的 TopStoreApp 專案，直接進行專案編譯，會顯示如下錯誤訊息：

因此，來將 OutlineColor 屬性改換 BorderColor 並使用想要設定的顏色來調整：

接著，來進行一些根據 .NET MAUI 新設計的開發觀點來調整程式。

像是過去 Xamarin.Forms 當中運用字型圖示檔來設定 FontImageSource 的方式，在 .NET MAUI 已經可由共用 Resources 底下的 Fonts 字型檔來提供 (EP04 所設定)，就需要改成現在 .NET MAUI 的設計方式來使用。

來開啟 .NET MAUI 專案當中的 "MauiProgram.cs" 檔案，會注意到 MauiApp 的 Builder 已經有透過 .ConfigureFonts() 設定既有存在預設範本專案的字型檔案。

在這邊變更為先前加入的 "FontAwesome5.otf" 的使用：

進行測試執行 Part 1

到這邊就可以來嘗試把 TopStoreApp 的 .NET MAUI 版本在四種平台測試執行看看了！

Windows

若在 Visual Studio 2022 執行架構 (.net6.0-Windows) 的設定底下執行：

即可看到 TopStoreApp 在 Windows 環境當中執行起來(注意 Windows 10/11 中必須先 "同意" 使用開發者模式進行側載安裝)：

聯絡人列表頁面：

聯絡人新增/修改頁面：

物品項頁面：

訂單頁面：

設定頁面：

Android

若切換 Visual Studio 2022 執行架構 (.net6.0-Android) 的設定底下執行：

即可看到 TopStoreApp 在 Android 環境當中執行起來：

聯絡人列表頁面：

聯絡人新增/修改頁面：

物品項頁面：

訂單頁面：

設定頁面：

至於 iOS 與 macOS 就留待下一回來測試執行囉！

本 EP 介紹所完成的範例程式碼可在此下載。