ItemAnimator how to time animation to start one after the other

2
votes

I am using a RecyclerView to display data that gets polled from a website (=> completely changes at once). I already created an ItemAnimator class that has the animation I want but I need to know what is the best way to time the animations to wait for the previous one to finish.

This is what I'm trying to achieve: http://www.google.com/design/spec/animation/meaningful-transitions.html#meaningful-transitions-hierarchical-timing

3
javaandroidanimationandroid-animationandroid-recyclerview
so what exactly did you try so far? – pskink
I tried to start the animation in the AnimationListener End method which resulted in the UI being super buggy and animations not playing at all. – k0bin
what method to you mean? post your code – pskink
My code was just a try which doesn't work at all. I would like to learn how to do it properly. – k0bin
if you want to learn then study DefaultItemAnimator, see github.com/flzyup/ExRecyclerViewLibrary/blob/master/… or this one: github.com/gabrielemariotti/RecyclerViewItemAnimators – pskink

3 Answers

2
votes

We've had a lot of success using setStartDelay (or setStartOffset, depending on which animators you are using). Have a delay variable that starts at 0, and as you walk through your children creating their animations, set the start delay to the current value and add some increment, such as 100 ms.

0
votes

I've been working on the exact same animation. I've put it to the side for the time being, but got a pretty good effect at normal speed. When I slowed it down for debugging, I've got a strange bug that causes certain items to be animated multiple times. Also, scrolling up doesn't quite work if the animation hasn't completed, but that isn't a bug likely to be run into at normal speed.

Here's my code: https://github.com/halfjew22/AnimateRecyclerGrid

Essentially, what I did was I looked at the pattern in the Material Animation. Based off of that pattern, I put together a for loop that spawns a runnable that is given coordinates (based off the value in the for loop) and told to animate the view with those coordinates.

Like I said, I didn't quite finish the project, but it works fairly well as an alpha or proof of concept. I know it's been a while since you asked this question, but let me know if you'd like to work on finishing this up together.

Let me know if that helps you out.

0
votes

I've created a custom RecyclerView adapter class which does more or less what OP wanted to achieve i.e. animates RecyclerView's items sequentially (in order, one after the other).

The adapter class is shared publicly on github as a gist here.

From the description: "This adapter aims to create a sequential RecyclerView items' animation. They're appearing in order, top to bottom. The animation works when the RecyclerView is first created and does NOT work when items are scrolled down."