Эффект затухания (crossfading)

Crossfade анимация (также известная как затухание), это плавное исчезновение одного компонента с одновременным плавным появлением другого. Эта анимация удобна при переключении содержимого в приложении. Crossfade анимация довольно короткая, но предлагает плавное переключение с одного экрана на другой. Когда вы ее не используете, часто переходы кажутся слишком резкими и поспешными. Вот пример такой анимации при переключении с индикатора загрузки на текст.

Crossfade анимация. Щелкните по экрану, чтобы проиграть видео еще раз.

Если вы хотите забежать вперед и посмотреть работающий пример, скачайте, запустите демо-проект и выберите crossfade. Смотрите следующие файлы:
  • src/CrossfadeActivity.java
  • layout/activity_crossfade.xml
  • menu/activity_crossfade.xml

Создание объектов для переключения

Создадим два объекта, которые будем переключать. В следующем примере это индикатор прогресса и текст с прокруткой:

Создание анимации

Для создания анимации:
  1. Создаем переменные для объектов, которые хотим переключать. Необходимо создать ссылки после изменения объектов во время анимации.
  2. Для объекта, который будет исчезать, ставим свойство visibility равное GONE. Эта опция не позволит объекту занимать пространство разметки и не включит его в расчет разметки, что ускорит процесс.
  3. Сохраним системное свойство config_shortAnimTime в переменную. Это свойство описывает стандартную “короткую” продолжительность анимации. Такая продолжительность идеальна для едва заметной анимации или для анимации, которая происходит очень часто. Параметры config_longAnimTime и config_mediumAnimTime также доступны и вы можете их использовать.
Пример использования разметки предыдущего раздела в качестве компонента явления:

Переключение объектов

Когда объекты подготовлены, необходимо сделать следующее для переключения между ними:
  1. Для объекта, который будет скрываться, устанавливаем значение alpha равное 0 и свойство visibility в значение VISIBLE. (Помните, что оно было инициализировано значением GONE). Это сделает объект видимым, но полностью прозрачным.
  2. Для объекта, который будет появляться, изменяем значение alpha от 0 до 1. В то же самое время, для объекта, который будет исчезать, изменяем значение alpha от 1 до 0.
  3. Используя метод onAnimationEnd() объекта Animator.AnimatorListener, устанавливаем свойство visibility объекта, который нужно показать, в значение GONE. Несмотря на то, что значение alpha равно 0, значение параметра visibility равное GONE не позволит объекту занимать пространство разметки и не включает его в расчет макета, что ускоряет обработку.
Пример:

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