Your SlideShare is downloading. ×
08 table views
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

08 table views

675
views

Published on

slide 8 in iphone programming course (stanford university)

slide 8 in iphone programming course (stanford university)

Published in: Technology, News & Politics

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
675
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
21
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. CS193P - Lecture 8 iPhone Application Development Scroll Views & Table ViewsSaturday, January 30, 2010 1
  • 2. Saturday, January 30, 2010 2
  • 3. iPhone SDK 3.2Saturday, January 30, 2010 3
  • 4. iPhone SDK 3.2 • Support for iPadSaturday, January 30, 2010 3
  • 5. iPhone SDK 3.2 • Support for iPad • Beta ReleaseSaturday, January 30, 2010 3
  • 6. iPhone SDK 3.2 • Support for iPad • Beta Release Enrollment in iPhone Developer Standard or Enterprise requiredSaturday, January 30, 2010 3
  • 7. Announcements • Paparazzi 1 due next Wednesday (2/3)Saturday, January 30, 2010 4
  • 8. Today’s Topics • Scroll views • Table views ■ Displaying data ■ Controlling appearance & behavior • UITableViewController • Table view cellsSaturday, January 30, 2010 5
  • 9. Scroll ViewsSaturday, January 30, 2010 6
  • 10. UIScrollView • For displaying more content than can fit on the screenSaturday, January 30, 2010 7
  • 11. UIScrollView • For displaying more content than can fit on the screen • Handles gestures for panning and zoomingSaturday, January 30, 2010 7
  • 12. UIScrollView • For displaying more content than can fit on the screen • Handles gestures for panning and zooming • Noteworthy subclasses: UITableView and UITextViewSaturday, January 30, 2010 7
  • 13. Scrolling ExamplesSaturday, January 30, 2010 8
  • 14. Scrolling ExamplesSaturday, January 30, 2010 8
  • 15. Scrolling ExamplesSaturday, January 30, 2010 8
  • 16. Scrolling ExamplesSaturday, January 30, 2010 8
  • 17. Scrolling ExamplesSaturday, January 30, 2010 8
  • 18. Scrolling ExamplesSaturday, January 30, 2010 8
  • 19. Content SizeSaturday, January 30, 2010 9
  • 20. Content Size contentSize.width contentSize.heightSaturday, January 30, 2010 9
  • 21. Content Inset contentSize.width contentInset.top contentSize.height contentInset.bottomSaturday, January 30, 2010 10
  • 22. Content InsetSaturday, January 30, 2010 11
  • 23. Content InsetSaturday, January 30, 2010 11
  • 24. Content InsetSaturday, January 30, 2010 12
  • 25. Content Inset contentInset.topSaturday, January 30, 2010 12
  • 26. Content Inset contentInset.topSaturday, January 30, 2010 13
  • 27. Content Inset contentInset.top contentInset.bottomSaturday, January 30, 2010 13
  • 28. Scroll Indicator InsetsSaturday, January 30, 2010 14
  • 29. Scroll Indicator InsetsSaturday, January 30, 2010 14
  • 30. Scroll Indicator InsetsSaturday, January 30, 2010 14
  • 31. Scroll Indicator Insets scrollIndicatorInsets.topSaturday, January 30, 2010 14
  • 32. Content OffsetSaturday, January 30, 2010 15
  • 33. Content OffsetSaturday, January 30, 2010 15
  • 34. Content OffsetSaturday, January 30, 2010 15
  • 35. contentSize.width contentInset.top contentSize.height contentInset.bottom contentInset.left contentInset.rightSaturday, January 30, 2010 16
  • 36. Saturday, January 30, 2010 17
  • 37. contentOffset.x contentOffset.ySaturday, January 30, 2010 17
  • 38. Saturday, January 30, 2010 18
  • 39. Saturday, January 30, 2010 18
  • 40. contentOffset.x (-contentInset.left) contentOffset.y (-contentInset.top)Saturday, January 30, 2010 18
  • 41. Using a Scroll ViewSaturday, January 30, 2010 19
  • 42. Using a Scroll View • Create with the desired frame CGRect frame = CGRectMake(0, 0, 200, 200); scrollView = [[UIScrollView alloc] initWithFrame:frame];Saturday, January 30, 2010 19
  • 43. Using a Scroll View • Create with the desired frame CGRect frame = CGRectMake(0, 0, 200, 200); scrollView = [[UIScrollView alloc] initWithFrame:frame]; • Add subviews (frames may extend beyond scroll view bounds) frame = CGRectMake(0, 0, 500, 500); myImageView = [[UIImageView alloc] initWithFrame:frame]; [scrollView addSubview:myImageView];Saturday, January 30, 2010 19
  • 44. Using a Scroll View • Create with the desired frame CGRect frame = CGRectMake(0, 0, 200, 200); scrollView = [[UIScrollView alloc] initWithFrame:frame]; • Add subviews (frames may extend beyond scroll view bounds) frame = CGRectMake(0, 0, 500, 500); myImageView = [[UIImageView alloc] initWithFrame:frame]; [scrollView addSubview:myImageView]; • Set the content size scrollView.contentSize = CGSizeMake(500, 500);Saturday, January 30, 2010 19
  • 45. Extending Scroll View Behavior • Applications often want to know about scroll eventsSaturday, January 30, 2010 20
  • 46. Extending Scroll View Behavior • Applications often want to know about scroll events ■ When the scroll offset is changedSaturday, January 30, 2010 20
  • 47. Extending Scroll View Behavior • Applications often want to know about scroll events ■ When the scroll offset is changed ■ When dragging begins & endsSaturday, January 30, 2010 20
  • 48. Extending Scroll View Behavior • Applications often want to know about scroll events ■ When the scroll offset is changed ■ When dragging begins & ends ■ When deceleration begins & endsSaturday, January 30, 2010 20
  • 49. Extending with a Subclass • Create a subclass • Override methods to customize behaviorSaturday, January 30, 2010 21
  • 50. Extending with a Subclass • Create a subclass • Override methods to customize behavior • Issues with this approachSaturday, January 30, 2010 21
  • 51. Extending with a Subclass • Create a subclass • Override methods to customize behavior • Issues with this approach ■ Application logic and behavior is now part of a View classSaturday, January 30, 2010 21
  • 52. Extending with a Subclass • Create a subclass • Override methods to customize behavior • Issues with this approach ■ Application logic and behavior is now part of a View class ■ Tedious to write a one-off subclass for every scroll view instanceSaturday, January 30, 2010 21
  • 53. Extending with a Subclass • Create a subclass • Override methods to customize behavior • Issues with this approach ■ Application logic and behavior is now part of a View class ■ Tedious to write a one-off subclass for every scroll view instance ■ Your code becomes tightly coupled with superclassSaturday, January 30, 2010 21
  • 54. Extending with Delegation • Delegate is a separate object • Clearly defined points of responsibility ■ Change behavior ■ Customize appearance • Loosely coupled with the object being extendedSaturday, January 30, 2010 22
  • 55. UIScrollView DelegateSaturday, January 30, 2010 23
  • 56. UIScrollView Delegate @protocol UIScrollViewDelegate<NSObject>Saturday, January 30, 2010 23
  • 57. UIScrollView Delegate @protocol UIScrollViewDelegate<NSObject> @optionalSaturday, January 30, 2010 23
  • 58. UIScrollView Delegate @protocol UIScrollViewDelegate<NSObject> @optional // Respond to interesting events - (void)scrollViewDidScroll:(UIScrollView *)scrollView;Saturday, January 30, 2010 23
  • 59. UIScrollView Delegate @protocol UIScrollViewDelegate<NSObject> @optional // Respond to interesting events - (void)scrollViewDidScroll:(UIScrollView *)scrollView; ... // Influence behavior - (BOOL)scrollViewShouldScrollToTop:(UIScrollView *)scrollView; @endSaturday, January 30, 2010 23
  • 60. Implementing a DelegateSaturday, January 30, 2010 24
  • 61. Implementing a Delegate • Conform to the delegate protocol @interface MyController : NSObject <UIScrollViewDelegate>Saturday, January 30, 2010 24
  • 62. Implementing a Delegate • Conform to the delegate protocol @interface MyController : NSObject <UIScrollViewDelegate> • Implement all required methods and any optional methods - (void)scrollViewDidScroll:(UIScrollView *)scrollView { // Do something in response to the new scroll position if (scrollView.contentOffset ...) { } }Saturday, January 30, 2010 24
  • 63. Zooming with a Scroll ViewSaturday, January 30, 2010 25
  • 64. Zooming with a Scroll View • Set the minimum, maximum, initial zoom scales scrollView.maximumZoomScale = 2.0; scrollView.minimumZoomScale = scrollView.size.width / myImage.size.width;Saturday, January 30, 2010 25
  • 65. Zooming with a Scroll View • Set the minimum, maximum, initial zoom scales scrollView.maximumZoomScale = 2.0; scrollView.minimumZoomScale = scrollView.size.width / myImage.size.width; • Implement delegate method for zooming - (UIView *)viewForZoomingInScrollView:(UIView *)view { return someViewThatWillBeScaled; }Saturday, January 30, 2010 25
  • 66. Set Zoom Scale - (void)setZoomScale:(float)scale animated:(BOOL);Saturday, January 30, 2010 26
  • 67. Set Zoom Scale - (void)setZoomScale:(float)scale animated:(BOOL);Saturday, January 30, 2010 26
  • 68. Set Zoom Scale - (void)setZoomScale:(float)scale animated:(BOOL);Saturday, January 30, 2010 26
  • 69. Zoom to Rect - (void)zoomToRect:(CGRect)rect animated:(BOOL);Saturday, January 30, 2010 27
  • 70. Zoom to Rect - (void)zoomToRect:(CGRect)rect animated:(BOOL);Saturday, January 30, 2010 27
  • 71. Zoom to Rect - (void)zoomToRect:(CGRect)rect animated:(BOOL);Saturday, January 30, 2010 27
  • 72. Zoom to Rect - (void)zoomToRect:(CGRect)rect animated:(BOOL);Saturday, January 30, 2010 28
  • 73. Zoom to Rect - (void)zoomToRect:(CGRect)rect animated:(BOOL);Saturday, January 30, 2010 28
  • 74. Zoom to Rect - (void)zoomToRect:(CGRect)rect animated:(BOOL);Saturday, January 30, 2010 28
  • 75. DemoSaturday, January 30, 2010 29
  • 76. Table ViewsSaturday, January 30, 2010 30
  • 77. Table Views • Display lists of content ■ Single column, multiple rows ■ Vertical scrolling ■ Large data sets • Powerful and ubiquitous in iPhone applicationsSaturday, January 30, 2010 31
  • 78. Table View StylesSaturday, January 30, 2010 32
  • 79. Table View Styles UITableViewStylePlainSaturday, January 30, 2010 32
  • 80. Table View Styles UITableViewStylePlain UITableViewStyleGroupedSaturday, January 30, 2010 32
  • 81. Table View Anatomy Plain StyleSaturday, January 30, 2010 33
  • 82. Table View Anatomy Plain Style Table HeaderSaturday, January 30, 2010 33
  • 83. Table View Anatomy Plain Style Table Header Table FooterSaturday, January 30, 2010 33
  • 84. Table View Anatomy Plain Style Table Header Section Table FooterSaturday, January 30, 2010 33
  • 85. Table View Anatomy Plain Style Table Header Section Header Section Table FooterSaturday, January 30, 2010 33
  • 86. Table View Anatomy Plain Style Table Header Section Header Section Footer Section Table FooterSaturday, January 30, 2010 33
  • 87. Table View Anatomy Plain Style Table Header Section Header Table Cell Section Footer Section Table FooterSaturday, January 30, 2010 33
  • 88. Table View Anatomy Plain Style Table Header Section Header Table Cell Section Footer Section Table FooterSaturday, January 30, 2010 34
  • 89. Table View Anatomy Grouped Style Table Header Section Header Table Cell Section Footer Section Table FooterSaturday, January 30, 2010 35
  • 90. Using Table Views • Displaying your data in the table view • Customizing appearance & behaviorSaturday, January 30, 2010 36
  • 91. Displaying Data in a Table ViewSaturday, January 30, 2010 37
  • 92. A Naïve SolutionSaturday, January 30, 2010 38
  • 93. A Naïve Solution • Table views display a list of data, so use an array [myTableView setList:myListOfStuff];Saturday, January 30, 2010 38
  • 94. A Naïve Solution • Table views display a list of data, so use an array [myTableView setList:myListOfStuff]; • Issues with this approachSaturday, January 30, 2010 38
  • 95. A Naïve Solution • Table views display a list of data, so use an array [myTableView setList:myListOfStuff]; • Issues with this approach ■ All data is loaded upfrontSaturday, January 30, 2010 38
  • 96. A Naïve Solution • Table views display a list of data, so use an array [myTableView setList:myListOfStuff]; • Issues with this approach ■ All data is loaded upfront ■ All data stays in memorySaturday, January 30, 2010 38
  • 97. A More Flexible Solution • Another object provides data to the table view ■ Not all at once ■ Just as it’s needed for display • Like a delegate, but purely data-orientedSaturday, January 30, 2010 39
  • 98. UITableViewDataSourceSaturday, January 30, 2010 40
  • 99. UITableViewDataSource • Provide number of sections and rows // Optional method, defaults to 1 if not implemented - (NSInteger)numberOfSectionsInTableView:(UITableView *)table; // Required method - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;Saturday, January 30, 2010 40
  • 100. UITableViewDataSource • Provide number of sections and rows // Optional method, defaults to 1 if not implemented - (NSInteger)numberOfSectionsInTableView:(UITableView *)table; // Required method - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section; • Provide cells for table view as needed // Required method - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;Saturday, January 30, 2010 40
  • 101. Datasource Message Flow DatasourceSaturday, January 30, 2010 41
  • 102. Datasource Message Flow numberOfSectionsInTableView: How many sections? DatasourceSaturday, January 30, 2010 41
  • 103. Datasource Message Flow numberOfSectionsInTableView: Datasource 5Saturday, January 30, 2010 41
  • 104. Datasource Message Flow DatasourceSaturday, January 30, 2010 42
  • 105. Datasource Message Flow tableView:numberOfRowsInSection: How many rows in section 0? DatasourceSaturday, January 30, 2010 42
  • 106. Datasource Message Flow tableView:numberOfRowsInSection: Datasource 1Saturday, January 30, 2010 42
  • 107. Datasource Message Flow DatasourceSaturday, January 30, 2010 43
  • 108. Datasource Message Flow tableView:cellForRowAtIndexPath: What to display at section 0, row 0? DatasourceSaturday, January 30, 2010 43
  • 109. Datasource Message Flow tableView:cellForRowAtIndexPath: Datasource Cell with text “John Appleseed”Saturday, January 30, 2010 43
  • 110. NSIndexPath • Generic class in Foundation • Path to a specific node in a tree of nested arrays 0 1 2 3 4Saturday, January 30, 2010 44
  • 111. NSIndexPath • Generic class in Foundation • Path to a specific node in a tree of nested arrays 0 0 0 0 1 1 1 1 2 2 2 2 3 3 3 3 4 4 4 4Saturday, January 30, 2010 44
  • 112. NSIndexPath and Table Views • Cell location described with an index path ■ Section index + row indexSaturday, January 30, 2010 45
  • 113. NSIndexPath and Table Views • Cell location described with an index path ■ Section index + row index • Category on NSIndexPath with helper methods @interface NSIndexPath (UITableView) + (NSIndexPath *)indexPathForRow:(NSUInteger)row inSection:(NSUInteger)section; @property(nonatomic,readonly) NSUInteger section; @property(nonatomic,readonly) NSUInteger row; @endSaturday, January 30, 2010 45
  • 114. Single Section Table ViewSaturday, January 30, 2010 46
  • 115. Single Section Table View • Return the number of rows - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return [myStrings count]; }Saturday, January 30, 2010 46
  • 116. Single Section Table View • Return the number of rows - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return [myStrings count]; } • Provide a cell when requested - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { UITableViewCell *cell = ...; cell.textLabel.text = [myStrings objectAtIndex:indexPath.row] return [cell autorelease]; }Saturday, January 30, 2010 46
  • 117. Cell ReuseSaturday, January 30, 2010 47
  • 118. Cell Reuse • When asked for a cell, it would be expensive to create a new cell each time.Saturday, January 30, 2010 47
  • 119. Cell Reuse • When asked for a cell, it would be expensive to create a new cell each time. - (UITableViewCell *)dequeueReusableCellWithIdentifier: (NSString *)identifier;Saturday, January 30, 2010 47
  • 120. Cell Reuse • When asked for a cell, it would be expensive to create a new cell each time. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@“MyIdentifier”]; if (cell == nil) { cell = [[[UITableViewCell alloc] initWithStyle:... reuseIdentifier:@“MyIdenifier”] autorelease]; } cell.text = [myStrings objectAtIndex:indexPath.row] return cell; }Saturday, January 30, 2010 47
  • 121. Triggering Updates • When is the datasource asked for its data?Saturday, January 30, 2010 48
  • 122. Triggering Updates • When is the datasource asked for its data? ■ When a row becomes visibleSaturday, January 30, 2010 48
  • 123. Triggering Updates • When is the datasource asked for its data? ■ When a row becomes visible ■ When an update is explicitly requested by calling -reloadData - (void)viewWillAppear:(BOOL)animated { [super viewWillAppear:animated]; [self.tableView reloadData]; }Saturday, January 30, 2010 48
  • 124. Section and Row ReloadingSaturday, January 30, 2010 49
  • 125. Section and Row Reloading - (void)insertSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation;Saturday, January 30, 2010 49
  • 126. Section and Row Reloading - (void)insertSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation;Saturday, January 30, 2010 49
  • 127. Section and Row Reloading - (void)insertSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)reloadSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation;Saturday, January 30, 2010 49
  • 128. Section and Row Reloading - (void)insertSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)reloadSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)insertRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation;Saturday, January 30, 2010 49
  • 129. Section and Row Reloading - (void)insertSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)reloadSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)insertRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation;Saturday, January 30, 2010 49
  • 130. Section and Row Reloading - (void)insertSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)reloadSections:(NSIndexSet *)sections withRowAnimation:(UITableViewRowAnimation)animation; - (void)insertRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation; - (void)deleteRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation; - (void)reloadRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation;Saturday, January 30, 2010 49
  • 131. Additional Datasource Methods • Titles for section headers and footers • Allow editing and reordering cellsSaturday, January 30, 2010 50
  • 132. Appearance & BehaviorSaturday, January 30, 2010 51
  • 133. UITableView Delegate • Customize appearance and behavior • Keep application logic separate from view • Often the same object as datasourceSaturday, January 30, 2010 52
  • 134. Table View Appearance & BehaviorSaturday, January 30, 2010 53
  • 135. Table View Appearance & Behavior • Customize appearance of table view cell - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath;Saturday, January 30, 2010 53
  • 136. Table View Appearance & Behavior • Customize appearance of table view cell - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath; • Validate and respond to selection changes - (NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath; - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath;Saturday, January 30, 2010 53
  • 137. Row Selection in Table Views • In iPhone applications, rows rarely stay selected • Selecting a row usually triggers an eventSaturday, January 30, 2010 54
  • 138. Row Selection in Table Views • In iPhone applications, rows rarely stay selected • Selecting a row usually triggers an eventSaturday, January 30, 2010 54
  • 139. Persistent SelectionSaturday, January 30, 2010 55
  • 140. Persistent SelectionSaturday, January 30, 2010 55
  • 141. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {Saturday, January 30, 2010 56
  • 142. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it representsSaturday, January 30, 2010 56
  • 143. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it represents NSUInteger row = indexPath.rowSaturday, January 30, 2010 56
  • 144. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it represents NSUInteger row = indexPath.row id objectToDisplay = [myObjects objectAtIndex:row];Saturday, January 30, 2010 56
  • 145. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it represents NSUInteger row = indexPath.row id objectToDisplay = [myObjects objectAtIndex:row]; // Create a new view controller and pass it alongSaturday, January 30, 2010 56
  • 146. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it represents NSUInteger row = indexPath.row id objectToDisplay = [myObjects objectAtIndex:row]; // Create a new view controller and pass it along MyViewController *myViewController = ...;Saturday, January 30, 2010 56
  • 147. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it represents NSUInteger row = indexPath.row id objectToDisplay = [myObjects objectAtIndex:row]; // Create a new view controller and pass it along MyViewController *myViewController = ...; myViewController.object = objectToDisplay;Saturday, January 30, 2010 56
  • 148. Responding to Selection // For a navigation hierarchy... - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Get the row and the object it represents NSUInteger row = indexPath.row id objectToDisplay = [myObjects objectAtIndex:row]; // Create a new view controller and pass it along MyViewController *myViewController = ...; myViewController.object = objectToDisplay; [self.navigationController pushViewController:myViewController animated:YES]; }Saturday, January 30, 2010 56
  • 149. Altering or Disabling Selection - (NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath { // Don’t allow selecting certain rows? if (indexPath.row == ...) { return nil; } else { return indexPath; } }Saturday, January 30, 2010 57
  • 150. UITableViewControllerSaturday, January 30, 2010 58
  • 151. UITableViewControllerSaturday, January 30, 2010 59
  • 152. UITableViewController • Convenient starting point for view controller with a table view ■ Table view is automatically created ■ Controller is table view’s delegate and datasourceSaturday, January 30, 2010 59
  • 153. UITableViewController • Convenient starting point for view controller with a table view ■ Table view is automatically created ■ Controller is table view’s delegate and datasource • Takes care of some default behaviors ■ Calls -reloadData the first time it appears ■ Deselects rows when user navigates back ■ Flashes scroll indicatorsSaturday, January 30, 2010 59
  • 154. Table View CellsSaturday, January 30, 2010 60
  • 155. Designated InitializerSaturday, January 30, 2010 61
  • 156. Designated Initializer - (id)initWithFrame:(CGRect)frame reuseIdentifier:(NSString *)reuseIdentifier;Saturday, January 30, 2010 61
  • 157. Designated Initializer ECATED EPR - (id)initWithFrame:(CGRect)frame DreuseIdentifier:(NSString *)reuseIdentifier; - (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier;Saturday, January 30, 2010 61
  • 158. Cell StylesSaturday, January 30, 2010 62
  • 159. Cell Styles UITableViewCellStyleDefaultSaturday, January 30, 2010 62
  • 160. Cell Styles UITableViewCellStyleDefault UITableViewCellStyleSubtitleSaturday, January 30, 2010 62
  • 161. Cell Styles UITableViewCellStyleDefault UITableViewCellStyleSubtitle UITableViewCellStyleValue1Saturday, January 30, 2010 62
  • 162. Cell Styles UITableViewCellStyleDefault UITableViewCellStyleSubtitle UITableViewCellStyleValue1 UITableViewCellStyleValue2Saturday, January 30, 2010 62
  • 163. Basic properties • UITableViewCell has an image view and one or two text labelsSaturday, January 30, 2010 63
  • 164. Basic properties • UITableViewCell has an image view and one or two text labels cell.imageView.image = [UIImage imageNamed:@“vitolidol.png”]; cell.textLabel.text = @“Vitol Idol”; cell.detailTextLabel.text = @“Billy Idol”;Saturday, January 30, 2010 63
  • 165. Accessory Types // UITableView delegate method - (UITableViewCellAccessoryType)tableView:(UITableView *)table accessoryTypeForRowWithIndexPath:(NSIndexPath *)indexPath;Saturday, January 30, 2010 64
  • 166. Accessory Types // UITableView delegate method - (UITableViewCellAccessoryType)tableView:(UITableView *)table accessoryTypeForRowWithIndexPath:(NSIndexPath *)indexPath; UITableViewCellAccessoryDisclosureIndicatorSaturday, January 30, 2010 64
  • 167. Accessory Types // UITableView delegate method - (UITableViewCellAccessoryType)tableView:(UITableView *)table accessoryTypeForRowWithIndexPath:(NSIndexPath *)indexPath; UITableViewCellAccessoryDisclosureIndicator UITableViewCellAccessoryDetailDisclosureButtonSaturday, January 30, 2010 64
  • 168. Accessory Types // UITableView delegate method - (UITableViewCellAccessoryType)tableView:(UITableView *)table accessoryTypeForRowWithIndexPath:(NSIndexPath *)indexPath; UITableViewCellAccessoryDisclosureIndicator UITableViewCellAccessoryDetailDisclosureButton - (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath { // Only for the blue disclosure button NSUInteger row = indexPath.row; ... }Saturday, January 30, 2010 64
  • 169. Accessory Types // UITableView delegate method - (UITableViewCellAccessoryType)tableView:(UITableView *)table accessoryTypeForRowWithIndexPath:(NSIndexPath *)indexPath; UITableViewCellAccessoryDisclosureIndicator UITableViewCellAccessoryDetailDisclosureButton UITableViewCellAccessoryCheckmark - (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath { // Only for the blue disclosure button NSUInteger row = indexPath.row; ... }Saturday, January 30, 2010 64
  • 170. Customizing the Content View • For cases where a simple image + text cell doesn’t suffice • UITableViewCell has a content view property ■ Add additional views to the content viewSaturday, January 30, 2010 65
  • 171. Customizing the Content View • For cases where a simple image + text cell doesn’t suffice • UITableViewCell has a content view property ■ Add additional views to the content view - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { UITableViewCell *cell = ...; CGRect frame = cell.contentView.bounds; UILabel *myLabel = [[UILabel alloc] initWithFrame:frame]; myLabel.text = ...; [cell.contentView addSubview:myLabel]; [myLabel release]; }Saturday, January 30, 2010 65
  • 172. Saturday, January 30, 2010 66
  • 173. Saturday, January 30, 2010 66
  • 174. Questions?Saturday, January 30, 2010 67

×