Создание анимаций: базовые понятия

UnderPage позволяет анимировать объекты и группы объектов на странице. Создание и редактирование анимаций происходит в Панели действий. Панель действий можно вызвать по клику на кнопку в нижнем правому углу страницы.

Система анимации UnderPage основана на трех базовых понятиях

1. Состояния

Каждый объект на рабочей области может иметь несколько состояний. При анимации объект переходит из одного состояния в другое. Подробнее о состояниях можно узнать тут.

Если при смене состояний изменяется позиция объекта, вы можете связать две разных позиции траекторией любой формы с помощью кривых Безье.

2. Действия

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

• Смена состояния (изменение позиции, прозрачности, поворота и любых других свойств объекта);
• Анимация состояния;
• Запуск, пауза и остановка медиа;
• Переход по ссылке;
• Остановка действия.

UnderPage позволяет задавать время действия для смены состояния и анимации состояния, а также менять во время действия ряд параметров с разной скоростью:

• Смена позиции;
• Изменение поворота;
• Изменение прозрачности;
• Изменение размера;
• Изменение точки поворота.

3. События

Событиями называются действия пользователя и внутренние действия книги, которые могут запускать, останавливать или другим образом влиять на анимацию.

Сейчас UnderPage поддерживает следующие события:

• События страницы
  
  • Открытие страницы (PageLoad)
  • Закрытие страницы (PageUnload)
• Действия пользователя
  • Нажатие (Tap)
  • Нажатие с удержанием (TouchDown)
  • Прекращение нажатия (TouchUp)

Для того, чтобы лучше понять, как работают анимации, мы рекомендуем вам познакомиться с видео с примерами созданий анимаций:
1. Пример создания сложной анимации (на примере детской книги)
2. Добавление звуков в анимацию
3. Пример создания простой анимации движения (на примере детской книги)
4. Пример создания простой анимации смены состояний (на примере детской книги)
5. Пример создания простой анимации смены состояний (на примере бизнес-книги)