prettyprint

2015年10月13日 星期二

iPhone App 設計概念: MVC 設計模式

2015.10.12

iPhone App 設計遵循 MVC 設計模式 Design Pattern。此 MVC 即 Model - View - Control 的縮寫。當 Ap 
變得複雜時,會將問題切割為較小單位來解決,此為 Divide and Conquer 方法。所以,MVC 模式也以 Divide 
and Conquer 的思維,將問題簡化,各司其職。 Model 負責 Data 資料的存取,View 負責資料的 Presentation
 呈現,而 Control 則是此模式的神經、管家,負責運算邏輯 Logic,作為處理 Model 與 View 之間的橋樑。
MVC 模式已被廣泛運用在 AP 的開發。 Apple 提供一個整合免費的開發環境,即 Xcode。 App 設計時,需考慮 
User 如何與裝置 device 互動,這互動是藉由 App 所提供的 UI 介面達成。 Xcode 內含 UI 開發工具 
Interface Builder,讓開發人員用“畫”的方式,將所需要呈現的 UI 元件拖曳到"畫面“ Screen 上,這 
“What You See Is What You Get 所見即所得”的直覺式設計 View 的方式,大大降低開發人員過去以文字 
Code 的輸入方式所耗的時間。

Apple 的 UI 設計,一般我們設計的 App 只會在一個 device 呈現,當我們要將 UI 元件"畫“上時, Apple 
已為我們準備一個唯一的 UI 容器 Container,這容器即是 Window。這 Window 就暫且把它看成 Storyboard。
由於這 Window 只是容器,沒有我們平常看到的像是按鈕等 UI 元件,所以只是個 UI 框架。但,UI 元件不能
"畫“在這 Window 框架中,只能畫在"視圖 View"上,所以在畫 UI 元件前,我們必須先準備好 View 這視圖。
既然 Window 是個大容器,它可以依據需要容納更多的視圖 View,而每個 View 與 View 之間並不是單獨存在
的,而是有關係的,這關係在 Xcode 工具中是用 Seque 的方式來連結。當所有的 View 都連結好後,這 App 
要提供給 User 什麼樣的功能就此完整呈現說明。所以 Apple 在 UI 設計上以 Storybord 故事分鏡的概念來
完成。當然,完成 Storyboard 之前,我們已經將每個 View 所需要的 UI 元件都“畫”到各自的 View 中。若
我們設計的 App 會在 2 個以上的裝置 device 顯現,此時 App 的 UI 就需要 2 個以上的 Window 容器,
每個 Window 容器各自對應到特定的顯示裝置。

當 UI 介面定稿,接下來我們要讓 App 能“動”。UI 視圖 View 上面這些元件大致上分為 2 類。一類只是顯示,
不需要任何動作。另一類 UI 元件則需要後續處理。對於後續需要處理的 UI 元件,我們就必須能識別,因此會
設定"變數“名稱命名。當 UI 元件與程式裡與其有關的識別名稱都準備好,此 2 者各自獨立,誰也不認識誰。
此時,Apple 提供一個 connect 的機制,將 UI 元件與其相關的識別名稱 variable 關聯起來, 而在此識別
名稱前加入一個特別的前綴詞 @outlet。另外,若這些元件是與 event 事件有關的元件,例如 Button 按鈕,
這時 Apple 提供另外一個 connect 機制,講此類 UI 元件與其相關的“動作 Action"關聯起來,而在此事件
名稱前加入一個特別的前綴詞 @action。 由於 iPhone 的 App 遵循 event driven 此 windows 模式架構,
所以當 User 按下 Button 安扭時,會觸發一個事件 event。當事件被觸發後,接下來程式就要決定接下來該
怎麼處理。若還需要進一步讀取資料庫,則讀取完畢後再處理資料,而將最後處理的結果回傳給 View,由 View 
將結果顯示出來。因此我們說 Control 這模組是負責運算邏輯 Logic,作為處理 Model 與 View 之間的橋樑。
要注意:每個 View 視圖的背後都會有一個,且是唯一的 ViewController 來控制這視圖 View 的 UI 元件,
以及其之間的 Logic 處理。

剛提到,若 Control 模組處理時,需要額外的資料,它會透過機制向 Model 模組要資料。這些資料可能是有關
 App 設定的 plist 檔案。若更複雜則使用小而美、有五臟俱全資料庫能能的 SQLite,或是使用 Apple 貼心的
設計 Core Data 機制。 Core Data 是將 data base 的複雜性封裝,而提供等同的資料庫存取介面,方便開發
者使用。有時 App 的質料必須連結至網路例如 iCloud 讀取。基本上 Apple 對資料的安全維護控管採用 
Sandbox 的概念,即每個 App 各自有屬於自己的資料庫,各自井水不犯河水。當然,這也有例外。Apple 也提供
讓不同的 App 共用存取資料的方式,例如 iPhone 的聯絡人資料。所以剛接觸 iPhone App 設計時,書本會要求
你不勾選 Core Data,就是說這測試學習用的 App 並不需要存取任何資料。

學習 iPhone App 的設計,熟習了解 MVC 設計模式是很重要的,如此我們才能將 App 的設計的實作部分由繁入
簡。 MVC 設計模式好比是森林,接下來我們要入林探訪,了解整個 App 設計概念的細節部分。這其中較常被忽略
的是 UIViewController 的 Life Cycle。 各 View 中的 UI 元件何時被建立,又何時被釋放,
這些觀念要釐清,我們才知道程式碼該放在那個函數 function 中。


後記:

對 iPhone App 入門者而言,這 MVC 設計模式,以及與 Xcode 工具之間的關係與運用,總要摸索一段時間。若
僅是跟著書本敲打,而只知其然,不知所以然,在往後開發一個 App,遇到困難點就會不知道如何除錯 debug。
在此將學習過程紀錄,有助於其他人學習。

參考:

1. File:MVC Diagram (Model-View-Controller).svg, https://commons.wikimedia.org/wiki/File:MVC_Diagram_(Model-View-Controller).svg



沒有留言:

張貼留言

prettyPrint();