CODEWITHSUNDEEP
iosuitableview
sathya
sathya

Reputation: 135

Accordion table cell - for expand and collapse ios

I am trying to expand/collapse of tableview cells in accordion cell pattern, So that, when a user taps the row they would get the detailed description of the selected row within the cell by extending the row height. I have 2 arrays, 'array' and 'detailarray' for displaying it in 'cell.textLabel.text' and 'cell.detailTextLabel.text' cells resp. now initially i have made 'cell.detailTextLabel.hidden = YES' as hidden, so that when user taps the row can get the extended text of the cell.

My code,

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];

    // Configure the cell...
    cell.textLabel.text=[array objectAtIndex:indexPath.row];
    cell.detailTextLabel.text=[detailarray objectAtIndex:indexPath.row];
    cell.detailTextLabel.hidden = YES;

    return cell;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath  *)indexPath
{
    [tableView deselectRowAtIndexPath:indexPath animated:YES];
    NSLog(@"indexpath is %d", indexPath.row);
    selectedIndex = indexPath.row;
    isSearching = YES;

    [self.tableview beginUpdates];

    static NSString *CellIdentifier = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];
    cell.textLabel.text=[array objectAtIndex:indexPath.row];
    cell.detailTextLabel.text=[detailarray objectAtIndex:indexPath.row];
    cell.detailTextLabel.hidden = NO;

    [self.tableview endUpdates];
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    if (isSearching && indexPath.row == selectedIndex)
    {       
        return 77;      
    }
    return 44;    
}

Now I have created a tableviewcell with 4 rows and when tapping each row i would get the extended view of the selected row. During runtime I could see the 'detailarray' text on my cell when it extends, but it disappears when didselectRowAtIndexPath function is stopped, why is that happening so, any one can help me in this regards.

Upvotes: 2

Views: 29548

Answers (2)

Alex Koshy
Alex Koshy

Reputation: 1661

Check out SubTable, it handles the expanding/collapsing for you.

If you're looking for a single detail cell to display under the main one, you can implement the delegate method like so:

- (NSInteger)numberOfChildCellsUnderParentIndex:(NSInteger)parentIndex {
    if (detailarray[parentIndex] contains content)
        return 1;
    else
        return 0;
}

and customize the cell's height and looks to your needs

Upvotes: 3

ninja_iOS
ninja_iOS

Reputation: 1223

After selecting cell remember its index in selectedIndex property (you must make one).

Add function to your table view:

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    return indexPath.row == selectedIndex ? extendedHeight : normalHeight;
}

Don't forget to reload tableView after selecting cell.

Upvotes: 0

Related Questions