Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Google Inbox like RecyclerView item open animation

Currently, I'm trying to implement Google Inbox like RecyclerView behaivior, and I'm very curious about email opening animation.

My question is: how to do that? I mean, which method they used? Did they use ItemAnimator.dispatchChangeStarting() and change it's height to fill parent? Or something another? And if they do, how they make it close with pull gesture while underlying RecyclerView elements are slightly visible.

Can anyone help me with pointing to some library, or code snippets/examples?

like image 328
Alviere Avatar asked Feb 20 '15 09:02

Alviere


1 Answers

You mean: the recyclerview as a load items, or once an item and pressing load the next screen.

I leave an example of how I charge items in recyclerview and I give an animation

public class CreateAnimationView {

private static int contador;
Integer colorFrom = R.color.myAccentColor;
Integer colorTo = Color.RED;

public static AnimatorSet createAnimation(View view) {
    ObjectAnimator fadeOut = ObjectAnimator.ofFloat(view, "alpha",
            0f);
    fadeOut.setDuration(300);
    ObjectAnimator mover = ObjectAnimator.ofFloat(view,
            "translationX", -500f, 0f);
    mover.setDuration(400);
    ObjectAnimator fadeIn = ObjectAnimator.ofFloat(view, "alpha",
            0f, 1f);
    fadeIn.setDuration(300);
    AnimatorSet animatorSet = new AnimatorSet();

    animatorSet.play(mover);
    animatorSet.start();
    return animatorSet;

 }
... more animations methods.
}

In your RecyclerViewAdapter:

@Override
public void onBindViewHolder(ViewHolder viewHolder, int position) {

    GruposCardView gruposCardView = gruposCardViews.get(position);

    CreateAnimationView.createAnimationRandom(viewHolder.cardView);
   ...}

And if not in the recyclerview you can pass a layout and use this animation or create one from this.

 public static AnimatorSet createAnimationCollapseXY(View view) {
    ObjectAnimator scaleXOut = ObjectAnimator.ofFloat(view, "scaleX", 1f, 0f).setDuration(400);
    ObjectAnimator scaleXIn = ObjectAnimator.ofFloat(view, "scaleX", 0f, 1f).setDuration(300);
    ObjectAnimator scaleYOut = ObjectAnimator.ofFloat(view, "scaleY", 1f, 0f).setDuration(400);
    ObjectAnimator scaleYIn = ObjectAnimator.ofFloat(view, "scaleY", 0f, 1f).setDuration(300);
    ObjectAnimator rotateClockWise = ObjectAnimator.ofFloat(view, "rotation", 0f, 360f).setDuration(400);
    ObjectAnimator rotateCounterClockWise = ObjectAnimator.ofFloat(view, "rotation", 0f, -360f).setDuration(400);


    AnimatorSet animatorSet = new AnimatorSet();

    animatorSet.playTogether(scaleXIn, scaleYIn);
    //animatorSet.setStartDelay(1200);
    animatorSet.start();
    return animatorSet;
}
like image 103
Emmanuel Guther Avatar answered Sep 28 '22 08:09

Emmanuel Guther