Question

I have setup a uitableview with custom cells.

I would like these into sections with a title. Looking at the below photo I am looking for the following layout:

Section – My Profile
Custom cell – wwwwwwwwwwwwww…
Section – Application
Custom cell – Games
Custom cell – Share
Custom cell – Rate
Custom cell – Settings
Custom cell – Help
Custom cell – Log out

I can see how to add a section and control the rows in a section, but this duplicates the cells into multiple sections, I am not sure how to have one section with one row and another section with 6 rows. I also want to style these sections to show, slightly like the Facebook menu style.

Should I create custom cells for the actual sections instead and have no action on the section (cell) selection?

Here is the code for the UITableView

static NSString *CellIdentifier = @"Cell";
LeftMenuTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

    NSArray* views = [[NSBundle mainBundle] loadNibNamed:@"LeftMenuTableViewCell" owner:nil options:nil];

    for (UIView *view in views) {
        if([view isKindOfClass:[UITableViewCell class]]) {
            cell = (LeftMenuTableViewCell*)view;


        }
    }
}

Answer 1

You could define number of sections and rows in it as following:

- (UIView *) tableview:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section 
{
    UIView view;
    if(section == 0) {
         // Initialise view for section 1
    } else {
         // Initialise view for section 2
    }
}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 2;
}

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

    return ((section == 0) ? 1 : 6);
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 
{
    // return appropriate cell(s) based on section
    if(indexPath.section == 0) 
    {
        // Return 1 cell
    }
    else if(indexPath.section == 1) 
    {
        switch(indexPath.row) {
            case 0: // Initialize cell 1
                    break;
            case 1: // Initialize cell 2
                    break;
            ...
        }
    }
    return cell;
}