Анімація у flash, записки
Анімація буває декількох типів. Анімувати можна становище або форму фігури, переміщаючи точки, тим самим трансформуючи її в іншу фігуру. Можна так-же, анімувати властивості цієї фігури, такі, як колір, прозорість, розташування і налаштування градієнта, колір, товщину і тип обведення. Це все стосується фігур, намальованих в робочій області або всередині символів і називається Shape Tween. В процесі анімації можна користуватися, або ключовими кадрами, або покадрового анімацією. Ключова анімація, звичайно, простіше, так як, змінювати потрібно не всі кадри, частина їх, між ключовими, змінюється автоматично. Але, іноді буває необхідність і в анімації кадру. Коли яку використовувати - на ваш вибір.
Motion Tween - другий спосіб анімації. Використовується для анімації символів, таких, як Graphic. Movieclip і Button. Тут доступні інші властивості. За допомогою Motion Tween можна анімувати положення символів, їх масштабування, обертання, а так само параметри, що знаходяться в селекторі Color панелі Properties. До них відносяться: яскравість, тонування символу кольором, прозорість і набір параметрів Advanced, який поєднує в собі три попередні. При ключовий анімації підтримується Easing. тобто, анімація з прискоренням і уповільненням, що вельми корисно при реалістичною анімації персонажів, та й будь-яких інших об'єктів, які повинні рухатися реалістично.
Shape Tween
Намалюйте в робочій області прямокутник, з обведенням чорного кольору і товщиною лінії в 2-3 пікселя. Якщо він вималюється з заливкою, виділіть її поодиноким клацанням і видаліть. Зараз нам знадобиться тільки обведення.
На таймлайне, клацніть правою кнопкою на новоствореному кадрі і виберіть Create Shape Tween. Ключовий кадр стане зеленого кольору. Далі, виділіть клацанням, кадр 10 на тому-ж шарі і натисніть "F6" для створення другого ключового кадру.
Якщо ви все зробили правильно, на таймлайн буде ось таке:
Це і є ваша перша анімація, вітаю! Але, два ключових кадру, ще не є анімація. Клацніть на таймлайн на кадрі 10, виділивши його. Разом з ним виділиться все, що знаходиться в робочій області на цьому кадрі. Зніміть виділення з фігури і підведіть курсор миші до верхньої горизонтальної лінії нашого прямокутника, щоб поруч з курсором з'явився значок дуги. Це дозволить згинати сегменти фігури. Схопите сегмент за середину і протягнете трохи вниз, щоб він зігнувся. тепер можна подивитися, що вийшло. Протягнете Playhead по вашим 10-ти кадрів анімації і подивіться, як фігура трансформується.
Ось, що вийшло у мене. Якщо я щось пояснив незрозуміло, ось исходник. Можна ускладнити анімацію, додавши ще й заливку. Але робити це потрібно на іншому шарі. Справа в тому, що при побудові ключів в складній геометрії (а дві однакові форми, що лежать один на одному - дуже складна геометрія, запитаєте будь-якого трехмерщіка), програма шукає найбільш короткі шляхи для перетворень, тому, неминучі спотворення.
У цьому прикладі, в першому ключовому кадрі знаходяться дві окружності, у другому, одна з них наїжджає на іншу. Так як обидві фігури в одному шарі і представляють "як би" одну фігуру для анімації, вийшло ось таке. Якщо рознести їх по різним верствам, цього не станеться. По-хорошому, правильно анімовані будуть тлько найпростіші форми, але так не завжди буває. Якщо у вас ціле поле анімованих об'єктів, анімація не рознести по різних верств. Їх буде занадто багато. Можна поекспериментувати з "щільністю об'єктів", подивитися, як вони себе ведуть один з одним. Можливо, застосувати інший тип анімації.
Ось ще один приклад неправильного Shape Tween. Я привів його, щоб показати, як можна боротися з деякими недоліками цього методу. Отже, ця фігура просто повертається на 90 градусів, але так, як програма рухає точки по найкоротшому шляху, виходить така кракозябрами. Розробники, мабуть, нічого не змогли з цим зробити, оскільки придумали спеціальні прищіпки, які вішаються на точки і допомагають програмі їх не плутати при трансформації. Називаються вони Shape Hints. Встановлюємо перший за допомогою команди Modify> Shape> Add Shape Hint або комбінацією Ctrl + Shift + H. З'являється червона крапка з буквою "а". Її можна перетягувати. Перетягуємо її на першу проблемну точку. Повторюємо процедуру. Точка з буквою "b". Ставимо її на другу точку. І так далі, поки всі проблемні крапки не будуть защипаємо цими точками. Це, до речі, треба робити на першому ключовому кадрі анімації. На другому ключовому кадрі потрібно визначити, на що перетворилися наші початкові і пересунути потрібні хинти на них. У мене вийшло ось так:
Що ж, результат цілком пристойний, не рахуючи того, що хинти довелося поставити на кожну точку фігури. Тому, я намагаюся, по можливості, уникати таких складних трансформацій. Ось ще кілька прикладів простих трансформацій, які без особливих проблем, виконуються за допомогою Shape Tween: