У цьому уроці ви навчитеся, як зробити цікавий ефект перегортання сторінок у флеш. Цей ефект схожий на розглянутий раніше Ефект наклейки.
Для цього уроку я використовував програму Adobe Flash CS4.
1 Створюємо новий документ з потрібними параметрами.
2 Імпортуємо в бібліотеку програми зображення, які ми будемо перегортати, у мене їх два.
3 Перетаскуємо на сцену програми перше зображення, яке ми хочемо перегорнути і виставляємо його по центру нашої сцени.
4 Вибираємо поміщене зображення і перетворюємо його в "Фрагмент ролика", натискаючи кнопку "F8" і називаємо його "image_1".
5 Створюємо новий шар, перебуваючи на ньому вибираємо інструмент "Прямокутник (R)", скасовуємо його обведення, встановлюємо колір заливки трохи темніше білого (дивлячись в який колір ви хочете пофарбувати виворіт сторінки), я використовував колір # E6E6E6 і малюємо їм прямокутник розмірами. як наше зображення або сцена і виставляємо його по центру сцени на нульові позиції по осях "Х" та "У" (це можна зробити в панелі "Властивості", при виборі намальованого прямокутника інструментом "Часткове виділення (V)".
6 Поки наш прямокутник все ще обраний, натискаємо кнопку "F8", щоб створити "Фрагмент ролика" і називаємо його "image_2".
7 Вибираємо щойно створений кліп і переміщаємо його зліва від сцени, впритул до неї (положення щодо осей можна також виставити в панелі властивостей).
8 Створюємо новий шар і перебуваючи на цьому шарі, вибираємо інструмент "Прямокутник (R)", скасовуємо його обведення, встановлюємо будь-який колір заливки (я вибрав зелений) і малюємо їм прямокутник, поміщаємо його рівно над кліпом "image_2" (розміри і положення щодо осей можна також виставити в панелі властивостей).
9 Створюємо новий шар, називаємо його "Маска" і перебуваючи на ньому також інструментом "Прямокутник (R)" з скасованої обведенням і будь-яким кольором заливки (я вибрав червоний) малюємо їм прямокутник, поміщаємо його рівно над кліпом зеленим прямокутником (розміри і положення щодо осей можна також виставити в панелі властивостей).
10 Створюємо порожні кадри на 30 кадрі всіх верств, натискаючи кнопку "F5".
11 Скасовуємо видимість шару (Маска) і (Шар 3), для цього натискаємо по маркеру під значком очі, переходимо на 30 кадр шару (Шар 2), натискаємо кнопку "F6", щоб створити ключовий кадр і переміщаємо другий кліп "image_2" по ліву сторону від сцени.
12 Перебуваючи на шарі (Шар 2) натискаємо правою кнопкою миші по області між 1 і 30 кадрами і зі списку вибіраес "Створити класичну анімацію руху".
13 Повертаємося на шар (Шар 3), включаємо видимість шару, вибираємо зелений прямокутник і заповнюємо його лінійним градієнтом.
14 Тепер налаштовуємо градієнт:
вибираємо перший маркер градієнта і встановлюємо його колір, як і у другого мувіка (у мене він кольором # E6E6E6).
вибираємо другий маркер і встановлюємо його трохи темніше першого (я вибрав # 626262).
15 Вибираємо інструмент "Перетворення градієнта (F)" і звужує їм наш градієнт, потім все темже інструментом зміщуємо градієнт впритул до правого краю прямокутника.
16 Створюємо ключовий кадр на 30 кадрі третього шару (Шар 3), натискаючи кнопку "F6" і перетягуємо наш прямокутник з градієнтом впритул праворуч головної сцени, як показано на малюнку.
17 Перебуваючи на 30 кадрі тогоже шару, вибираємо інструмент "Перетворення градієнта (F)", затисніть центр градієнта і перетягніть його на сцену впритул до лівого краю.
18 Перебуваючи на томже шарі натискаємо правою кнопкою миші по області між 1 і 30 кадрами і зі списку вибираємо "Створити анімацію форми".
19 Переходимо на шар (Маска), вибираємо 30 кадр і створюємо на ньому ключовий кадр натискаючи кнопку "F6", потім включаємо видимість шару (Маска), натискаючи на закреслений маркер і перебуваючи на 30 кадрі перетягуємо наш прямокутник по центру сцени, щоб він закривав наше зображення, що знаходиться на першому шарі, потім створюємо "Анімацію форми" між 1 і 30 кадрами.
20 Кількома правою кнопкою миші по шару (Маска) і зі списку вибираємо "Маска".
21 Вибираємо 1 шар, потім затискаємо кнопку "Shift" і вибираємо другий шар, тим самим ми вибрали 2 шари відразу.
22 Коли два шари обрані перетягуємо їх і поміщаємо над шаром (Маска), потім відпускаємо кнопку миші, потім знову затискаємо кнопку миші і перетягуємо ці шари на старе місце. В результаті шари візьмуть вигляд:
23 Вибираємо всі кадри на всіх шарах, натискаємо правою кнопкою миші та оберіть зі списку вибираємо "Звернути кадри".
Для більш тривалого показу першого зображення можна додати додаткові кадри перед перегортанням, для цього просто виділяємо всі кадри на всіх шарах крім першого і перетягуємо їх вправо, а на першому шарі створюємо порожній кадр "F5" там, де будуть стояти останні ключові кадри інших верств. Чим далі ви перетягніть виділені кадри по часовій шкалі, тим довше буде показуватися зображення без перегортання.
24 Тепер треба зробити так, щоб коли сторінка перегортається була видна наступна сторінка, для цього створюємо новий шар зверху останнього шару "Маска", щоб він не став "маскируемое", потім перетягуємо його під найперший шар.
25 Перебуваючи на цьому шарі створюємо ключовий кадр на 26 кадрі, натискаючи кнопку "F6" і перебуваючи на цьому кадрі перетягуємо з бібліотеки програми на сцену друге зображення і в панелі "Властивості" виставляємо його по центру сцени. В результаті при при гортанні сторінки буде видно наступна сторінка.
На цьому урок закінчений, можна протестувати, що у нас вийшло "Управління -> Тестувати ролик".