Шпаргалка по material-интерполяторам

В гайдах Material Design по анимациям первым же пунктом прописано требование к «authentic motion», т.е. к живому, не-механистичному движению объектов на экране. В частности просят «natural acceleration and deceleration»; в общем, речь в первую очередь идёт об интерполяторах.

В support-библиотеке уже содержится три самых необходимых класса: FastOutLinearInInterpolator, FastOutSlowInInterpolator и LinearOutSlowInInterpolator. Однако я до сих пор регулярно в них путаюсь, а лаконичные описания из документации…

Uses a lookup table for the Bezier curve from (0,0) to (1,1) with control points: P0 (0, 0) P1 (0.4, 0) P2 (1.0, 1.0) P3 (1.0, 1.0)

…навевают некоторое уныние и стойкое ощущение себя гуманитарием.

Потому я просто оставлю здесь краткую шпаргалку: кто есть кто и когда кого использовать.

Вкратце

Краткая памятка выглядит так:

Уход объекта с экрана — FastOutLinearInInterpolator
Движение объекта по экрану — FastOutSlowInInterpolator
Появление объекта на экране — LinearOutSlowInInterpolator

А теперь чуть подробнее:

FastOutLinearInInterpolator

Быстро ускоряется и сохраняет ускорение до конца анимации.

Ближайший аналог: AccelerateInterpolator

Использование: исчезновение объектов с экрана, с полным уходом за границы (иначе произойдёт слишком резкая остановка объекта, что с «authentic motion» не вяжется). Этот же интерполятор подходит для эффектов circular reveal, т.е. для появления объектов «из круга».

Пример:

FastOutLinearInInterpolator
FastOutLinearInInterpolator и AccelerateInterpolator

FastOutSlowInInterpolator

Быстро ускоряется и постепенно замедляется.

Ближайший аналог: AccelerateDecelerateInterpolator

Использование: движение объектов в пределах экрана (когда объект виден от начала и до конца движения). Сюда же относится большинство случаев вращения объектов.

Пример:

FastOutSlowInInterpolator
FastOutSlowInInterpolator и AccelerateDecelerateInterpolator

LinearOutSlowInInterpolator

Начинает анимацию с полным ускорением и постепенно замедляется.

Ближайший аналог: DecelerateInterpolator

Использование: появление объектов из-за пределов экрана и коллапс эффекта circular, т.е. полная противоположность FastOutLinearInInterpolator.

Пример:

LinearOutSlowInInterpolator
LinearOutSlowInInterpolator и DecelerateInterpolator

Рацпредложения

Как можно заметить — эти классы могли бы называться (например)

  • MaterialAccelerateInterpolator,
  • MaterialAccelerateDecelerateInterpolator и
  • MaterialDecelerateInterpolator

соответственно. Почему авторы решили усложнить наименование и начать жонглировать всеми этими «fast», «slow», «linear», «in» и «out» — вопрос, остающийся на их совести. Я, например, каждый раз на этом подвисаю, а потому создал простенький вспомогательный класс:

Он позволяет не задумываться над чужими именами классов, по крайней мере — в Java-коде.

Лично мне гораздо проще воспринимать их именно так, вообще не задумываясь откуда и как оно in и куда это всё out. И если не я один такой — пользуйтесь!

Шпаргалка по material-интерполяторам
Оцените пост


Комментарии:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Капча (решите пример) *