Just a Computer Graphics Studio & My Life

承接深度了解專案:電話字 (Sample Project: Phoneword),再來學習多螢幕架構,同樣也是跟Xcode非常相似的做法,看到介面很快就能上手!

Xamarin phoneword00010

簡直就一模一樣嘛⋯⋯view controller的連結也是透過拉藍色線

過去我鮮少使用Storyboard,多使用Xib,不過因Apple一直在推廣Storyboard(範例程式都以它為主),我們豈能守舊而唯Xib獨尊?想想過去技術高手只想用code,來處理App所有層面的事情,現在看起來是多麽不切實際呢!之所以會發明新的工具,就是想增進開發效率,所以讓我們來擁抱改變吧!

執行結果在實機iPhone 6上是這樣子:

Xamarin phoneword00011

按下Call History,就會跳轉到table view controller。

Xamarin phoneword00012

在此我們要拉元件Table View Controller,並在Properties Pad上的Class命名CallHistoryController。

Xamarin phoneword00007

此時左方Solution Pad就會自動出現CallHistoryController.cs,也就是介面 (View)控制器 (Controller)已產生連結。

Xamarin phoneword00008

若要使用程式碼來跳轉到table view,則要在Storyboard ID設定CallHistoryController,那麼程式碼就可指定CallHistoryController,來初始化它。

Xamarin phoneword00009

多螢幕這個教學有個非常重要的概念是MVC (Model-View-Controller)設計模式,相信看到這張圖解就知道它在做什麼。

Xamarin phoneword00001

這裡用到Navigation Controller,舉內建的設定App為例,你不斷點進去,這就是它的作用,而其資料結構是Stack

Xamarin phoneword00002

Provides Hooks for Forward Navigation

Xamarin phoneword00003

Optionally Provides a Back Button

Xamarin phoneword00004

Provides a Title Bar

Xamarin phoneword00005

我們按下Call History,即會將曾經打過的號碼傳到table view顯示。資料結構命名不一樣,在Objective-C是Array,在C#是List

Xamarin phoneword00006

程式碼可以參考我放在GitHub上的專案:Phoneword

參考:Part 2: Deep Dive | Xamarin、Part 1: Quickstart | Xamarin。

廣告

發表留言

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 / 變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 / 變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 / 變更 )

連結到 %s

標籤雲

%d 位部落客按了讚: