iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 6
0
Software Development

30天Swift入門學習系列 第 6

iOS App實作(5) UITabBarController + UINavigationController


Description:
NavigationController搭配TabBarController常出現在各類型的App中。
此demo功能如下:

  • 畫面最底下提供三個 Tab 讓user切換到不同的 Activity
  • Home page提供一個按鈕可以跳轉到 Home2 page
  • Home2 page提供一個按鈕可以跳轉到 Home3 page
  • Home3 page提供一個按鈕可以跳回 Home page
  • Navigationbar 上有返回鍵,提供 Home3 -> Home2 -> Main 的返回功能。

Component:

  1. UITabBarController
  2. UINavigationController

Highlight function:

  1. 於AppDelegate.swift中didFinishLaunchingWithOptions()裡面新增TabBarController,裡面包含三個畫面(Home、Dashboard、Notify)。方法如下:
let tabbarcntrl = UITabBarController()
tabbarcntrl.viewControllers = [nvHome, dashboardVC, notifyVC]
let tabHome = tabbarcntrl.tabBar.items![0]
let tabDashboard = tabbarcntrl.tabBar.items![1]
let tabNotify = tabbarcntrl.tabBar.items![2]
  1. 在於HomePageVC加入NavigationController:
let nvHome = UINavigationController(rootViewController: homeVC)
  1. 因TabBarController本身就有畫面跳轉的功能不需實作,但NavigationController畫面切換則需開發者自行完成,方法如下:
navigationController!.pushViewController(SomeViewController, animated: true)

Additional:
UITabBarController是以array的方式來儲存,最多可以放五個圖示,超過的話最右邊的會變成一個More的圖示,按下後會列出來後續可前往的頁面。
TabBarController可以透過本身的member variable來指定起始頁面為哪個畫面:

TabBar.selectedIndex = 0

Reference:
Source code on Github


上一篇
Delegate and Datasource in class
下一篇
iOS App實作(6) WebSearch(WebView)
系列文
30天Swift入門學習30

尚未有邦友留言

立即登入留言