Navigation and Segues

Size: px

Start display at page:

Download "Navigation and Segues"

Arleen Lee
5 years ago
Views:

1 Navigation and Segues Mobile Application Development in ios School of EECS Washington State University Instructor: Larry Holder Mobile Application Development in ios 1

2 Outline Multiple views Segues Navigation Controller Application templates Master-detail (Split View Controller) Page-based (Page View Controller) Tabbed (Tab Bar Controller) Mobile Application Development in ios 2

3 Multiple Views Mobile Application Development in ios 3

4 Multiple Views 1. File à New à File 2. Rename Class & Subclass Mobile Application Development in ios 4

5 Multiple Views 3. Add View Controller to Storyboard Drag & drop Mobile Application Development in ios 5

6 Multiple Views 4. Change View Controller s Class 5. (Optional, but recommended) Change View Controller s Title Mobile Application Development in ios 6

7 Segues Transition from one view to another Adaptive: Transition type depends on device/context Show (Push) Show Detail (Replace) Present Modally Present As Popover Custom Ctrl-drag Creates and adds new view instance to navigation stack Mobile Application Development in ios 7

$@IBAction func secretpassagetapped (_ sender: UIButton) { performsegue(withidentifier: "secretpassage", sender: nil) // sender could also be the button (sender) or self }$

8 Programmatic Segues 1. Segue from View Controller to View Controller. 2. Give segue an identifier. Ctrl-drag 3. Use performsegue to func secretpassagetapped (_ sender: UIButton) { performsegue(withidentifier: "secretpassage", sender: nil) // sender could also be the button (sender) or self } Mobile Application Development in ios 8

9 Preparing for Segue Perform tasks before destination view loaded Destination view class instance already initialized Usually for passing data to destination view override func prepare(for segue: UIStoryboardSegue, sender: Any?) { if (segue.identifier == "firsttosecond") { let secondvc = segue.destination as! SecondViewController secondvc.firstviewtext = "Hello from first view" } } Warnings Destination view elements not initialized Each segue creates new destination view instance Mobile Application Development in ios 9

10 Unwinding from Segue Perform tasks as you pop view off navigation stack Returns to previous instance of destination view Data intact 1. In FirstViewController, func taking UIStoryboardSegue func unwindfromsecondview (sender: UIStoryboardSegue) { let secondvc = sender.source as! SecondViewController let secondviewtext = secondvc.secondviewtext print("second View Text: \(secondviewtext)") } Mobile Application Development in ios 10

11 2. Ctrl-drag from button to Exit. Select unwind func just created. Unwind Segue Mobile Application Development in ios 11

$Perform segue @IBAction func unwindtofirstviewtapped(_ sender: UIButton) { performsegue(withidentifier: "unwindsegue",$

12 Unwind Segue Programmatically 1. Create unwind segue 2. Identify segue 3. Perform func unwindtofirstviewtapped(_ sender: UIButton) { performsegue(withidentifier: "unwindsegue", sender: self) } Mobile Application Development in ios 12

13 Navigation Controller: Method 1 Select View Controller Editor -> Embed In -> Navigation Controller Mobile Application Development in ios 13

14 Navigation Controller: Method 2 Add Navigation Controller to empty Storyboard Includes TableView Controller (but can replace) Mobile Application Development in ios 14

15 Navigation Controller Set Title and Prompt navigationitem.title = "Page 1" navigationitem.prompt = "Nav Demo" Mobile Application Development in ios 15

16 Navigation Controller Add bar buttons using Storyboard Mobile Application Development in ios 16

17 Navigation Controller Pass data forward by using prepareforsegue var page1data: Int = 1 override func prepare(for segue: UIStoryboardSegue, sender: Any?) { if (segue.identifier == "page1topage2") { let page2vc = segue.destination as! PageTwoViewController page2vc.page2data = self.page1data } } Pass data back by accessing navigation view controllers var page2data: Int = 2 let page1vc = self.navigationcontroller?.viewcontrollers[0] // first view as! PageOneViewController page1vc.page1data = self.page2data Mobile Application Development in ios 17

18 Navigation Controller Add bar buttons programmatically // In viewdidload() let leftbarbutton = UIBarButtonItem(barButtonSystemItem:.save, target: self, action: #selector(savedata)) let rightbarbutton = UIBarButtonItem(barButtonSystemItem:.cancel, target: self, action: #selector(canceldata)) self.navigationitem.leftbarbuttonitem = leftbarbutton self.navigationitem.rightbarbuttonitem = func savedata () { // Update local variables performsegue(withidentifier:"unwindfrompagetwo", sender:self) func canceldata () { self.navigationcontroller?.popviewcontroller(animated:true) } Mobile Application Development in ios 18

19 Navigation Controller Pass data back using unwind segue on your own button // In func unwindfrompagetwo (sender: UIStoryboardSegue) { let page2vc = sender.source as! PageTwoViewController let page2data = page2vc.page2data } Mobile Application Development in ios 19

20 ios Navigation Templates Mobile Application Development in ios 20

21 Master-Detail Navigation Mobile Application Development in ios 21

22 Page-Based Navigation Mobile Application Development in ios 22

23 Tabbed Navigation Mobile Application Development in ios 23

24 Resources Segues developer.apple.com/library/content/featuredarticles /ViewControllerPGforiPhoneOS/UsingSegues.html Navigation Controller developer.apple.com/documentation/uikit/uinavigatio ncontroller Mobile Application Development in ios 24

App. Chapter 19 App. App (ViewController) App. Single View Application Single View Application View. (View Controller)

App. Chapter 19 App. App (ViewController) App. Single View Application Single View Application View. (View Controller) Chapter 19 App App (ViewController) App 19.1 App App Single View Application Single View Application View Controller View Controller Label Button Button (View Controller) 2 View Controller Utility Area