Реализованные анимации процессе)

Реализованные анимации процессе)

Все реализованные анимации хранятся в папке Dropbox → Animations.

Modal Page

Для раскрытия полноэкранных окон, которые занимают большую часть экрана устройства — 50% и более, используем эти параметры анимации.
Открытие модальной карточки

// Параметры анимации открытия карточки
duration: 480 ms // длительность открытия карточки
curve: cubic-bezier(0.32, 0.72, 0, 1) // параметры кривой анимации открытия карточки

// Параметры затемнения оверлея на фоне открытой карточки
duration: 200 ms
curve: cubic-bezier(0.42, 0, 0.58, 1)

Закрытие модальной карточки
При закрытии полноэкранных окон уменьшаем длительность анимации закрытия окна на 0.04 ms. 
Параметры Dimming оставляем без изменения.

// Параметры закрытия карточки
duration: 440 ms
curver: cubic-bezier(0.32, 0.72, 0, 1)



Action Sheet

Открытие Action Sheet
Для раскрытия Action Sheet, которые занимают малую часть экрана, используются эти параметры анимации.
// Открытие Action Sheet
duration: 200 ms
curve: cubic-bezier(0, 0, 0, 1)

// Появление тёмного оверлея
duration: 200 ms
curve: cubic-bezier(0.42, 0, 0.58, 1)

Закрытие Action Sheet
Параметры анимации закрытия остаются без изменений. Сохраняются все параметры анимации открытия. 







Скелеты