5. UINavigationController
• Stack of view controllers
• Navigation bar
Navigation
Controller
Thursday, January 28, 2010 5
6. UINavigationController
• Stack of view controllers
• Navigation bar
View Controller
Navigation View Controller
Controller
View Controller
Thursday, January 28, 2010 5
7. How It Fits Together
Thursday, January 28, 2010 6
8. How It Fits Together
• Top view controller’s view
Thursday, January 28, 2010 6
9. How It Fits Together
• Top view controller’s view
• Top view controller’s title
Thursday, January 28, 2010 6
10. How It Fits Together
• Top view controller’s view
• Top view controller’s title
• Previous view controller’s title
Thursday, January 28, 2010 6
11. How It Fits Together
• Top view controller’s view
• Top view controller’s title
• Previous view controller’s title
• Top view controller’s toolbar
items (iPhone OS 3.0)
Thursday, January 28, 2010 6
13. Modifying the Navigation Stack
• Push to add a view controller
- (void)pushViewController:(UIViewController *)viewController
animated:(BOOL)animated;
Thursday, January 28, 2010 7
14. Modifying the Navigation Stack
• Push to add a view controller
- (void)pushViewController:(UIViewController *)viewController
animated:(BOOL)animated;
• Pop to remove a view controller
- (UIViewController *)popViewControllerAnimated:(BOOL)animated;
Thursday, January 28, 2010 7
15. Modifying the Navigation Stack
• Push to add a view controller
- (void)pushViewController:(UIViewController *)viewController
animated:(BOOL)animated;
• Pop to remove a view controller
- (UIViewController *)popViewControllerAnimated:(BOOL)animated;
• Set to change the entire stack of view controllers
(iPhone OS 3.0)
- (void)setViewControllers:(NSArray *)viewControllers
animated:(BOOL)animated;
Thursday, January 28, 2010 7
17. Pushing Your First View Controller
- (void)applicationDidFinishLaunching
// Create a navigation controller
navController = [[UINavigationController alloc] init];
}
Thursday, January 28, 2010 8
18. Pushing Your First View Controller
- (void)applicationDidFinishLaunching
// Create a navigation controller
navController = [[UINavigationController alloc] init];
// Push the first view controller on the stack
[navController pushViewController:firstViewController
animated:NO];
}
Thursday, January 28, 2010 8
19. Pushing Your First View Controller
- (void)applicationDidFinishLaunching
// Create a navigation controller
navController = [[UINavigationController alloc] init];
// Push the first view controller on the stack
[navController pushViewController:firstViewController
animated:NO];
// Add the navigation controller’s view to the window
[window addSubview:navController.view];
}
Thursday, January 28, 2010 8
20. In Response to User Actions
Thursday, January 28, 2010 9
21. In Response to User Actions
• Push from within a view controller on the stack
- (void)someAction:(id)sender
{
// Potentially create another view controller
UIViewController *viewController = ...;
[self.navigationController pushViewController:viewController
animated:YES];
}
Thursday, January 28, 2010 9
22. In Response to User Actions
• Push from within a view controller on the stack
- (void)someAction:(id)sender
{
// Potentially create another view controller
UIViewController *viewController = ...;
[self.navigationController pushViewController:viewController
animated:YES];
}
• Almost never call pop directly!
■ Automatically invoked by the back button
Thursday, January 28, 2010 9
23. Demo:
Pushing & Popping
Thursday, January 28, 2010 10
28. Connecting View Controllers
• Multiple view controllers may need to share data
Thursday, January 28, 2010 14
29. Connecting View Controllers
• Multiple view controllers may need to share data
• One may need to know about what another is doing
■ Watch for added, removed or edited data
■ Other interesting events
Thursday, January 28, 2010 14
30. How Not To Share Data
• Global variables or singletons
■ This includes your application delegate!
• Direct dependencies make your code less reusable
■ And more difficult to debug & test
List Detail
Controller Controller
Thursday, January 28, 2010 15
31. How Not To Share Data
• Global variables or singletons
■ This includes your application delegate!
• Direct dependencies make your code less reusable
■ And more difficult to debug & test
List Detail
Controller Controller
Application
Delegate
Thursday, January 28, 2010 15
32. How Not To Share Data
• Global variables or singletons
■ This includes your application delegate!
• Direct dependencies make your code less reusable
■ And more difficult to debug & test
List Detail
Controller Controller
Don’t Do This!
Application
Delegate
Thursday, January 28, 2010 15
33. Best Practices for Data Flow
• Figure out exactly what needs to be communicated
List Detail
Controller Controller
Thursday, January 28, 2010 16
34. Best Practices for Data Flow
• Figure out exactly what needs to be communicated
• Define input parameters for your view controller
List Detail
Controller Controller
Thursday, January 28, 2010 16
35. Best Practices for Data Flow
• Figure out exactly what needs to be communicated
• Define input parameters for your view controller
Data
List Detail
Controller Controller
Thursday, January 28, 2010 16
36. Best Practices for Data Flow
• Figure out exactly what needs to be communicated
• Define input parameters for your view controller
• For communicating back up the hierarchy, use loose coupling
■ Define a generic interface for observers (like delegation)
List Detail
Controller Controller
Thursday, January 28, 2010 16
37. Best Practices for Data Flow
• Figure out exactly what needs to be communicated
• Define input parameters for your view controller
• For communicating back up the hierarchy, use loose coupling
■ Define a generic interface for observers (like delegation)
List Detail
Controller Controller
I care!
Thursday, January 28, 2010 16
38. Best Practices for Data Flow
• Figure out exactly what needs to be communicated
• Define input parameters for your view controller
• For communicating back up the hierarchy, use loose coupling
■ Define a generic interface for observers (like delegation)
List Detail
Controller Controller
Thursday, January 28, 2010 16
39. Example:
UIImagePickerController
Thursday, January 28, 2010 17
40. Demo:
Passing Data Along
Thursday, January 28, 2010 18
42. Customizing Navigation
• Buttons or custom controls
• Interact with the entire screen
Thursday, January 28, 2010 20
43. Customizing Navigation
• Buttons or custom controls
• Interact with the entire screen
Thursday, January 28, 2010 20
44. UINavigationItem
• Describes appearance of the navigation bar
■ Title string or custom title view
■ Left & right bar buttons
■ More properties defined in UINavigationBar.h
Thursday, January 28, 2010 21
45. UINavigationItem
• Describes appearance of the navigation bar
■ Title string or custom title view
■ Left & right bar buttons
■ More properties defined in UINavigationBar.h
• Every view controller has a navigation item for customizing
■ Displayed when view controller is on top of the stack
Thursday, January 28, 2010 21
46. Navigation Item Ownership
Left Bar
Button Item
View Controller Navigation Item Title View
Right Bar
Button Item
Thursday, January 28, 2010 22
47. Displaying a Title
• UIViewController already has a title property
■ @property(nonatomic,copy) NSString *title;
• Navigation item inherits automatically
■ Previous view controller’s title is displayed in back button
Thursday, January 28, 2010 23
48. Displaying a Title
• UIViewController already has a title property
■ @property(nonatomic,copy) NSString *title;
• Navigation item inherits automatically
■ Previous view controller’s title is displayed in back button
viewController.title = @“Detail”;
Thursday, January 28, 2010 23
49. Left & Right Buttons
• UIBarButtonItem
■ Special object, defines appearance & behavior for items in
navigation bars and toolbars
• Display a string, image or predefined system item
• Target + action (like a regular button)
Thursday, January 28, 2010 24
55. System Bar Button Item
- (void)viewDidLoad
{
UIBarButtonItem *addButton = [[UIBarButtonItem alloc]
initWithBarButtonSystemItem:UIBarButtonSystemItemAdd
style:UIBarButtonItemStyleBordered
target:self
action:@selector(add:)];
self.navigationItem.rightBarButtonItem = addButton;
[addButton release];
}
Thursday, January 28, 2010 26
56. Edit/Done Button
• Very common pattern
• Every view controller has one available
■ Target/action already set up
Thursday, January 28, 2010 27
57. Edit/Done Button
• Very common pattern
• Every view controller has one available
■ Target/action already set up
Thursday, January 28, 2010 27
58. Edit/Done Button
• Very common pattern
• Every view controller has one available
■ Target/action already set up
self.navigationItem.leftBarButtonItem = self.editButtonItem;
Thursday, January 28, 2010 27
59. Edit/Done Button
• Very common pattern
• Every view controller has one available
■ Target/action already set up
self.navigationItem.leftBarButtonItem = self.editButtonItem;
// Called when the user toggles the edit/done button
- (void)setEditing:(BOOL)editing animated:(BOOL)animated
{
// Update appearance of views
}
Thursday, January 28, 2010 27
60. Custom Title View
• Arbitrary view in place of the title
Thursday, January 28, 2010 28
61. Custom Title View
• Arbitrary view in place of the title
Thursday, January 28, 2010 28
62. Custom Title View
• Arbitrary view in place of the title
UISegmentedControl *segmentedControl = ...
self.navigationItem.titleView = segmentedControl;
[segmentedControl release];
Thursday, January 28, 2010 28
63. Back Button
• Sometimes a shorter back button is needed
Thursday, January 28, 2010 29
64. Back Button
• Sometimes a shorter back button is needed
Thursday, January 28, 2010 29
65. Back Button
• Sometimes a shorter back button is needed
self.title = @“Hello there, CS193P!”;
Thursday, January 28, 2010 29
66. Back Button
• Sometimes a shorter back button is needed
self.title = @“Hello there, CS193P!”;
UIBarButtonItem *heyButton = [[UIBarButtonItem alloc]
initWithTitle:@“Hey!”
...];
self.navigationItem.backButtonItem = heyButton;
[heyButton release];
Thursday, January 28, 2010 29
67. Back Button
• Sometimes a shorter back button is needed
self.title = @“Hello there, CS193P!”;
UIBarButtonItem *heyButton = [[UIBarButtonItem alloc]
initWithTitle:@“Hey!”
...];
self.navigationItem.backButtonItem = heyButton;
[heyButton release];
Thursday, January 28, 2010 29
68. Demo:
Customizing Buttons
Thursday, January 28, 2010 30
70. UITabBarController
• Array of view controllers
• Tab bar
Tab Bar
Controller
Thursday, January 28, 2010 32
71. UITabBarController
• Array of view controllers
• Tab bar
View Controller
Tab Bar
Controller View Controller
View Controller
Thursday, January 28, 2010 32
72. How It Fits Together
Thursday, January 28, 2010 33
73. How It Fits Together
• Selected view controller’s view
Thursday, January 28, 2010 33
74. How It Fits Together
• Selected view controller’s view
• All view controllers’ titles
Thursday, January 28, 2010 33
75. Setting Up a Tab Bar Controller
Thursday, January 28, 2010 34
76. Setting Up a Tab Bar Controller
- (void)applicationDidFinishLaunching
// Create a tab bar controller
tabBarController = [[UITabBarController alloc] init];
}
Thursday, January 28, 2010 34
77. Setting Up a Tab Bar Controller
- (void)applicationDidFinishLaunching
// Create a tab bar controller
tabBarController = [[UITabBarController alloc] init];
// Set the array of view controllers
tabBarController.viewControllers = myViewControllers;
}
Thursday, January 28, 2010 34
78. Setting Up a Tab Bar Controller
- (void)applicationDidFinishLaunching
// Create a tab bar controller
tabBarController = [[UITabBarController alloc] init];
// Set the array of view controllers
tabBarController.viewControllers = myViewControllers;
// Add the tab bar controller’s view to the window
[window addSubview:tabBarController.view];
}
Thursday, January 28, 2010 34
79. Tab Bar Appearance
• View controllers can define their appearance in the tab bar
Thursday, January 28, 2010 35
80. Tab Bar Appearance
• View controllers can define their appearance in the tab bar
• UITabBarItem
■ Title + image or system item
Thursday, January 28, 2010 35
81. Tab Bar Appearance
• View controllers can define their appearance in the tab bar
• UITabBarItem
■ Title + image or system item
• Each view controller comes with a tab bar item for customizing
Thursday, January 28, 2010 35
82. Creating Tab Bar Items
• Title and image
Thursday, January 28, 2010 36
83. Creating Tab Bar Items
• Title and image
Thursday, January 28, 2010 36
84. Creating Tab Bar Items
• Title and image
- (void)viewDidLoad
{
UITabBarItem *item = [[UITabBarItem alloc]
initWithTitle:@“Playlists”
image:[UIImage imageNamed:@“music.png”]
tag:0];
self.tabBarItem = item;
[item release];
}
Thursday, January 28, 2010 36
85. Creating Tab Bar Items
• System item
Thursday, January 28, 2010 37
86. Creating Tab Bar Items
• System item
Thursday, January 28, 2010 37
87. Creating Tab Bar Items
• System item
- (void)viewDidLoad
{
UITabBarItem *item = [[UITabBarItem alloc]
initWithTabBarSystemItem:
UITabBarSystemItemBookmarks
tag:0]
self.tabBarItem = item;
[item release];
}
Thursday, January 28, 2010 37
88. Demo:
Using a Tab Bar Controller
Thursday, January 28, 2010 38
89. More View Controllers
• What happens when a tab bar controller has too many
view controllers to display at once?
Thursday, January 28, 2010 39
90. More View Controllers
• What happens when a tab bar controller has too many
view controllers to display at once?
■ “More” tab bar item
displayed automatically
Thursday, January 28, 2010 39
91. More View Controllers
• What happens when a tab bar controller has too many
view controllers to display at once?
■ “More” tab bar item
displayed automatically
■ User can navigate to
remaining view controllers
Thursday, January 28, 2010 39
92. More View Controllers
• What happens when a tab bar controller has too many
view controllers to display at once?
■ “More” tab bar item
displayed automatically
■ User can navigate to
remaining view controllers
■ Customize order
Thursday, January 28, 2010 39