Урок 45                                                                        Інформатика 11(ІКТ)

Учень ніколи не перевершить учителя,

якщо бачить у ньому зразок, а не суперника.

В. Бєлінський

Інші види анімації, ефекти часової шкали, морфінг, використання масок.

Мета.

Навчальна. Ознайомити учнів з можливістю  створення анімації, покадрова анімація, створення анімації з автоматичним заповненням проміжних кадрів, рух об’єктів, створення анімаційних ефектів шляхом зміни властивостей об’єктів, рух за кривими, iнші види анімації, ефекти часової шкали, морфінг, використання масок.

Розвиваюча. Розвивати логічне мислення, самостійність, вміння застосовувати набуті знання до практичних завдань.

Виховна. Виховувати наполегливість, естетичність у оформленні, грамотно висловлювати свої думки.

Тип уроку. Засвоєння нових знань і навичок.

Матеріали для роботи з учнями:

• Основи створення комп’ютерних презентацій: Навч. посіб. / О.М. Левченко, І.В. Коваль, І.О.Завадський. - К.: Вид. група BHV, 2009. - 368.
• Мультимедійне обладнання;
• Презентація “Поняття бази даних”.

План

1. Організація початку уроку
2. Правила ТБ при роботі в кабінеті Інформатики.
3. Мотивація навчальної діяльності.
4. Актуалізація опорних знань.
5. Вивчення нового матеріалу.
6. Побудова математичної моделі до задачі.
7. Запитання до уроку.
8. Домашнє завдання.

Хід уроку

1. Організація початку уроку.

2. Інструктаж БЖД.

3. Мотивація навчальної діяльності.

У попередньому розділі ми ознайомилися з поняттям аніма­ції та її типами: покадровою й автоматичною. Останній тип мав два різновиди: рух об’єкта і змінення форми. Опановуючи матеріал цього розділу, ми побачимо, що прямолінійний рух об’єкта з однієї точки в іншу є поодиноким випадком більш складних і цікавих анімаційних ефектів: анімації шляхом змі­нення властивостей об’єкта та руху вздовж заданої траєкторії. Крім того, для створення анімаційних ефектів ми навчимося застосовувати маски.

4. Актуалізація опорних знань.

5. Вивчення нового матеріалу.

Створення ефектів анімації шляхом змінення властивостей об'єктів

Зображення на слайді можна змінювати не лише переміщенням об’єктів або перетворенням їхньої форми, але й внаслідок змі­нення параметрів кольору. Два найпростіші ефекти, що ство­рюються в такий спосіб, — це повільна поява та зникнення об’єкта. Під час появи колір об’єкта поступово стає насичені- шим, під час зникнення — навпаки, блідне. В обох випадках змінюється рівень прозорості.

Усі градації прозорості задавати не потрібно. Створіть два об’єк­ти: цілком прозорий та повністю зафарбований, а проміжні ста­ни Flash добудує автоматично за допомогою анімації типу «рух об’єкта» чи «змінення форми». Згадаємо, що у практичній роботі з попереднього розділу так само добудовувалися проміжні поло­ження об’єкта, що рухається. Відтак «рух об’єкта» — це умовна назва, сутність цієї анімації полягає в автоматичному перетво­ренні всіх параметрів початкового об’єкта (розміру, положення на слайді, форми, кольору тощо) на параметри кінцевого об’єкта.

Вправа 13.1

Застосуємо ефект поступового зникнення до текстового рядка.

Задамо для екземпляра відповідного символу в початковому ключовому кадрі коефіцієнт непрозорості (Alpha) 100 %, а в кін­цевому — 0 %.

1. Створіть новий документ Flash.
2. Створіть графічний символ, що міститиме текст, і його екзем­пляр. Настройте параметри символу.

а)  Створіть графічний символ із назвою Текст. За допомогою ін­струмента Text (Текст) додайте до нього слово «Зникнення».

б)  Виберіть для текстового поля параметр Anti-Alias for Anima­tion (Згладжування для анімації) зі спливаючого списку Font rendering method (Методи візуалізації шрифтів) на пане­лі Properties (Властивості).

в)  Скориставшись кнопкою Ф, поверніться до основної часо­вої шкали та перейменуйте рівень Layer 1 на Текст.

г)   Розмістіть у першому кадрі рівня Текст екземпляр символу Текст, перетягнувши його з панелі Library (Бібліотека).

3. Настройте кінцевий кадр анімації.

а)  Виділіть кадр 15 і перетворіть його на ключовий кадр, на­тиснувши клавішу F6.

б)  Виділіть на робочому полі екземпляр символу Текст. На па­нелі Properties (Властивості) відобразяться його параметри.

в)         Виберіть пункт Alpha (Коефіцієнт непрозорості) зі сплива­ючого списку ефектів кольору Color (Колір) і за допомогою списку, розміщеного праворуч, установіть значення коефі­цієнта непрозорості рівним 0 (рис. 13.1).

4. Настройте початковий кадр анімації.

а)  Перемістіть головку відтворення на перший кадр і виділіть на робочому полі екземпляр символу Текст.

б)  Виберіть пункт None (Немає) зі спливаючого списку ефек­тів кольору Color (Колір), якщо його не вибрано.

5. Створіть анімаційний ефект і перевірте його дію.

а)  Переконайтеся, що виділено перший кадр, і виберіть пункт Motion (Рух) зі спливаючого списку Tween (Побудова про­міжних кадрів) панелі Properties (Властивості). У такий спо­сіб буде створено анімацію типу «рух об’єкта».

б)  Щоб перевірити анімацію, установіть головку відтворення в перший кадр і натисніть клавішу Enter. Текст поступово зникатиме, перетворюючись із непрозорого на прозорий.

в)  Збережіть презентацію у файлі Вправа_13_1.

Для того щоб об'єкт з'являвся на екрані поступово, погрібно для екземпляра символу в кінцевому ключовому кадрі задати коефіцієнт непрозорості (Alpha) 100 %, а в початковому ключовому кадрі — 0 %.

6. Зробіть так, щоб голосні літери слова «Зникнення» по- ВҐ ступово зникали з екрана, а приголосні тим часом з яв­лялися. Збережіть презентацію у файлі Вправа_13_1і.

До ефекту поступової появи можна додати ефект змінення роз­міру об’єкта. Тоді, якщо, наприклад, у кінцевому кадрі об’єкт трохи збільшити, складатиметься враження, ніби під час появи об’єкт до вас наближається.

За допомогою ефекту кольору Tint (Відтінок) панелі Properties (Властивості) можна створювати ефект поступового змінення кольору об’єкта.

Нарешті, для створення ефекту плавного нахиляння об’єкта за­даються значення параметра Skew (Нахил) на вкладці Transform (Перетворення) панелі Align & Info & Transform (Вирівнювання, ін­формація і перетворення). Цей ефект можна використати, нап­риклад, для створення анімації руки, що махає на прощання.

Практична робота (частина 1)

У цій практичній роботі буде розглянуто використання ані­мації для створення ефектів появи та зникнення растрових малюнків. Розташуємо посередині робочого поля поряд три фотографії (можна використати зображення з компакт-диска чи власні малюнки). Вони з’являтимуться одна за одною, і їх появу супроводжуватимуть дві смужки: одна над картинками, а друга під ними. Це створить додатковий візуальний ефект, що додасть презентації динамізму.

1. Створіть і підготуйте до роботи документ.

а)  Створіть новий документ Flash.

б)  Установіть частоту змінення кадрів — 24.

в)  Задайте розмір робочого поля — 800x600.

г)  Збережіть документ під назвою Практична_13_1.

2. Додайте до бібліотеки три растрові зображення.

а)  Імпортуйте в бібліотеку зображення, виконавши команду File ► Import ► Import То Library (Файл ► Імпортувати ► Імпортує ати в бібліотеку) та вказавши необхідні файли.

б)  Створіть у панелі Library (Бібліотека) папку з назвою Зобра­ження і перемістіть до неї три імпортовані картинки.

в)         Створіть графічний символ із назвою Зображення 1 і роз­містіть всередині нього першу картинку, обнуліть її коор­динати за допомогою полів X і Y на панелі Properties (Влас­тивості), як показано на рис. 13.2.

г) Створіть графічні символи Зображення 2 та Зображення 3 й роз­містіть у них інші дві картинки.

д)  Поверніться до основної часової шкали, скориставшись для цього кнопкою С=>.

3. Розмістіть зображення на робочому полі та часовій шкалі.

а)  Перейменуйте рівень Layer 1 на Зображення 1.

б)  Створіть ще два рівні Зображення 2 та Зображення 3, щоб кож­ний об’єкт мав свій рівень.

в)  Розмістіть екземпляр символу Зображення 1 у першому кад­рі рівня Зображення 1, екземпляр символу Зображення 2 — в першому кадрі рівня Зображення 2, а екземпляр символу Зображення 3 —-в першому кадрі рівня Зображення 3.

г)   Якщо зображення мають різні розміри, зробіть їх однако­вими за допомогою полів W (Ширина) та Н (Висота) на па­нелі Properties (Властивості).

д)         Розташуйте зображення посередині робочого поля, як пока­зано на рис. 13.3.

4. Створіть анімацію для першого зображення.

а)  Виділіть кадр 20 рівня Зображення 1 і створіть у ньому клю­човий кадр, натиснувши клавішу Р6.

б)  Поверніться до першого кадру і встановіть для екземпляра символу Зображення 1 нульове значення коефіцієнта непро­зорості.

в)  Виділіть перший кадр рівня Зображення 1 і виберіть пункт Motion (Рух) зі спливаючого списку Tween (Побудова проміж­них кадрів) на панелі Properties (Властивості).

5. Створіть анімацію для другого зображення, яке має з’явля­тися з невеликою затримкою після першого,

а)  Клацніть перший ключовий кадр рівня Зображення 2 і пе­ретягніть його в кадр 6. Часова шкала набуде такого ви­гляду, як на рис. 13.4.

б)  Виділіть кадр 26 рівня Зображення 2 і створіть у ньому клю­човий кадр, натиснувши клавішу F6.

в)  Поверніться до шостого кадру рівня Зображення 2 і встано­віть для екземпляра символу Зображення 2 нульове значення коефіцієнта непрозорості.

г)   Для кадру 6 рівня Зображення 2 виберіть пункт Motion (Рух)

зі спливаючого списку Tween (Побудова проміжних кадрів) на панелі Properties (Властивості).

6. Створіть анімацію для третього зображення, виконуючи ті самі дії, що й для другого, але у цьому випадку початко­вий кадр анімації для нього має розміщуватися у кадрі 12, а кінцевий — у кадрі 32. Тобто третє зображення має з’яв­лятися з невеликою затримкою після другого.
7. Створіть звичайні кадри на кожному рівні до кадру 35, щоб усі зображення були видимими на робочому полі після кадрів з анімацією. Для цього на кожному рівні виділіть кадр 35 і натисніть клавішу F5. Часова шкала набуде такого вигляду, як на рис. 13.5.
8. Додайте над зображеннями смужку, яка подовжуватиметься під час їхньої анімації.

а)  Створіть графічний символ Смужка і намалюйте в ньому пря­мокутник розміром 10x10 пікселів темно-синього кольору

без контуру (під час створення прямокутника для Stroke Color (Колір контуру) клацніть значок 0 — No Color (Немає кольору)).

б)  Поверніться до основної часової пікали.

в)  Створіть ще два рівні Верхня смужка та Нижня смужка.

г)  Виділіть кадр 6 рівня Верхня смужка і створіть у ньому по­рожній ключовий кадр, натиснувши клавішу F7.

д)         Розмістіть у цьому кадрі екземпляр символу Смужка, задай­те його розмір на панелі Properties (Властивості): ширина — 10 пікселів, висота — 1 піксел. Розташуйте символ над картинками. Його координата у має бути цілим числом, щоб смужка була чіткою, а координата х має бути такою самою, як у крайньої лівої картинки (рис. 13.6). Для вирівнювання зліва картинки і смужки слід виділити їх та клацнути кнопку & — Align left edge (Вирівняти ліву межу).

9. Створіть ефект подовження смужки.

а)  Виділіть кадр 32 рівня Верхня смужка та створіть у ньому ключовий кадр, натиснувши клавішу F6.

б)  Збільшіть у кадрі 32 ширину екземпляра символу Смужка таким чином, щоб він мав таку саму ширину, як ряд із трьох картинок.

в)  Виділіть початковий кадр анімації рівня Верхня смужка і на панелі Properties (Властивості) виберіть пункт Motion (Рух) зі спливаючого списку Tween (Побудова проміжних кадрів), щоб створити анімацію. Так буде додано одну смужку.

10. Додайте нижню смужку в той самий спосіб, що й для верх­ньої, але розташуйте її під картинками (рис. 13.7). Збере­жіть презентацію у файлі Практична_13_1 і перегляньте аніма­цію в режимі тестування.

11.  Створіть анімацію, у результаті якої всі елементи посту- в' пово зникатимуть: спершу ліва картинка, за нею цен­тральна, а потім — права. Тим часом смужки мають вкорочуватися зліва. Почніть цю анімацію з кадру 100, щоб глядач мав змогу переглянути зображення. Збе­режіть презентацію у файлі Практична_13_11.

Рух за траєкторією

В анімації типу «рух об’єкта» переміщення відбувається пря­молінійно. Проте часом виникає потреба рухати об’єкт уздовж заданої нелінійної траєкторії. У Flash для створення такого ру­ху використовують спеціальний рівень Motion Guide (Путівник Руху), який називатимемо рівнем траєкторії руху. У ньому можна намалювати траєкторію, уздовж якої буде рухатись анімований об’єкт. Цей рівень завжди має бути зв’язаний із рівнем, де міститься рухомий об’єкт (таких рівнів може бути кілька). Рівні, зв’язані з рівнем траєкторії руху, на часовій шкалі розміщуються під ним і трохи праворуч.

Щоб створити анімацію типу «рух об’єкта вздовж заданої тра­єкторії», слід виконати такі дії.

1. Створіть анімацію типу «рух об’єкта», яка б переміщувала об’єкт із однієї точки в іншу прямолінійно.
2. Створіть рівень траєкторії руху. Відкрийте контекстне меню того рівня, для якого потрібно ввести траєкторію руху, і ви­беріть з нього команду Add Motion Guide (Додати путівник руху) чи клацніть значок +4, розміщений внизу на часовій шкалі. Рівень траєкторії руху матиме таку саму назву, як і рівень, на якому міститься об’єкт, але із значком ^ Guide (Путівник) ліворуч (рис. 13.8).

3. Намалюйте траєкторію на рівні траєкторії руху. Це може бути довільна крива, намальована інструментом Line (Лінія), Реп (Ручка), РепсіІ (Олівець), Oval (Еліпс), Rectangle (Прямокут­ник), PolyStar (Багатокутник/Зірка) чи Brush (Пензлик). Рівень траєкторії руху (а відтак, і криву) можна бачити лише в се­редовищі редагування.
4. Зв’яжіть центр анімованого об’єкта з траєкторією в почат­ковому і кінцевому ключових кадрах. Для цього виберіть перший ключовий кадр анімації та переконайтеся, що на панелі Properties (Властивості) встановлено прапорець Snap (Прищепити). За допомогою інструмента Selection (Виділення) перетягніть об’єкт на початковому та кінцевому кадрах так, щоб його точки прив’язки збігалися з початком і кінцем траєкторії.
5. Установіть прапорець Orient to path (Орієнтуватися на шлях) на панелі Properties (Властивості), якщо ви хочете, щоб об’єкт під час переміщення повертався відповідно до змін кута траєкторії руху.

У такий спосіб об’єкт рухатиметься вздовж траєкторії.

Практична робота (частина 2)

Створимо анімацію літачка, що робить «мертву петлю».

1. Створіть новий документ Flash, задайте частоту змінення кадрів — 24 та розмір робочого поля — 800x600.
2. Створіть графічний символ із назвою Літачок і намалюйте S' в ньому такии літачок, як на рис. 13.9, скориставшись інструментом Line (Лінія), або скопіюйте зображення з презентації Вправа_10_1!.

3. Створіть початковий кадр анімації.

а)         Поверніться до основної часової шкали. Перейменуйте рі­вень Layer 1 на Анімація літачка.

б)  Зробіть порожній ключовий кадр рівня Анімація літачка ак­тивним, клацнувши його мишею.

в)  Перетягніть на робоче поле з панелі Library (Бібліотека) ек­земпляр символу Літачок.

г)   Зменшіть літачок пропорційно, якщо він завеликий; його довжина має складати приблизно 100 пікселів.

д)  Розмістіть зображення зліва на робочому полі (рис. 13.10).

4. Створіть ефект прямолінійного руху літачка.

а)  Виділіть кадр 40 рівня Анімація літачка.

б)  Створіть ключовий кадр, натиснувши клавішу F6; його вміст буде таким самим, як і в першого ключового кадру.

в)  Змініть положення літачка в кадрі 40, перетягнувши його у праву частину робочого поля (рис. 13.11).

г)   Виділіть початковий кадр і на панелі Properties (Властивості) виберіть пункт Motion (Рух) зі спливаючого списку Tween (Побудова проміжних кадрів). У такий спосіб ви створите анімацію типу «рух об’єкта» (рис. 13.12).

5. Тепер виділіть рівень Анімація літачка та виконайте команду Add Motion Guide (Додати путівник руху) з його контекстного меню, щоб додати до цього рівня рівень траєкторії руху. В результаті часова шкала набуде такого вигляду, як пока­зано на рис. 13.13.

6. Щоб літачок виконував «мертву петлю», створіть для нього на відповідному рівні траєкторію, уздовж якої він рухати­меться.

а)  Виберіть інструмент Pencil (Олівець) У на панелі Tools (Ін­струменти).

б)  Виберіть рівень згладженості Smooth (Гладкий) у секції Op­tions (Параметри) панелі Tools (Інструменти). Для цього ско­ристайтеся значком Ч„.

в)  Виділіть рівень траєкторії руху.

г)         Намалюйте на робочому полі траєкторію, схожу на ту, що зображено на рис. 13,14.

7. Зв’яжіть центр літачка з траєкторією в початковому і кін­цевому ключових кадрах.

а)  Виберіть перший ключовий кадр анімації та на панелі Pro­perties (Властивості) встановіть прапорець Snap (Схопити) (якщо його ще не було встановлено). Літачок прикріпиться до траєкторії.

б)  Перетягніть літачок за допомогою інструмента Selection (Виділення) так, щоб його точка прив’язки збігалася з по­чатком траєкторії.

в)  Виділіть кінцевий ключовий кадр анімації.

г)   Перетягніть літачок за допомогою інструмента Selection (Ви­ділення) так, щоб його точка прив’язки збігалася з кін­цевою точкою траєкторії.

8. Перевірте, як рухається літачок, встановивши головку від­творення в перший кадр і натиснувши клавішу Enter. Якщо він рухається не за побудованою траєкторією, ще раз перевір­те, чи дотримано всіх вимог попередніх пунктів практичної роботи. Зверніть увагу на положення точок прив’язки.
9. Ви, мабуть, звернули увагу на те, що літачок не перевер­тається у повітрі під час виконання фігури пілотажу. Щоб він повертався відповідно до змінення напряму траєкторії руху, слід установити прапорець Orient to path (Орієнтуватися на шлях) на панелі Properties (Властивості).
10. Установіть значення 50 для параметра Ease (Уповільнювати), щоб анімація вповільнювалася наприкінці. Для цього виді­літь перший кадр рівня Анімація літачка і скористайтеся па­неллю Properties (Властивості). Збережіть документ під назвою Практична_13_2 та перегляньте його в режимі тестування. Траєкторія руху в SWF-файлі буде невидимою.
11. Створіть анімацію для пілота, який зістрибуватиме з лі­тачка під час виконання маневру та плавно спускати­меться на парашуті. Збережіть документ у файлі Практич- на_13_2!.

Використання масок

Як відомо, маску використовують для того, щоб приховати те, що знаходиться під нею. У Flash маски використовують із тією самою метою. Для цього призначено спеціальний рівень Mask (Маска), який назвемо рівнем маски. Він забезпечує вибірко­ве приховування елементів, розміщених на зв’язаних із ним рівнях (на часовій шкалі їх розташовано під рівнем маски та дещо зміщено праворуч). Відтак, щоб досягти ефекту прихо­вування, рівень маски використовують разом із замаскованим рівнем або кількома.

У разі використання рівня маски всі об’єкти замаскованих рів­нів приховані, крім ділянок, розміщених під об’єктами рівня маски. Для створення маски можна використати екземпляр символу, текст або будь-який, окрім ліній, графічний об’єкт (один чи кілька). Маски можуть бути як анімованими, так і ста­тичними.

Маски мають певні обмеження:

• для анімації об’єктів рівня маски не можна використовува­ти траєкторію руху,
• не можна маскувати рівні на часовій шкалі кнопки.

Створення маски відбувається за такою схемою.

1. Додайте новий рівень над рівнем, для якого потрібно ство­рити маску.
2. Створіть на новому рівні об’єкт, що виконуватиме функцію отвору, через який буде видно вміст замаскованого рівня.
3. Перетворіть цей рівень на рівень маски, вибравши з його контекстного меню команду Mask (Маска).

Після її виконання рівень маски та замаскований рівень буде заблоковано (рис. 13.15). У результаті на робочому полі відоб­ражатиметься лише та частина вмісту замаскованого рівня, яку видно через об’єкти рівня маски.

Щоб змінити вміст рівня маски чи замаскованого рівня, потріб­но розблокувати їх, скориставшись значком, що надає можли­вість редагувати ці рівні Ш. Щоб перевірити результат маску­вання, заблокуйте рівень маски та замаскований рівень знову.

Після створення рівня маски з ним буде зв’язано лише один рівень — той, на який накладено маску. Проте маску можна накладати й на кілька рівнів. Щоб зв’язати з рівнем маски ще один рівень, потрібно його перетягнути під рівень маски. Щоб позбавити рівень від впливу рівня маски, слід вибрати його та перетягнути вище чи нижче рівня маски, так, щоб його назву не було зміщено праворуч.

Вправа 13.2

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

1. Створіть новий документ Flash та імпортуйте в нього зобра­ження з файлу fly-agaric.jpg на компакт-диску.
2. Створіть символ з маскованим зображенням і екземпляр цьо­го символу.

а)         Створіть новий символ типу відеокліп (Movie clip) із назвою Картинка з маскою.

б)         Перейменуйте рівень Layer 1 символу на Картинка та роз­містіть у першому кадрі цього рівня растрове зображення (рис. 13.16).

3. Створіть новий рівень над рівнем Картинка з іменем Маска.
4. Намалюйте на рівні Маска прямокутник із заокругленими ку­тами (радіус заокруглення має дорівнювати 20 пікселам) до­вільного кольору, розмістіть його понад картинкою, як по­казано на рис. 13.17. .
5. Перетворіть рівень Маска на рівень маски, скориставшись командою Mask (Маска) контекстного меню.

У результаті рівень Картинка перетвориться на замаскований рівень, а рівень Маска — на рівень маски. На робочому полі видимою буде лише та частина зображення, яку розміщено під прямокутником (рис. 13.18). Видиме зображення матиме заокруглені кути.

Збережіть презентацію у файлі Вправа_13_2.

6. Змініть маску так, щоб залишався видимим лише сам гриб. Збережіть презентацію у файлі Вправа_13_2!.

У цій вправі ви створили статичну маску. Проте маски вико­ристовують і в анімації. Анімувати можна як вміст замаско­ваних рівнів, так і вміст рівня маски. Спробуємо використати маски в анімації у третій частині практичної роботи.

Практична робота (частина 3)

Створимо ефект, який дає змогу бачити зображення крізь текст. Тобто текст розміщуватиметься на рівні маски і виконуватиме роль отвору, через який можна побачити вміст замаскованого рівня. Цей рівень буде містити анімацію смужки, яка рухати­меться зліва направо. У результаті текст поступово буде прояв­лятися. Для створення ефекту виконайте такі дії.

1. Створіть новий документ Flash і встановіть частоту змінен- ня кадрів — 24.
2. Створіть текстове поле за допомогою інструмента Text (Текст). Уведіть у нього текст Використання маски в анімації. Виділіть текстове поле і задайте для нього такі параметри на панелі Properties (Властивості):

• шрифт — Tahoma;
• розмір — 26;
• колір — чорний;
• стиль тексту — bold.

3. Настройте рівень, що згодом стане рівнем маски.

а)  Змініть назву рівня Layer 1 на Текст.

б)         Виділіть кадр 20 рівня Текст і натисніть клавішу F5, щоб створити в ньому звичайний кадр (рис. 13.19).

4. Створіть символ смужки, яку буде видно крізь текст.

а)  Створіть новий графічний символ під назвою Смужка.

б)  На робочому полі символу (на рівні Layer 1) намалюйте пря­мокутник розміром 30x30 пікселів без контуру із заливкою кольору #0А50А1. Обнуліть його координати.

в)  Створіть на цьому рівні ще один прямокутник такого са­мого розміру, але з лінійною градієнтною заливкою, лівий вказівник якої матиме колір #0А50А1, а правий — той самий колір, але з коефіцієнтом непрозорості 0 %.

г)         Задайте для другого прямокутника такі координати: х — ЗО пікселів, у — 0. Два прямокутники зливатимуться в один, ліву половину якого буде зафарбовано в темно-си­ній колір, а заливка правої плавно переходитиме від темно- синього кольору до прозорої заливки (рис. 13.20).

5. Створіть екземпляр символу Смужка.

а)  Поверніться до основної часової шкали.

б)  Створіть новий рівень Градієнтна смужка та розмістіть його під рівнем Текст.

в)  Виділіть перший кадр рівня Градієнтна смужка та розмістіть у ньому екземпляр символу Смужка.

6. Створіть кінцевий кадр анімації екземпляра символу Смужка.

а)  Виділіть кадр 20 і створіть у ньому ключовий кадр, натис­нувши клавішу Р6.

б)         Розмістіть смужку в кадрі 20 на початку текстового поля і змініть її ширину так, щоб вона була вдвічі більшою за ширину текстового поля (рис. 13.21).

7. Тепер створіть початковий кадр анімації екземпляра символу Смужка.

а)  Поверніться до першого ключового кадру і змініть ширину та значення координати у екземпляра символу Смужка на ті, що були встановлені у кадрі 20;

б)  Розмістіть смужку ліворуч від текстового поля (рис. 13.22).

8. Створіть анімаційний ефект. Виділіть початковий кадр або один із проміжних кадрів і виберіть пункт Motion (Рух) зі спливаючого списку Tween (Побудова проміжних кадрів) панелі Properties (Властивості).
9. Виділіть рівень Текст і перетворіть його на рівень маски за допомогою команди Mask (Маска) контекстного меню рівня. Часова шкала набуде вигляду, як на рис. 13.23.

10. Збережіть документ у файлі Практична_13_3 та перегляньте його в режимі тестування. У першому кадрі текст буде не­видимий, а в останньому — видимий і матиме темно-синій колір. У проміжних кадрах текст поступово набуватиме за­барвлення (рис. 13.24). Фактично ми бачимо, як під тексто­вим полем рухається градієнтна смужка.

11. Створіть ефект «лелітки»: текст має бути видимим, але по ньому бігтиме вузька смужка яскравішого кольору. Збережіть документ у файлі Практична_13_3!.

6. Застосування отриманих знань

Вправи 11.1-11.3

7.  Підбиття підсумків уроку

8. Домашнє завдання

1. Вивчити конспект.
2. Виконати завдання.

1.  Запишіть три твердження — основні тези вашої презентації. Розмістіть їх на робочому полі одне під одним, вирівнявши за лівим краєм. Створіть анімацію, в результаті якої твер­дження з’являтимуться одне по одному.
2. Створіть анімацію, яка б імітувала рух маятника: підвіше­ної на нитці кульки. Не забудьте змоделювати прискорення.
3. Візьміть фотографію свого класу, родини чи друзів або будь- яку іншу. Виберіть на ній 2-4 фрагменти, які вам подоба­ються. Розмістіть понад ними кола, що виконуватимуть функцію масок. Створіть анімацію кіл, в результаті якої кола поступово збільшуватимуться одне за одним, відкри­ваючи глядачеві фрагменти фотографії.

Зауважте, що для створення кількох анімованих масок у формі кіл вам знадобиться більше ніж один рівень маски. Для кожного кола використовуйте рівень маски зі зв’язаним із ним рівнем, на якому розміщено фотографію. Якщо ви пла­нуєте показати три фрагменти фото, вам знадобиться три пари рівнів.

4. Створіть документ Flash, що міститиме ефект перегляду фо­топлівки. Для цього слід використати рівень маски, який маскуватиме фотоплівку, показуючи лише один її кадр. Функцію маски виконуватиме прямокутник, який матиме розмір одного зображення фотоплівки. А вміст фотоплівки імітуватиме символ, в якому слід розмістити вертикально одне під одним растрові зображення, наприклад ті, що ми використовували в цьому розділі.

Для створення ефекту перегляду помістіть фотоплівку на замаскований рівень і створіть анімацію, в результаті якої кожен кадр затримуватиметься під маскою на кілька се­кунд, а потім фотоплівка плавно підніматиметься вгору, ховаючи попереднє фото і показуючи наступне. Перегляд фотоплівки має бути циклічним, тобто, коли плівка дохо­дитиме до кінцевого кадру, має відображатися перший.