Animating listview data change

Question

I'm working on Android with a set of data(ArrayList) that populates a ListView. At the moment when I change the sorting mode I re-order the data linked to the adapter and call notifyOnDataChanged() to update the list.

This does the job, but I'd like to be able to animate each item to its new position(like on iOS) as both data sets contain the same items - just reordered.

I've spent some time thinking about how I'd animate this and decided to animate all items that appear lower down on the list to a height of zero and then animate back to their normal size in the new position. This would let all items that move up in the data actually move up in the list as items disappear above it. So that's the idea, but I can't figure out how to implement it.

The data could be represented like this:

Set A | index | Set B
------+-------+------
A     | 0     | B
B     | 1     | A
C     | 2     | C
D     | 3     | F
E     | 4     | G
F     | 5     | E
G     | 6     | D

I'm just looking for something that iOS handles by default for Android. It shouldn't be this hard.

Answer 1

Made a small example that animates the reordering of such a list. The animation is not exactly as you described but hopefully it helps you achieve what you want.

https://github.com/fabrantes/widgetexamples

The flow is something like this:

1. Save the current state before notifyDataSetChanged(). Saving the state consists in storing the getTop() coordinate for each item.
2. After notifyDataSetChange, go through all the ListView views and apply a TranslateAnimation with the height difference between the new item position and the old position.