Advanced animations

Introduction

Often you may want to animate images opening from list (ListView, RecyclerView, etc) into full screen (ViewPager). That requires quite complex logic of keeping start and end views in sync (opening ViewPager on correct page, updating views if list or ViewPager content updated, updating views position if list was scrolled, scrolling list if ViewPager was scrolled and so on).

Out of the box

If you need to animate from RecyclerView (or ListView) into ViewPager you may use ViewsTransitionBuilder:

animator = GestureTransitions.from(recyclerView, fromTracker).into(viewPager, intoTracker);

Where fromTracker is a helper object with methods:

int getPositionById(ID id);
View getViewById(ID id);

And intoTracker is a helper object with methods:

ID getIdByPosition(int position);
int getPositionById(ID id);
View getViewById(ID id);

Created animator will have next API:

enter(ID id, boolean withAnimation);
exit(boolean withAnimation);
isLeaving();
addPositionUpdateListener(PositionUpdateListener listener);
removePositionUpdateListener(PositionUpdateListener listener);

Where ID is id of the item to be opened. If items positions are stable you may use positions as ids and use SimpleTracker which only requires method getViewAt(int position) to be implemented.

See also simple ListView and advanced RecyclerView examples.

Optimizations

ViewPager does not support views recycling by default, but it is very important thing to make user experience smooth. RecyclePagerAdapter is built into the library and addresses this issue by using ViewHolder pattern (similar to RecyclerView).

You can find few other optimizations (like clearing ViewPager when exiting full screen mode) in advanced sample.

Custom animation

If your starting and/or destination views sources are different from RecyclerView / ViewPager than you'll need to implement custom animation logic.

Good news is that you will not need to manually keep views in sync between different sources, that work is already done by ViewsCoordinator class. You will also not need to implement views animator yourself (ViewsTransitionAnimator is here to help), but you will need to provide special OnRequestViewListener object with method:

void onRequestView(ID id);

This method will be called when item with given id was requested to be opened. Your responsibility will be to find correct view (scrolling views if needed) and set it back to ViewsTransitionAnimator with either setFromView(ID id, View fromView) or setToView(ID id, AnimatorView toView) methods. You should do the same also if view for given item was changed for any reason.

Creation of custom animator will look like this:

animator = GestureTransitions.from(fromListener).into(toListener);

Where "from" and "to" listeners are helper objects described above.

You may use FromRecyclerViewListener and IntoViewPagerListener as starting points.