Xamarin.IOS之多視圖

歡迎你們加入如下開源社區

Xamarin-Cn：https://github.com/Xamarin-Cn

Mvvmcross-Cn：https://github.com/Mvvmcross-Cn 

（另外微信訂閱號 Xamarin 全部者@善友兄也給予了運營權限，後面將開始陸續運營起來，給你們推送相關的文章）

 

 

繼上節《Xamarin.IOS之快速入門》以後，本節將會在此基礎之上具體擴展，主要是增長一個列表能夠提供歷史撥打電話的記錄。下面咱們直接進入正題。

 

首先打開MainStoryboard.storyboard，咱們在這個基礎之上繼續修改。從工具欄中拖放一個Navigation Controller到故事板中，而後咱們能夠看到以下所示：

 

可是當前的主視圖控制器仍是以前的，咱們須要將新的設置爲主視圖，因此咱們要將拖放到下面這個視圖控制器，而後咱們還須要刪除Navigation Controller所指向的那個視圖控制器，而後按下Ctrl並左擊Navigation Controller，進行拖拽，會發現一個藍色的線條，咱們就須要講這個藍色線條拖拽到咱們上節作的那個視圖控制器上，並在彈出的下拉中選擇Root，這樣就表明這個導航控制器的根視圖控制器就是咱們上節的那個，進行這番操做的結果如圖：

咱們能夠看到咱們的視圖控制器上多個了標題欄，咱們能夠雙擊它，修改爲「Phoneword」。接着咱們從新拖拽一個Button到Call按鈕下，而且寬度和上一個按鈕同樣，同時設置該按鈕的Name爲CallHistoryButton，顯示的文字爲Call History。完成以後的界面以下所示：

 

下面咱們就須要去完成Call History跳轉到的視圖控制器，咱們先從工具欄中拖拽一個Table View Controller放入到故事板中，而後打開屬性窗口修改該視圖控制器的Class爲「CallHistoryController」並回車確認，這個時候你能夠看到vs爲咱們生成了一個CallHistoryController.cs的文件，而後咱們雙擊進入到而後輸入如下代碼：

 1 partial class CallHistoryController : UITableViewController
 2     {
 3         public List<String> PhoneNumbers { get; set; }
 4 
 5         private static string callHistoryCellId = "CallHistoryCell";
 6 
 7         public CallHistoryController (IntPtr handle) : base (handle)
 8         {
 9             //註冊UITableViewCell類型而且標識符爲callHistoryCallId指定的字符串
10             TableView.RegisterClassForCellReuse(typeof(UITableViewCell), callHistoryCellId);
11 
12             //爲TableView指定數據源
13             TableView.DataSource = new CallHistoryDataSource(this);
14             PhoneNumbers = new List<string>();
15         }
16 
17         private class CallHistoryDataSource : UITableViewDataSource
18         {
19             private CallHistoryController mController;
20 
21             public CallHistoryDataSource(CallHistoryController controller)
22             {
23                 mController = controller;
24             }
25 
26             public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)
27             {
28                 //根據標識符獲取表格項
29                 var cell = tableView.DequeueReusableCell(CallHistoryController.callHistoryCellId);
30                 int row = indexPath.Row;
31                 //設置表格項顯示的文字
32                 cell.TextLabel.Text = mController.PhoneNumbers[row];
33                 return cell;
34             }
35 
36             public override nint RowsInSection(UITableView tableView, nint section)
37             {
38                 //返回數據總數
39                 return this.mController.PhoneNumbers.Count;
40             }
41         }
42     }

View Code

 

 

完成了CallHistoryController以後，咱們回到故事板中按下Ctrl和左擊從Call History按鈕中拖拽中藍色線條，放到CallHistoryController中。並在彈出的下拉中選擇第一個，這樣當咱們點擊按鈕的時候就會實現跳轉到那個指定的視圖控制器了，下面咱們還要修改RootViewController中的代碼，以便在撥打的時候記錄電話號碼，而且在顯示CallHistoryController前將記錄賦值給PhoneNumbers中。

 

咱們先定義一個保存電話的數組，並在構造函數中初始化：

        public List<String> PhoneNumbers { get; set; }

        public RootViewController(IntPtr handle)
            : base(handle)
        {
            PhoneNumbers = new List<string>();
        }

 

 

而後在CallButton的TouchUpInside事件中的開頭部分增長下面這段代碼：

PhoneNumbers.Add(translatedNumber);

 

 

最後最關鍵的部分就是在CallHistoryController打開的以前將記錄傳遞過去，那麼咱們就須要重寫PrepareForSegue方法：

1         public override void PrepareForSegue(UIStoryboardSegue segue, NSObject sender)
2         {
3             base.PrepareForSegue(segue, sender);
4             var callHistoryController = segue.DestinationViewController as CallHistoryController;
5             if(callHistoryController != null)
6             {
7                 callHistoryController.PhoneNumbers = PhoneNumbers;
8             }
9         }

 

這裏咱們經過segue的DestinationViewController訪問將要打開的視圖控制器，而且嘗試強制轉換成CallHistoryController類型，若是是該類型則將記錄的數據賦值過去，這樣咱們就完成了，下面咱們能夠看到最終的效果圖：

 

點擊Call History以後

 

固然除了能夠直接指定按鈕打開的視圖控制器外，還能夠經過代碼的方式去指定打開燈視圖控制器，前提是咱們須要給這些視圖控制器設置Storyboard ID，因此咱們須要先設置CallHistoryController的屬性中的Storyboard ID爲「CallHistoryController」，而後註釋掉PrepareForSegue方法的代碼，而且刪掉咱們在故事板中爲Call History設置的跳轉，在ViewDidLoad中新增CallHistoryButton的監聽事件，以下所示：

1             CallHistoryButton.TouchUpInside += (e, s) =>
2             {
3                 CallHistoryController callHistory = Storyboard.InstantiateViewController("CallHistoryController") as CallHistoryController;
4                 if(callHistory != null)
5                 {
6                     callHistory.PhoneNumbers = PhoneNumbers;
7                     NavigationController.PushViewController(callHistory, true);
8                 }
9             };

這裏咱們經過Storyboard的InstantiateViewController實例化指定的Storyboard ID的視圖控制器，而且轉換爲對應的類型，若是不爲null則將數據傳遞過去，而且經過NavigationController的PushViewContoller呈現這個視圖控制器。到此爲止咱們的開頭兩篇入門就結束了。