從Android的角度看Storyboard

標籤：storyboard   android   ios   

由於先入為主的原因，Android 開發人員很容易搞混某些 iOS 術語，導致理解上出現偏差。舉個栗子，Objective-C 中有一個關鍵詞 interface，雖然 Java中也有 interface，但兩者的含義是完全不同的，除此之外，還有很多概念相同，但是叫法不同的術語，比如 Closure（閉包） 在 Objective-C 中稱作 Block。如果在學習過程中能夠注意到這些不同點，不僅有助於理解術語的語義，也能夠促使自己重新梳理已經掌握的 Android 知識點，可謂一舉兩得。這也讓我想到當年背日語單詞的時候，常常會查一下和英辭書看看對應的英文釋義，好像能理解得更透徹一點。

所以今天突發奇想，嘗試從 Android 開發的角度來總結一下 iOS 開發。這兩天都在學習 Storyboard，正好寫篇博文總結一下，有關Storyboard的筆記都記錄在我的github。

Storyboard是什麼

用 XCode 建立一個 Project 後，系統會自動添加一個叫 Main.storyboard 的檔案，然後大部分的UI，包括頁面的跳轉都可以在這個 Storyboard 中構建。是一個典型的工程目錄結構。

?

Storyboard 的中文意思是情節串聯圖板，顧名思義，Storyboard 會把一些列的 Scene（情節）串聯起來，構成一個 Story。

?

這個概念應用到APP開發中也比較容易理解：

每個頁面就相當於一個Scene，Storyboard 把這些頁面串聯起來之後，就形成了一個 Story，也就是我們的 APP。

嚴格的定義可參考官方解釋：

A storyboard is a visual representation of the app’s user interface, showing screens of content and the transitions between them. You use storyboards to lay out the flow — or story — that drives your app.

其中有幾個比較重要的關鍵詞 visual representation、screens of content、transitions、flow / story，可以好好理解一下。

概念比較簡單，用法當然也非常簡單，因為 Storyboard 是一個 visual representation，所以開啟 Main.storyboard 之後就可以進行WYSIWYG的編輯，如果一個 APP 包含多個 screens of content，那麼它的 Storyboard 可能會如下所示：

圖中可以看出，每個 screen of content 可以呈現可視化的控制項(Control)，連線則表示 transition，它們作為一個整體構成了一個 flow / story。

一個 Storyboard 可以完整地展現出一個 APP，包括它的頁面跳轉和大部分的UI元素。

雖然 Storyboard 的功能已經很強大，但是也有一個不可迴避的問題，如果 APP 的頁面比較多，勢必會導致資料的可視化變得比較複雜，當然如果你有一個很大的顯示器，可以另當別論。相信 Apple 會逐漸解決這個互動問題。

Android如何構建Story

再從 Android 的角度來看， 一個 activity 就是一個 screen of content，intent 表示 transition，但是 Android 無法用可視化的方法來表示這種 transition，因此缺少了 visual representation，也就無法構成一個 flow / story。

參考

1. Storyboards Tutorial in iOS 7: Part 1
2. Storyboards Tutorial in iOS 7: Part 2
3. Tutorial: Storyboards

從Android的角度看Storyboard