Programmaticlaly moving rows with animation in UITableView

Question

I want to move a row to the bottom of my UITableView with cool animation effect just like in this Grocery Shopping List app.

Just like we can move rows with reordering control like:

reordering uitableview rows programmatically

How can I create such animation?

score 25 · Answer 1 · answered Jan 18 '12 at 14:28

25

In IOS 5 this can be done with the following UITableView selector:

- (void)moveRowAtIndexPath:(NSIndexPath *)indexPath toIndexPath:(NSIndexPath *)newIndexPath

For example:

[self.tableView moveRowAtIndexPath:indexPath toIndexPath:[NSIndexPath indexPathForRow:[items count] - 1 inSection:1]];

answered Jan 18 '12 at 14:28

Joony

4,498
2
30
39

1

great ! link to the selector doc : https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITableView_Class/Reference/Reference.html#//apple_ref/doc/uid/TP40006943-CH3-SW55 – yonel Feb 14 '12 at 16:07
The obvious followup question is how to figure out these indexPaths after sorting an array...? Perhaps I should make a sorted copy of the array and figure out the before and after indexes of each element? – devios1 Aug 18 '13 at 15:53

score 8 · Answer 2 · edited May 23 '17 at 12:09

8

Important: This answer assumes iPhone OS 3.x. See the answer above for iOS 5.x

I don't know what is the "cool animation effect just like in Grocery Shopping List app". Not everyone has that app.

Rows cannot be moved programmatically.

However, you can simultaneously insert and delete a row to simulate a move.

[tableView beginUpdates];
[tableView deleteRowsAtIndexPaths:[NSArray arrayWithObject:rowToMove]
                 withRowAnimation:UITableViewRowAnimationLeft];
[tableView insertRowsAtIndexPaths:[NSArray arrayWithObject:indexPathToMoveTo]
                 withRowAnimation:UITableViewRowAnimationLeft];
// update your dataSource as well.
[tableView endUpdates];

edited May 23 '17 at 12:09

Community

1
1

answered Feb 22 '10 at 18:52

kennytm

510,854
105
1,084
1,005

Kenny, The effect I was talking about is a falling row animation, just like dragging it with a finger when a table is in rearrange mode. I'm wondering how it was done. I think about drawing the cell content into semi transparent uiimage and then move the image with animation into desired location, but i'm not sure that's the best solution – Alex Feb 23 '10 at 19:38
You find a solution? I have a similar question: http://stackoverflow.com/questions/5112588/how-make-the-same-animation-like-uitableview-reorder-of-cells & http://stackoverflow.com/questions/5315990/how-copy-cells-between-tables-as-the-pulse-app – mamcx Jun 24 '11 at 21:49
maybe you just need to RowAnimation effect to :UITableViewRowAnimationBottom – ugiflezet Sep 12 '11 at 10:32

score 2 · Answer 3 · answered Dec 23 '11 at 11:05

This is kind of similar to what I have done to allow drag and drop from one scrollview to another.

You will want to create a duplicate/dummy cell (for visual effect), then remove the original cell, then animate the duplicate, then insert into the bottom and then finally remove the duplicate/dummy cell.

Programmaticlaly moving rows with animation in UITableView

3 Answers3

Linked