Slide UITableViewCell

Question

My goal is to have a UITableViewCell slide off one side of the screen (like in Twitter) and then slide back on from the other side. I'm able to make the cell slide off the screen to the right, but I can't seem to figure out how to get it to slide back onto the screen from the left right after. Here's my code to slide it off to the right:

UITableViewCell *cell = [self cellForRowAtIndexPath:indexPath];
[cell.layer setAnchorPoint:CGPointMake(0, 0.5)];
[cell.layer setPosition:CGPointMake(cell.frame.size.width, cell.layer.position.y)];
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position.x"];
[animation setRemovedOnCompletion:NO];
[animation setDelegate:self];
[animation setDuration:0.14];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]];
[cell.layer addAnimation:animation forKey:@"reveal"];

Thanks for any help!

Answer 1

UITableView provides methods to insert and remove rows with animation and handles all the animation for you. Try something like this:

[tableView beginUpdates];
[tableView deleteRowsAtIndexPaths:myIndexPaths
                 withRowAnimation:UITableViewCellRowAnimationRight];
[tableView endUpdates];

And then to slide in a new cell:

[tableView beginUpdates];
[tableView insertRowsAtIndexPaths:myNewIndexPaths
                 withRowAnimation:UITableViewCellRowAnimationLeft];
[tableView endUpdates];

The beginUpdates/endUpdates methods cause the animations to be batched up and executed all at once.

Beware of 2 things:

1. With a lot of table data, the insert can take a long time (expecially if you are essentially replacing the whole table). Calling [tableView reloadData] works better in this case, but the deleteRowsAtIndexPath:withRowAnimation: can still be used for a nice visual effect.

2. You have to be sure that the actual data backing your table changes accordingly and correctly. That is to say, if you are removing or inserting rows form the table, then your array (or whatever) that is feeding the table must also correctly reflect how many rows are in the table at each step.

Answer 2

The behavior you want should be done by animating subviews of the cell, not the cell itself. The cell should stay in place in the table. Create a custom cell with the subviews you want in the contentArea and then slide those on/off as you like.

The standard UIView block based animations should work great for this as well.