Replace a existing Custom Cell A with another Custom Cell B in Accordion Style - On Selection

Question

Suppose there is Custom Cell A & B of different Height.
Custom Cell A is loaded Default on UITableView. When User will Select Cell A it will remove that Cell and Add Cell B to that Position and vise versa. It will do the animation of re-sizing in Accordion style.

You should describe what you want more clearly, and in more detail. — rdelmar, Aug 25 '13 at 04:52
@rdelmar - suppose there is Custom Cell A & B. Cell A is default loaded in Uitable. when I will select Cell A it will Add Cell B to that position and vise versa. but the thing is that Cell B has different height. — Vizllx, Aug 25 '13 at 05:53

rdelmar · Answer 1 · 2013-08-26T00:16:25.617

To do this, you should have a property (or key if using a dictionary) in your data array to keep track of what cell you want at each indexPath, and use an if-else statement in cellFroRowAtIndexPath to dequeue the correct cell. In didSelectRowAtIndexPath, you would check that property, set it to the opposite one, and then reload the table. You would also need to implement heightForRowAtIndexPath, and check that same property to determine which height to return.

After Edit:

If you just need to keep track of one selected cell, then create a property (I call it selectedPath) to hold that value and check it in heightForRowAtIndexPath and cellForRowAtIndexPath. I created two cells in the storyboard, one a simple UITableViewCell and the other a custom cell of class RDCell. I'm not sure if this gives the animation you want, but give it a try and see if it's close:

#import "TableController.h"
#import "RDCell.h"

@interface TableController ()
@property (strong,nonatomic) NSArray *theData;
@property (nonatomic) NSIndexPath *selectedPath;
@end

@implementation TableController 


- (void)viewDidLoad {
    [super viewDidLoad];
    self.theData = @[@"One",@"Two",@"Three",@"Four",@"Five",@"Six",@"Seven",@"Eight"];
    self.selectedPath = [NSIndexPath indexPathForRow:-1 inSection:0];
    [self.tableView reloadData];
}


- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return self.theData.count;
}


-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {

    if ([self.selectedPath isEqual:indexPath]) {
        return 90;
    }else{
        return 44;
    }

}

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

    if ([self.selectedPath isEqual:indexPath]) {
        RDCell *cell = [tableView dequeueReusableCellWithIdentifier:@"RDCell" forIndexPath:indexPath];
        cell.label.text = self.theData[indexPath.row];
        return cell;

    }else{
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
        cell.textLabel.text = self.theData[indexPath.row];
        return cell;
    }
}


- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    NSIndexPath *oldPath = self.selectedPath;
    self.selectedPath = indexPath;
    [self.tableView reloadRowsAtIndexPaths:@[indexPath,oldPath] withRowAnimation:UITableViewRowAnimationAutomatic];
}

@rdelmar- no of rows is static out here, cell will be replaced on select event so no need of data array to keep track. Thanx,by the way i will be very grateful if u can provide some sample code for wat u described. As i m a newbie. — Vizllx, Aug 25 '13 at 06:25
Suppose there is Custom Cell A & B of different Height. Custom Cell A is loaded Default on UITableView. When User will Select Cell A it will remove that Cell and Add Cell B to that Position and vise versa. It will do the animation of re-sizing in Accordion style. — Vizllx, Aug 25 '13 at 09:13
@Vizllx, when you select a second cell, does the first one you selected go back to being a cell A? — rdelmar, Aug 25 '13 at 14:41
yes, when you wil select second cell b it will change to cell A. — Vizllx, Aug 25 '13 at 23:40
@rdelmar- **thanx** u saved me. Well, is the animation done here is in Accordion style? or i have to implement it?? — Vizllx, Aug 26 '13 at 01:12
@Vizllx, not sure exactly what you mean by accordion style -- it animates in, but sometime it comes from the bottom and sometimes from the top. It depends on whether, when you select the second cell, that cell is above or below the one that was previously selected. — rdelmar, Aug 26 '13 at 01:41
@rdelmar- http://stackoverflow.com/questions/1944428/how-to-implement-an-accordion-view-for-an-iphone-sdk-app - here u can see how accordion animation happens. — Vizllx, Aug 26 '13 at 02:34

score 2 · Accepted Answer · answered Aug 27 '13 at 06:51

 **Got this amazing Solution, its working great...**






 @implementation NetworkCentreTable
    {
        NSMutableArray *arr;
        BOOL chk;
        int onSelectCount;
        NSIndexPath *onSelectTrack;
    }
    - (void)viewDidLoad
    {
        [super viewDidLoad];
        arr=[[NSMutableArray alloc] initWithObjects:@"1",@"1",@"1",@"1",@"1",@"1",@"1",@"1",@"1",nil];
        onSelectCount=0;
        static NSString *CellIdentifier1 = @"NetworkCell2";
        UINib *nib = [UINib nibWithNibName:@"NetworkCentreCellBig" bundle:nil];
        [self.tblNetworkCentre registerNib:nib forCellReuseIdentifier:CellIdentifier1]; 
    }

    #pragma mark -
    #pragma mark Custom Network TableView delegate and Datasource

    -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
        return [arr count];
    }

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


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


        static NSString *CellIdentifier1 = @"NetworkCentreCell";
        static NSString *CellIdentifier2 = @"NetworkCentreCellBig";


        if(self.selectedRowIndex && indexPath.row == self.selectedRowIndex.integerValue)

        {
            NetworkCentreCell *cell = (NetworkCentreCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier2];
            UIViewController *controller=[[UIViewController alloc] initWithNibName:CellIdentifier2 bundle:nil];
            cell=(NetworkCentreCell *)controller.view;
            return cell;
        }
        else
        {
            NetworkCentreCell *cell = (NetworkCentreCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier1];
            UIViewController *controller=[[UIViewController alloc] initWithNibName:CellIdentifier1 bundle:nil];
            cell=(NetworkCentreCell *)controller.view;
            return cell;

        }


    }

    - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
        onSelectCount++;
        NSLog(@"num=%d",onSelectCount);
        self.selectedIndexPath = indexPath;
        [tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation: UITableViewRowAnimationNone];
        self.selectedRowIndex = [NSNumber numberWithInteger:indexPath.row]; 
        [self.tblNetworkCentre deselectRowAtIndexPath:indexPath animated:YES];

        //First we check if a cell is already expanded.
        //If it is we want to minimize make sure it is reloaded to minimize it back
       if( onSelectCount==1 )
        {
             [tableView beginUpdates];
            NSIndexPath *previousPath = [NSIndexPath indexPathForRow:self.selectedRowIndex.integerValue inSection:0];
            self.selectedRowIndex = [NSNumber numberWithInteger:indexPath.row];
            onSelectTrack=indexPath;
            [tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:previousPath] withRowAnimation:UITableViewRowAnimationFade];
            [tableView endUpdates];

        }
       if(onSelectTrack.row!=indexPath.row)
       {
           [tableView beginUpdates];
           [tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:onSelectTrack] withRowAnimation:UITableViewRowAnimationFade];
            [tableView endUpdates];

           onSelectTrack=indexPath;
           onSelectCount=0;
           [self tableView:tableView didSelectRowAtIndexPath:onSelectTrack];

       }

        if(self.selectedRowIndex.integerValue == indexPath.row && onSelectCount==2)
            {
             [tableView beginUpdates];
            self.selectedRowIndex = [NSNumber numberWithInteger:-1];
            [tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationFade];
            onSelectCount=0;
            [tableView endUpdates];

        }


    }

    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {


       if(self.selectedRowIndex && indexPath.row == self.selectedRowIndex.integerValue)

        {

            return 280;
        }else{
            return 85;
        }


    }

score 1 · Answer 3 · answered Aug 25 '13 at 03:33

1

You can call [yourTableview reloadData] in didSelectRowAtIndexPath method. Then in numberOfRowsInSection give a new count. In heightForRowAtIndexpath specify the custom heights. In cellForRowAtIndexpath add custom cells.

answered Aug 25 '13 at 03:33

ArunGJ

2,685
21
27

when i will select the default custom cell it has to be replaced by a different custom cell of diff height and on selecting again it will again replaced by default custom cell. your solution is fine but not as asked. – Vizllx Aug 25 '13 at 04:22
Suppose there is Custom Cell A & B of different Height. Custom Cell A is loaded Default on UITableView. When User will Select Cell A it will remove that Cell and Add Cell B to that Position and vise versa. It will do the animation of re-sizing in Accordion style. – Vizllx Aug 25 '13 at 09:13

Replace a existing Custom Cell A with another Custom Cell B in Accordion Style - On Selection

3 Answers3

Linked