TransitionDrawable: automatically reverse transition once it completes

Question

I want to highliht newly-added ListView items with a nice effect. I thought that was simple&easy, but I stumpled upon a problem:

I want to play TransitionDrawable animation and once it completes - rewind it. The new item is going to be highlited for a moment, and then it will blend with the rest.

TransitionDrawable has methods for playing animation forward and backward, but none that could be used for synchronization. I expected a possibility to specify a callback for animation completion, something like:

 TransitionDrawable transition = (TransitionDrawable) view.getBackground();
 transition.startTransition(500, new TransitionCompleteListener(){
               public void completed()
               { 
                    transition.reverseTransition(500);
               }
       });

But nothing like that is supported by TransitionDrawable class.

The problem is: How to play TransitionDrawable animation, and when it finishes - immediately play it backwards? I had an idea of using Timer class to delay execution of the backwards part of the animation, but this solution looks a bit too heavy for such a simple thing.

Or maybe I should use something different that TransitionDrawable? I'd like to avoid using Property Animations, since I want to support older devices (and PA are avaialble since Honeycomb).

Answer 1

I haven't actually tried it myself yet, but I'd say what you're aiming for might also be possible with an old fashioned View animation, a tween to be precise. In stead of directly manipulating the background drawable (assuming that's what you're currently doing), you could potentially create the same effect by changing the alpha property of a View that has exactly the same dimensions as the row layout. You can then specify both the 'normal' animation and its reverse in a single AnimationSet and have the latter start with a delay based on the first. Alternatively, Animation provides an AnimationListener you can hook up to and get notified when the first animation ends, and subsequently start its reverse.

Looking at the source code for TransitionDrawable, I also see some possibilities to extend the current implementation with a custom listener interface. It shouldn't be too hard to actually realise the pattern you illustrate in the code snippet in your question.

I'm a bit short on time right now, so shoot me a comment in case you need any more concrete pointers (e.g. code snippets) - I'll then try to find some time this weekend to help you out.