Visual Studio 跨平台開發實戰 (1) -- Hello Xamarin!
前言應用程式發展的腳步，從來沒有停過。從早期的 Windows 應用程式， 到網路時代的 web 應用程式，再到近幾年相當盛行的行動裝置應用程式 (Mobile Application)，身為 C# 的開發人員與 Visual Studio 的使用者，除了開發 Windows Phone 與 Windows Store App 外，如果能夠讓你使用 C# 及 Visual Studio 熟悉的開發環境來開發 iOS 及 Android 的 app，是否能再度喚醒你的開發魂？Xamarin 正是為了這樣的需求而生的 framework。 |
 |
Xamarin 簡介Xamarin 是由早期的 Mono 專案演變而來，原本是在 Linux 上執行 C# 程式的一個開放原始碼專案。後來陸續發表支援 iOS 的 Mono Touch framework 以及 Mono For Android Framework。因此它在市場上並不是一個新的產品。2011 年，原本在 Novell 的 Mono 專案團隊獨立成立一家公司，正式將名稱改為 Xamarin，此為 Xamarin 的由來。Xamarin 具有以下特點：
|
系統需求
|
|
安裝 Xamarin
無論是在 Windows 或是 MAC 上安裝 Xamarin 都相當簡單，只要在 http://xamarin.com / download 上填入名稱及 Email 帳號，便可以進行下載。而只要依照安裝精靈點選下一步，就可以將 Android SDK 等相關元件裝好。
Windows 版安裝晝面：
|
MAC 版安裝晝面：
|
Xamarin 是一個商業的 Framework，但您可以完整試用 30 天，或是使用免費版本。但免費版本限制開發人員編譯後的 IL code 大小不能超過 32 K，且無法使用 Visual Studio 進行開發 ( 只能使用 Xamarin 提供的 Xamarin Studio )。
安裝好 Xamarin 之後，需要註冊一個 Xamarin 帳號進行啟動。
- 開啟 Visual Studio，點選工具 -- Xamarin Account
- 若先前已經註冊過 Xamarin 帳號 ( 請注意，Xamarin 帳號與先前下載所填的 Email 不同)，請直接輸入帳號密碼登入，若您是第一次使用，請申請新的 Xamarin 帳號。
登入後便可以開始開發 Android 及 iOS 應用程式囉！
使用 Visual Studio 開發 Android HelloWorld！
使用 Xamarin 開發 Android 應用程式可說是相當的方便，不僅支援在 Visual Studio 中使用拖曳的方式設計使用者介面，還整合如 AVD 及 SDK Manager 等工具。廢話不多說，開始我們在 Visual Studio 上的第 1 支 Android 程式吧 ~
- 在 Visual Studio 中新增專案，在專案範本中，請展開 C# 節點，你會發現專案範本會多出 Android 及 iOS 類型的專案範本，我們在這個範例中選擇 " Android Application "，並在名稱中輸入 " HelloDroid " ( 當然您可以改成任何您想要的名稱 )
- 專案建立後，您會發現工具列中多出幾個項目：
說明如下 ( 由左至右 )：-
目標裝置：可以選擇將目前的專案部署到哪一個裝置，預設的 " Prompt for Device " 則是會在開始除錯/部署時，彈出視窗供使用者選擇。若有接上實體裝置，也會出現在此選單中。
-
裝置記錄：可以挑選裝置並顯示目前裝置的活動記錄。
-
開啟 Android 虛擬裝置管理員 (AVD)，透過此管理員，您可以新增，開啟或編輯 Android 模擬器。
-
Android SDK 管理員：由於 Android 版本 (API Level) 眾多，您可以在這個管理介面，安裝所需的 SDK 版本及元件。
-
目標裝置：可以選擇將目前的專案部署到哪一個裝置，預設的 " Prompt for Device " 則是會在開始除錯/部署時，彈出視窗供使用者選擇。若有接上實體裝置，也會出現在此選單中。
- 預設的專案中會內建一個 Button 控制項並寫著 " Hello World,Click Me "，開啟專案下的 Resources -- Layout -- Main.axml 可以進行頁面的設計。
- 而此範例的主要程式碼則是 Activity1.cs，直接透過下圖的註解來說明：
看到這樣的程式碼，我想大家應該都不會感到陌生。筆者有一些學員跟我說，感覺跟開發 Windows Form 應用程式好像 ~~ Activity1.cs 相當於 MVC 分層的 Controller。透過 SetContentView 方法，告訴系統要載入哪一個頁面。接著透過 FindViewById 方法取得畫面上按鈕的物件實體。接著便可以針對按鈕的屬性或方法撰寫相關的程式碼，或是處理按鈕的事件。如上圖所示，預設的範例是使用匿名方法，我們將它註解後，改用 Lambda Expression 來撰寫。 - 接著按下 F5，便可以開始進行除錯，若沒有預先開啟 Android 模擬器，則 Running devices 列表會是空的，這時可以點擊下方的 " Start emulator image " 連結來啟動模擬器。
- 執行結果如下：
是不是相當簡單呢？ 接下來我們來開始 iOS 的 Hello World。
使用 Visual Studio 開發 iOS HelloWorld！
與開發 Android 不同，目前 Xamarin 尚未支援在 Visual Studio 中設計應用程式頁面，但官方表示目前已在研發當中，並會在不久之後的版本提供此功能。因此目前 iOS 專案的 UI 設計必須透過 MAC 的 Interface Builder ( XCode 的一部份 )，或是直接在程式中宣告控制項的位置及大小，Visual Studio 中的 HelloWorld Application 便是使用此方法。
- 在 Visual Studio 中新增專案，在專案範本中選擇 iOS 下的 iPhone，並在右邊的範本中選擇 HelloWorld Application，接著指定專案名稱 ( 此處為 HelloIOS )
- 第一次開啟 iOS 專案時，Xamarin 會提示使用者只有在商業版或更高的版本才能在 Visual Studio 中開發 iOS 專案。
接著 Xamarin 便會自動啟用試用版本的授權，啟動完畢後，會提示使用者 Visual Studio 將會重新啟動。
若您 MAC 上的 Xamarin 授權尚未啟動，將會看到系統提示，說明 Build Server ( 也就是 MAC ) 尚未啟用授權。此時按下 Activate 按鈕可能沒有作用，請依照下面的步驟，在 MAC 上啟用 Xamarin 授權。
- 由於 Xamarin 在 MAC 上預設是以免費版本開啟。因此可以透過以下方法強制啟用 Xamarin 試用授權。首先在 MAC 的 Finder 開啟 Xamarin Studio
新增一個專案，選擇 iPhone -- Single View Application。專案建立後，點擊功能表中的專案 -- Profile - Mono
此時會看到授權啟用的畫面。當完成啟用後，我們就可以回到 Visual Studio 來指定我們的 Build Host。
- 在 Visual Studio 的工具 -- 選項中，可以看到多出了一個 Xamarin 節點，點擊 Xamarin 下的 iOS Settings，在右邊可以指定 Mac Build Host。您可以直接輸入 MAC 的電腦名稱或 IP 位址，或按下 Configure 進行設定。
在設定視窗中，Xamarin 會搜尋同一網段中已安裝並啟用 Xamarin 的 MAC 機器。若狀態顯示為 "Ready"，請按下 Connect 進行連線。
若狀態不是 "Ready"，可以按下 Diagnose 按鈕進行連線診斷。如下圖所示，若某一個或多個項目無法通過連線診斷，則會出現 failed，您可以展開 failed 的項目了解失敗的原因。
- 請在組態管理中，將平台設定為 iPhoneSimulator，預設為部署至實體機器，但這需要向 Apple 申請付費的開發者帳號。
接著在工具列中，可以選擇 iOS 模擬器的版本，右邊綠色打勾的符號表示已與 MAC Build Host 的連線正常，若是反灰的狀態，請按一下右邊的 圖示重新與指定的 Build Host 連線。
- 開啟專案中的 MyViewConrtoller.cs 檔。在此範例中，同樣是在畫面中間放置一個 Button 控制項 ( 在 iOS 中的類別名稱為 UIButton ) 並顯示點擊的次數。由於我們是在程式中產生控制項，因此有部份程式碼是在宣告物件的佈局屬性，請參考下圖中程式碼的註解：
- 接下來才是範例程式的重點，若您是在 XCode 中設計好 UI，則可以取代上面的程式。
如同先前 Android 的 HelloWorld，在 iOS 中，按鈕的點擊事件不叫 Click，而是 TouchUpInside，因此我們透過此事件的處理，在使用者點擊了按鈕後，改變按鈕的顯示文字 ( 使用 UIButton 的 SetTitle 方法 )。最後將 Button 控制項透過 View.AddSubview 方法加入到畫面當中。執行結果如下：
跨平台開發簡介
作為一個跨平台的解決方案，使用 Visual Studio 搭配 Xamarin 開發行動裝置應用程式具有以下特色：
-
可以在同一個方案中包含所有平台的專案：包括 Windows Phone，Windows 8 Store App，iOS 以及 Android。如下圖所示：
-
程式碼共享：在設計時，將與平台無關的商業邏輯、服務存取、資料存取以及資料層從介面抽離出來，如下圖所示：
底下說明如何才能達成上述的專案整合以及程式碼共用，首先來看看架構示意圖：
從上述的示意圖，我們可以看到，左半邊是可以抽離出來的共用程式碼，這部份將獨立成一個專案，並只加入常用的組件 ( 如 Base Class Library )，若有部份程式碼使用到與平台相關的組件或技術，可以在程式碼中加入 條件式編譯的指示詞，供各平台直接使用，不需要進行修改。而在各平台的專案中，可以透過檔案連結的方式，將共用程式碼的部份連結到各平台專案。但由於目前 Visual Studio 並沒有提供可以同時設定多個檔案或整個資料夾連結的方式，因此若每個檔案都要手動連結，其實是較不實際的。而且日後共用程式碼專案若有檔案的異動，如新增或刪除。各平台專案並不會同步更新。此時我們可以透過 1 個叫做 " Project Linker 2012 " 的擴充功能進行協助 ( 它也有對應 Visual Studio 2010 的版本 )。
安裝好 Project Linker 後，我們便可以在各平台專案點擊滑鼠右鍵 -- Add project link
接著選擇來源專案，之後便會為來源專案的每個資料夾及檔案進行連結。
連結的檔案在 Visual Studio 中都會有個藍色箭頭的圖示
透過上述的設定後，便可以在各平台專案共用程式碼。在開發平台專案時，只要針對使用者介面以及針對控制項的操作撰寫程式即可。對於商業邏輯，資料存取的部份則可以在各平台共用，這是使用原生的開發方式 ( Objective - C，Java ) 所無法達到的。實際執行結果如下：
