Search code examples
androidscrollandroid-animationandroid-recyclerview

How to animate recyclerview on scroll like Google plus/Google newsstand?


How do I animate the RecyclerView when the items appear for first time and also when the user scrolls, just like the way it works for the google plus app or the google news stand app.

Also I read somewhere that RecyclerView does not directly support animation when the user scrolls; if this is true, is there any way we can still do it?


Solution

  • I did it this way. Might help someone. I don't know whether it's the best way to do it but works fine for me.

    UPDATE: To fix fast scrolling behaviour, override onViewDetachedFromWindow method of the adapter and call clearAnimation on the animated view (in this case, holder.itemView.clearAnimation() ).Like this:

     @Override
    public void onViewDetachedFromWindow(@NonNull ViewHolder holder) {
        super.onViewDetachedFromWindow(holder);
        holder.itemView.clearAnimation();
    }
    

    up_from_bottom.xml

    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
     android:shareInterpolator="@android:anim/decelerate_interpolator">
    <translate
        android:fromXDelta="0%" android:toXDelta="0%"
        android:fromYDelta="100%" android:toYDelta="0%"
        android:duration="400" />
    </set>
    

    down_from_top.xml

    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
     android:shareInterpolator="@android:anim/decelerate_interpolator">
    <translate
        android:fromXDelta="0%" android:toXDelta="0%"
        android:fromYDelta="-100%" android:toYDelta="0%"
        android:duration="400" />
    </set>
    

    And finally put this code in onBindViewHolder of recyclerView. Create a field called lastPosition and initialize it to -1.

    Animation animation = AnimationUtils.loadAnimation(context,
                (position > lastPosition) ? R.anim.up_from_bottom
                        : R.anim.down_from_top);
        holder.itemView.startAnimation(animation);
        lastPosition = position;