歡迎大家加入以下開源社群
Xamarin-Cn:https://github.com/Xamarin-Cn
Mvvmcross-Cn:https://github.com/Mvvmcross-Cn
(另外微信訂閱号 Xamarin 所有者@善友兄也給予了營運權限,後面将開始陸續營運起來,給大家推送相關的文章)
本人利用業餘的時間編寫了關于Xamarin.Android的基礎教程,獲得了很多人的支援。但是筆者打心裡想說的就是這個教程所能提供的知識太有限了,等筆者到新的工作後,會開始抓緊時間寫一些實戰開發中運用的技術以及技巧。現在筆者帶着大家進入Xamarin.IOS的入門教程。
關于環境
如果讀者是破解的,那麼mac這邊的破解可能會傷腦筋,筆者使用的商業版的賬号。當然我這裡建議大家可以到淘寶購買,其實商業版如果以學校機構購買很便宜的。關于環境的講解就到這吧,下面開始正題(這裡推薦一個比較好的QQ群【230865920】)
關于mac與vs比對
不知道大家有沒人卡在這,并不是mac端安裝完畢,vs就可以連接配接。這裡還需要一個過程,筆者在這裡簡單的介紹下。
首先我們在mac端找到這個應用打開:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIyZuBnLyMDN0AjN4YDMzEzMyITMvwVNwUTMwIzLcljMzUjN08CX1EDMyc2bsJ2Lc12bj5ycn9Gbi52YuAzcldWYtl2Lc9CX6MHc0RHaiojIsJye.png)
然後呈現的界面如下所示:
這個時候我們點選Pair之後出現下面這個界面:
其中的這串字元是需要在VS那邊進行比對的時候輸入的,在沒有比對前不要點選close。這樣mac端的就完成了,下面我們轉戰到vs中。
打開vs後點選“工具”->“選項”->“Xamarin”->“iOS Settings”顯示如下的界面:
這個時候我們點選“Find Mac Build Host”之後出現下面這個界面:
直接點選Continue,進入到主界面:
這裡筆者知道mac的ip位址,是以直接點選“Configure Host Manually”,輸入ip位址并确定。然後等待連接配接,連接配接完成後彈出這個視窗:
在其中輸入mac中的字元即可。
正文
現在我們開始進入正文,首先我們通過VS建立一個IOS項目,具體過程如下所示:
建立完項目後打開下面的這個界面(後面跟UI相關的操作我們都會在這個檔案中進行操作)
打開之後我們從工具欄選擇一個“Label”控件放入其中并修改對應的文字,如下所示:
接着再拖放一個“Text Field”控件放在Label下方,并且寬度一樣。并在屬性視窗的Placeholder屬性中輸入“1-855-XAMARIN”。并且在Identity下的Name中輸入“PhoneNumberText”,這個名字會導緻自動生成控件的命名,類似于ASP.NET中的ID屬性。下面我們接着拖放一個按鈕并設定其Name為“TranslateButton”:
最後放入一個按鈕并設定Name為“CallButton”:
這樣我們就完成了整個界面的設計了。下面我們就要開始具體的編碼了,首先我們建立一個cs檔案,并且在其中輸入以下的代碼:
1 public static class PhoneTranslator
2 {
3 public static string ToNumber(string raw)
4 {
5 if (string.IsNullOrEmpty(raw))
6 {
7 return "";
8 }
9 else
10 {
11 raw = raw.ToUpperInvariant();
12 }
13
14 var newNumber = new StringBuilder();
15 foreach (var c in raw)
16 {
17 if (" -0123456789".Contains(c))
18 {
19 newNumber.Append(c);
20 }
21 else
22 {
23 var result = TranslateToNumber(c);
24 if (result != null)
25 newNumber.Append(result);
26 }
27 }
28 return newNumber.ToString();
29 }
30
31 static bool Contains(this string keyString,char c)
32 {
33 return keyString.IndexOf(c) >= 0;
34 }
35
36 static int? TranslateToNumber(char c)
37 {
38 if ("ABC".Contains(c))
39 {
40 return 2;
41 }
42 else if ("DEF".Contains(c))
43 {
44 return 3;
45 }
46 else if("GHI".Contains(c))
47 {
48 return 4;
49 }
50 else if("JKL".Contains(c))
51 {
52 return 5;
53 }
54 else if("MNO".Contains(c))
55 {
56 return 6;
57 }
58 else if("PQRS".Contains(c))
59 {
60 return 7;
61 }
62 else if("TUV".Contains(c))
63 {
64 return 8;
65 }
66 else if("WXYZ".Contains(c))
67 {
68 return 9;
69 }
70 return null;
71 }
72 }
View Code
接着我們打開RootViewController檔案并在ViewDidLoad中完成剩餘功能的開發,首先我們定義一個字元串用來儲存最終需要撥打的電話号碼并未Translate按鈕綁定監聽事件,在點選的時候改變Call按鈕的文字,顯示需要撥打的電話:
1 string translatedNumber = "";
2 TranslateButton.TouchUpInside += (e, s) =>
3 {
4 //将輸入的文字轉換為号碼
5 translatedNumber = PhoneTranslator.ToNumber(PhoneNumberText.Text);
6
7 //關閉鍵盤
8 PhoneNumberText.ResignFirstResponder();
9
10 if (translatedNumber == "")
11 {
12 CallButton.SetTitle("Call", UIControlState.Normal);
13 CallButton.Enabled = false;
14 }
15 else
16 {
17 CallButton.SetTitle("Call " + translatedNumber,
18 UIControlState.Normal);
19 CallButton.Enabled = true;
20 }
21 };
View Code
完成了第一個按鈕開發之後我們繼續下一個按鈕,這個按鈕将會完成撥打電話的功能,如果電話撥打失敗則會彈出提示:
1 CallButton.TouchUpInside += (e, s) =>
2 {
3 //建立NSUrl并通過SharedApplication打開
4 var url = new NSUrl("tel:" + translatedNumber);
5 if(!UIApplication.SharedApplication.OpenUrl(url))
6 {
7 //撥打失敗則彈出提示框
8 var alert = UIAlertController.Create("Not supported",
9 "Scheme 'tel:' is not supported on this device",
10 UIAlertControllerStyle.Alert);
11 alert.AddAction(UIAlertAction.Create("OK", UIAlertActionStyle.Default, null));
12 PresentViewController(alert, true, null);
13 }
14 };
View Code
其中我們需要通過建構NSUrl來指定需要撥打的電話,這裡跟Android的方式很相似,在Android中就是同構建構Intent來實作,然後用過UIApplication中的SharedApplication打開這個NSUrl,如果撥打失敗則會利用UIAlertController建構一個提示框,這裡我們通過Create指定對話框的标題、内容以及樣式,然後再通過AddActiontian添加一個按鈕。最後通過PresentViewConroller打開。
最後我們還需要設定應用的圖示以及緩沖圖檔,這裡我們需要右擊項目屬性并點選IOS Application,我們可以看到需要設定多個圖示,并且在緩沖界面部分需要制定三張圖。這裡筆者可以通過官方的位址下載下傳圖檔資源
最後的成品界面如下所示:
在撥打時候的時候彈出如下的對話框: