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

本篇是 Re: 從零開始用 Xamarin 技術來複刻過去開發的一個 App: TopStore 系列文的 EP25。

目前在 TopStore App 當中，如果使用到 PersonDetailPage 輸入聯絡人資料的時候，一定會有個疑慮，那使用者輸入資料的格式驗證該怎處理?

在微軟的官方文件上有一篇教學 "Validation in Enterprise Apps" :
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/enterprise-application-patterns/validation

基本上如果有興趣的捧友，可以好好的研究該篇文件教學。

不過由於實作上太複雜，本專案只是個小小的 App 撰寫，需要驗證資料的部分希望能簡易一些，而如果各位有寫過 ASP.NET MVC 或 .NET 類似的程式，應該對 "Data Annotation Validators" 的技術不陌生。

本篇 EP25 就來 "致敬" 這樣的驗證方式來完成吧!

那就開始囉~~~

首先，先在 Xamarin.Forms 專案來安裝 "Data Annotation" 的 Nuget 套件。

在 Xamarin.Forms 專案右鍵選單點選 "管理 Nuget 套件"。

打開 "管理 Nuget 套件"，點選 "瀏覽"。

搜尋 "DataAnnotations" 關鍵字。

找到 System.ComponentModel.DataAnnotations 這個套件，並且點選 "安裝"。

安裝完成後，在 Xamarin.Forms 的專案中確認一下所安裝的 Nuget 套件。

接著在 Utilities 資料夾新增一個類別。

把該類別命名為 ValidationHelper。

加入完成後的原始類別檔案。

引用所需要的命名空間。

撰寫其 ValidationHelper 內容。

接著就打開 Person 類別，引用 System.ComponentModel.DataAnnotations 的命名空間之後，即可幫 Person 各個屬性上掛上 DataAnnotations 所需的 Validation Attritube。

接著再打開 PersonDetailPage。

並且針對每個 Entry 下方都再多設計一個 Label 來做為提示訊息要顯示的控制項。

注意其 Label 有設計 x:Name 的命名為 "繫結屬性名稱" + "Error"，且 IsVisible 設定為 "False"，顏色設定只是為了顯眼而已。

完成後，打開 PersonDetailPageViewModel 並找到其 SaveCommand 的 Command 設計，在其中多增加 ValidationHelper 的 IsValid 方法呼叫，並判斷輸入資料驗證失敗時，不執行後續儲存的動作。

接下來就在雙平台(iOS、Android) 來執行看看吧!

聯絡人列表點選 "新增"。

進入到 "聯絡人詳細資料"。

什麼都不打直接點選 "儲存"，出現 Validation Error 的文字。

打錯誤的 "電話" 與 "Email" 格式資料，點選 "儲存"，出現 Validation Error 的文字。

Ya! 完成~~~

下回 EP26 見囉!

搭啦嘎呀逼~~~

參考連結:

1. System.ComponentModel.Dataannotations:
   https://docs.microsoft.com/en-us/dotnet/api/system.componentmodel.dataannotations
2. Xamarin Forms - Validations Made Simple:
   https://www.codeproject.com/Articles/1274851/Xamarin-Forms-Validations-made-simple