iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 2
1
自我挑戰組

IOS app開發介紹系列 第 2

IOS app開發介紹 - UI概念之viewController

  • 分享至 

  • xImage
  •  

第一天講述關於Swift語法的概要與學習資源,接下來講的是一個app最重要的畫面(UI)

IOS的UI是由interface builder來刻畫,而控制ui的變化與使用者的互動,則是由ViewController來控制
(p.s
如果是學過Android的人,不妨把
interface builder當作layout.xml
ViewController當作Android的activity
概念其實差不多,只是實作會受到ios與xcode的framework與環境影響,而感覺是不一樣的東西
)

今天先講解關於ViewControllers的特性與用法,分為5個方面來說明:

1. 兩種ViewControllers
2. ViewController容器
3. UIViewController生命週期
4. 開啟下一個頁面(ViewController)
5. 兩個ViewController傳遞資料的方式

1. 兩種ViewControllers:

1) 顯示內容的ViewController
(ex: UIViewController,UITableViewController)
2) ViewController容器
(ex: UINavigationController,UITabBarController)


顯示內容的viewController就是單純負責畫面的呈現與使用者互動與控制,而ViewController容器除了負責畫面呈現外,還包含了管理viewController的顯示與消失的順序與方法.以下只針對ViewController容器來特別說明.


2. ViewController容器

UINavigationController
在畫面呈現部分:
提供了導航列(navigationBar和toolbar的控制)
管理viewController的顯示與消失的順序與方法:
以stack管理viewController之間的關係,並提供由左往右滑動回到前一頁(or viewController)
(p.s Android本身就是用stack在控管每個activity,但ios需要把UINavigationController當作第一個rootViewController,才能用stack的方式來控管每個頁面)

UITabBarController
在畫面呈現部分:
提供了tab bar讓使用者可在不同頁面間切換
管理viewController的顯示與消失的順序與方法:
以array方式來管理viewController之間的關係,可以讓使用者透過點擊tab來切換頁面
https://swiswiswift.com/wp-content/uploads/2018/06/uitabbarcontroller-20180602.gif

3. UIViewController生命週期:

init
loadView
viewDidLoad ----- Android onCreate()
viewWillAppear ----- Android onResume()
viewDidAppear
viewWillDisappear ----- Android onPause()
viewDidDisappear
viewWillUnload
viewDidUnload
dealloc ----- Android onDestroy()
這裡不多做解釋,單純列出與Android activity對應的callback function,詳細資訊可參考:
https://cg2010studio.com/2013/05/15/ios-%E8%A6%96%E5%9C%96%E7%9A%84%E7%94%9F%E5%91%BD%E9%80%B1%E6%9C%9F-view-life-cycle/

4. 開啟下一個頁面(ViewController):

1.用push(需navigationController為基底):
ex: self.navigationController.pushViewController(NextPageViewController, animated: true)
p.s 關閉用self.navigationController.popViewController(animated: true)
2.用present(通常用在顯示對話框或不需要導航列的頁面):
ex: self.present(NextPageViewController, animated: true, completion: nil)
p.s 關閉用self.dismiss()

Note: 只有push顯示出來的新頁面,才可以用手由左往右滑返回前一頁

5. 兩個ViewController傳遞資料的方式:

1. 共用data model
2. 直接把參數傳給另一個viewController的變數
  ex: 要從ViewControllerA跳轉到ViewControllerB,並帶參數A給ViewControllerB,則ViewControllerB中要宣告一個變數data 來接
Sample code:

   let vc = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "ViewControllerB_ID") as? ViewControllerB 
    **vc.data = A**
    self.navigationController.pushViewController(vc, animated: true)

上一篇
IOS app開發介紹 - Swift語法概要
下一篇
IOS app開發介紹 - UI概念之Interface Builder
系列文
IOS app開發介紹22
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言