Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement Hierarchical Timing specification for all animators in accordance with Google Material Design motion guidelines #66

Merged
merged 3 commits into from
Jan 28, 2016

Conversation

aphexcx
Copy link
Contributor

@aphexcx aphexcx commented Jan 22, 2016

Goal

Adhere to the Google Material Design Hierarchical Timing spec, illustrated in this video.

Motivation

The Google Material Design spec for recycler view animations specifies:

When building a transition, consider the order and timing of element movement. Ensure that motion supports the information hierarchy, conveying what content is most important by creating a path for the eye to follow.
recyclerview-animators does not currently follow this specification - all elements animate in at once.

Pull Request

In this PR, I've implemented the Hierarchical Timing specification for all animators, achieving the cool effect that the spec video shows.

Here's a video of my implementation in action, in my app:
https://www.dropbox.com/s/gxiw63pn7ljv3if/recyclerview-animation.mp4?dl=0

Implementation details

I achieved this by adding a .setStartDelay call to each Animator's animateAddImpl and animateRemoveImpl method. They call two new methods on BaseAnimator: getAddDelay and getRemoveDelay respectively. These methods will determine the delay based on:

  1. the element's position in the adapter
  2. the current add or remove duration set by .setAddDuration or setRemoveDuration (currently, this is retrieved and then divided by 4 - I found this gives the best result and provides smooth, overlapping animations that are closest to the spec video.)

Let me know if you need more information to merge this. Thanks for the great library!

@wasabeef
Copy link
Owner

@aphexcx

Great!
Let me confirm.

wasabeef added a commit that referenced this pull request Jan 28, 2016
Implement Hierarchical Timing specification for all animators in accordance with Google Material Design motion guidelines
@wasabeef wasabeef merged commit 3d312c0 into wasabeef:master Jan 28, 2016
@wasabeef
Copy link
Owner

@aphexcx
Thank you
2.2.0 released :shipit:

@aphexcx
Copy link
Contributor Author

aphexcx commented Feb 15, 2016

💃

@aphexcx aphexcx deleted the pr-start-delay branch February 15, 2016 08:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants