Creating Grouped UITableview with Different Cell T

Question

I need to create a grouped uitableview that includes some sections and possibly different cell types in each sections.

I am trying to create something like old foursquare app, user page (includes 'leaderboard', 'friend suggestions', 'friends', 'stats', 'most explored categories' ... sections).

I am fairly new to ios programming, so that view may not be a grouped uitableview.

What I especially stuck is creating different cells for sections, and finding out which cells are clicked.

My data source will be 2 different NSArray* that consists of different data types, that's why I need different custom cells.

Answer 1

You can create multiple custom subclasses of UITableViewCell, and in the tableView:cellForRowAtIndexPath: method for your UITableViewDataSource, you can use if-statements to determine what type of cell to use.

For example, here's a rough outline of what I might do:

-(UITableViewCell *)tableView:(UITableView*)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

    //First, determine what type of object we're showing
    if (indexPath.section == 0) {
         //Create and return this cell.
    } else if (indexPath.section == 1) {
         //Create and return this cell.
    }...
}

Here's how you'd implement numberOfRowsInSection:

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

   if (section == 0) {
      return [firstSectionArray count];
   } else if (section == 1) {
      return [secondSectionArray count];
   } ...
}

For didSelectRowAtIndexPath

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
   if (indexPath.section == 0) {
      ObjectSelected *objectSelected = [firstArray objectAtIndex:indexPath.row];

      //Now you've got the object, so push a view controller:
      DetailViewController *dvc = [[DetailViewController alloc] init];
      dvc.objectSelected = objectSelected;
      [self.navigationController pushViewController:dvc];
   } else if (indexPath.section == 1) {
      //Same thing, just call [secondArray objectAtIndex:indexPath.row] instead!
   }
}

Answer 2

Since you have two different sets of data and you need to display both in different sections, you have to split the data source methods into two.

Basically, choose which dataset you want to be first and off you go.

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    if(section)return secondArray.count;
    //Essentially, if statements evaluate TRUE and move forward if the inside is 1 or greater (TRUE == 1)
    return firstArray.count;
    //If the first if statement return hits, then the code will never reach this statement which turns this into a lighter if else statement
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if(indexPath.section)
    {
        //do stuff with second array and choose cell type x
    }
    else
    {
        //do stuff with first array and choose cell type y
    }
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    //Get the cell with: UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    if(indexPath.section)
    {
        //perform action for second dataset
    }
    else
    {
        //perform action for first dataset
    }
}

For headers, you can use either of these methods and just keep the same type of styling as above:

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section;
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section;