蓝天,小湖,湖水中一方小筑

iOS Code Snippets - UITableView

Just created a project on BitBucket to save some iOS code snippets, and the first project is a simple UITableViewController one. The code is placed at http://goo.gl/0ZrcA. The text above is the introduction text for that project, please reference the code for detailed information.

SimpleTableView

This app is used to describe some basic feature of UITableView in iOS framework, here is some points of this app:

A tabbed view

This app shows three different UITableViewController objects, which is organized by tabbed view. The table view of this app is created programmatically, which is built by this code segment in file AppDelegate.m.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    // Override point for customization after application launch.

    UIViewController *vc_simple_table = [[SimpleTableViewController alloc] initWithNibName:@"SimpleTableViewController" bundle:nil];
    UIViewController *vc_section_table = [[SectionTableViewController alloc] initWithNibName:@"SectionTableViewController" bundle:nil];
    UIViewController *vc_grouped_table = [[GroupedTableViewController alloc] initWithNibName:@"GroupedTableViewController" bundle:nil];

    self.tab_bar = [[UITabBarController alloc] init];
    self.tab_bar.viewControllers = @[vc_simple_table, vc_section_table, vc_grouped_table];

    [self.window addSubview:self.tab_bar.view];
    [self.window makeKeyAndVisible];
    return YES;
}

NOTICE: setRootView for self.window can’t add show the tabbed view in app, not sure why currently.

Read data from text file

The data source of the list is fetched from a text file by this code segment:

NSArray *table_data;

// Country list
NSString *fileText = [NSString stringWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"country_list" ofType:@"txt"] encoding:NSMacOSRomanStringEncoding error:nil];
table_data = [fileText componentsSeparatedByString:@"\n"];

Build table view

Now the prime task, build table view. I have created three types of list, the plain, sectioned, and grouped. I want to apply it to some earlier version of iOS device, so haven’t use the storyboard. By the way, there is a [document](h ttp://developer.apple.com/library/ios/#documentation/userexperience/conceptual /tableview_iphone/AboutTableViewsiPhone/AboutTableViewsiPhone.html#//apple_ref /doc/uid/TP40007451-CH1-SW1) on apple development center which can give more information.

Plain table view

This is the simplest table view, and here is my step:

  1. Create a Object C class, with xib file. In this app, the created class is SimpleTableViewController.
  2. Modify the header file to make sure the class will implement protocol UITableViewDelegate and UITableViewDataSource.
  3. Drag the UITableViewController widget to xib file, and associate with member variables.
  4. Two functions numberOfRowsInSection and cellForRowAtIndexPath are needed for showing data in list.
  5. Fill the data into table_data array, and now you have a simple table list.

Sectioned table view

Class for sectioned table view is SectionTableViewController, here is the prime changes:

  • Use two-level data structure to save section title and row data. Currently an array is used for section title while a dictionary for detail data.
  • Two functions numberOfSectionsInTableView and titleForHeaderInSection are added for returning section count and section title
  • numberOfRowsInSection should be modified to return count in each section.

Grouped table view

Class for grouped table view is GroupedTableViewController, and here is the changes:

  • Modify the table view widget from plain to grouped in xib file
  • The other things are almost the same with section.

Add the index

This will add an index to the right side of list, since it need a sectioned data, so I added it in section table view. Two functions are needed for adding index. * sectionIndexTitlesForTableView: Set the section header string * sectionForSectionIndexTitle: Return the section while clicking section title.

Search the list

Search function it added to simple table view. Here are the changes:

  • Add search bar to top of the table view
  • Add function searchBarTextDidBeginEditing and textDidChange to handle the typing event in search bar
  • Add function searchBarSearchButtonClicked to handle search button clicked event

This search result will be shown real time while typing character to the search bar.

Response to user click event

This is added to sectioned table view. Function didSelectRowAtIndexPath will handle user click event.