EEC-492/693/793 iPhone Application Development

1. EEC-492/693/793iPhone Application Development Lecture 10 Wenbing Zhao & Nigamanth Sridhar EEC492/693/793 - iPhone Application Development

2. Outline Objective-C Categories Introduction to table views UITableView and UITableViewCell Grouped and indexed sections Creating UI elements in Code UISearchBar and magnifying glass Assignments: Various table view apps (chapter 8) Continue building the calculator app 1/7/2020 2 EEC492/693/793 - iPhone Application Development EEC492/693/793 - iPhone Application Development

3. Category • How to add new behavior to an existing class? • Subclassing • Categories • Categories • You can add methods to any existing class • You can even override methods the class inherits • However, you cannot add instance variables to a class • Category method names must be unique across an application • When names collide, the category wins, i.e., your category method will completely replace the original method EEC492/693/793 - iPhone Application Development

4. How to Define a Category • How to define a category: • Example: adding deep copy to NSDictionary @interface ClassToAddMethodsTo (category) ...methods go here @end #import <Foundation/Foundation.h> @interface NSDictionary(MutableDeepCopy) - (NSMutableDictionary *)mutableDeepCopy; @end EEC492/693/793 - iPhone Application Development

5. Implementation and Use a Category #import "NSDictionary-MutableDeepCopy.h" @implementation NSDictionary (MutableDeepCopy) - (NSMutableDictionary *) mutableDeepCopy { NSMutableDictionary *ret = [[NSMutableDictionary alloc] initWithCapacity:[self count]]; NSArray *keys = [self allKeys]; for (id key in keys) { id oneValue = [self valueForKey:key]; id oneCopy = nil; if ([oneValue respondsToSelector:@selector(mutableDeepCopy)]) oneCopy = [oneValue mutableDeepCopy]; else if ([oneValue respondsToSelector:@selector(mutableCopy)]) oneCopy = [oneValue mutableCopy]; if (oneCopy == nil) oneCopy = [oneValue copy]; [ret setValue:oneCopy forKey:key]; } return ret; } @end EEC492/693/793 - iPhone Application Development

6. Fast Enumeration • for (id key in keys) // fast enumeration • It allows you to quickly iterate through a collection, such as NSArray, without the hassle of creating additional objects or loop variables EEC492/693/793 - iPhone Application Development

7. Other Uses of Categories • Splitting an implementation into multiple .m files. For example: • @interface NSWindow : NSResponder • @interface NSWindow(NSKeyboardUI) • @interface NSWindow(NSToolbarSupport) • @interface NSWindow(NSDrag) • @interface NSWindow(NSCarbonExtensions) • @interface NSObject(NSWindowDelegate) EEC492/693/793 - iPhone Application Development

8. Other Uses of Categories • Making forward references • Objective-C doesn’t have any truly private methods • If you know the method name, you can call it, even if there is no declaration for that method in the class’s @interface • However, doing so you would see a compiler warning:‘AClass’ may not respond to ‘-privateMethod:” • To avoid the warning, you can declare the private method as a category at the top of the implementation file EEC492/693/793 - iPhone Application Development

9. Table Views • Table views are the most common mechanism used to display lists of data to the user • Mail uses table views to show lists of accounts, folders, and messages • Table views are not limited to the display of textual data: YouTube, Settings, iPod apps, etc. EEC492/693/793 - iPhone Application Development

10. Table View Basics • Number of rows: no limit • Number of column: one! • Table view: UITableView • Each row: UITableViewCell EEC492/693/793 - iPhone Application Development

11. Table View Basics • Table views • Get their configuration data from an object that conforms to the UITableViewDelegate protocol • Get their row data from an object that conforms to the UITableViewDataSource protocol • … Similar to Pickers! • What can be put in a UITableViewCell? • An image, some text, and an optional accessory icon, by default • How to put even more data in a cell? • Add subviews to UITableViewCell • Subclassing UITableViewCell EEC492/693/793 - iPhone Application Development

12. Table View Cell Styles • Cell styles make use of three different cell elements • Image: if an image is part of the specified style, the image is displayed to the left of the cell’s text • Text label: this is the cell’s primary text • Detail text label: the cell’s secondary text, usually used as an explanatory note or label Default style Subtitle style Style value 1 style Style value 2 style EEC492/693/793 - iPhone Application Development

13. Grouped and Plain Tables • Table views come in two basic styles • Grouped: each group is a set of rows embedded in a rounded rectangle • Plain: default style, with no rounded rectangle • It is referred to as indexed when an index is used EEC492/693/793 - iPhone Application Development

14. Sections and Rows • Each division of the table is a section • In a grouped table, each group is a section • In an indexed table, each indexed grouping of data is a section • In a plain table without index, the entire table is one section EEC492/693/793 - iPhone Application Development

15. Table View Data Source Methods for the Simple Table App • Used by the table to ask how many rows are in a particular section • - (NSInteger)tableView:(UITableView *)tableView • numberOfRowsInSection:(NSInteger)section • { • return [self.listData count]; • } EEC492/693/793 - iPhone Application Development

16. Table View Data Source Methods for the Simple Table App • Called by the table view when it needs to draw one of its rows • - (UITableViewCell *)tableView:(UITableView *)tableView • cellForRowAtIndexPath:(NSIndexPath *)indexPath { • static NSString *SimpleTableIdentifier = @"SimpleTableIdentifier"; • UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier: • SimpleTableIdentifier]; // to reduce overhead • if (cell == nil) { • cell = [[[UITableViewCell alloc] • initWithStyle:UITableViewCellStyleDefault • reuseIdentifier:SimpleTableIdentifier] autorelease]; • } • NSUInteger row = [indexPath row]; • cell.textLabel.text = [listData objectAtIndex:row]; • return cell; • } EEC492/693/793 - iPhone Application Development

17. Table View Delegate Methods for the Simple Table App • Setting the indent level - (NSInteger)tableView:(UITableView *)tableView indentationLevelForRowAtIndexPath:(NSIndexPath *)indexPath { NSUInteger row = [indexPath row]; return row; } EEC492/693/793 - iPhone Application Development

18. Table View Delegate Methods for the Simple Table App • Method called when a user tapped a row (before the row is selected) -(NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath { NSUInteger row = [indexPath row]; if (row == 0) // prevent 1st row being selected return nil; return indexPath; } EEC492/693/793 - iPhone Application Development

19. Table View Delegate Methods for the Simple Table App • Method called after a row is selected - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { NSUInteger row = [indexPath row]; NSString *rowValue = [listData objectAtIndex:row]; … [tableView deselectRowAtIndexPath:indexPath animated:YES]; } EEC492/693/793 - iPhone Application Development

20. Table View Delegate Methods for the Simple Table App • Method to specify the height of the table rows - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { return 70; } EEC492/693/793 - iPhone Application Development

21. Adding Subviews to the Table View Cell • Coding UI Elements Directly CGRect nameLabelRect = CGRectMake(0, 5, 70, 15); UILabel *nameLabel = [[UILabel alloc] initWithFrame:nameLabelRect]; nameLabel.textAlignment = UITextAlignmentRight; nameLabel.text = @"Name:"; nameLabel.font = [UIFont boldSystemFontOfSize:12]; [cell.contentView addSubview: nameLabel]; [nameLabel release]; EEC492/693/793 - iPhone Application Development

22. Adding Subviews to the Table View Cell • Accessing UI Element via tag CGRect nameValueRect = CGRectMake(80, 5, 200, 15); UILabel *nameValue = [[UILabel alloc] initWithFrame:nameValueRect]; nameValue.tag = kNameValueTag; [cell.contentView addSubview:nameValue]; [nameValue release]; NSUInteger row = [indexPath row]; NSDictionary *rowData = [self.computers objectAtIndex:row]; UILabel *name = (UILabel *)[cell.contentView viewWithTag:kNameValueTag]; name.text = [rowData objectForKey:@"Name"]; EEC492/693/793 - iPhone Application Development

23. Table View Data Source Methods for the Sections App • Get number of sections • (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { • return [keys count]; • } • Specify header value for each section - (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section { NSString *key = [keys objectAtIndex:section]; return key; } EEC492/693/793 - iPhone Application Development

24. Table View Delegate Methods for the Sections App • To add an index - (NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView { return keys; } EEC492/693/793 - iPhone Application Development

25. Adding a Search Bar • What’s needed • Creating a mutable copy of the dictionary and the keys as the data source • Adding an outlet for the table, andanother one for the search bar • Adding search method, and reset method • Adding search bar delegate methods • Adding ways of displaying/hiding the index • Adding ways of displaying/hiding the search bar EEC492/693/793 - iPhone Application Development