Урок 14

Тема: Створення кнопок.

Мета: Відпрацювати з учнями навички створення кнопок.

Теоретичні відомості

Розглянемо створення і використання кнопок - найпростіших елементів керування, наданих Flash. Кнопки використовуються дуже часто, і не тільки в додатках, але й у звичайних інтерактивних фільмах Flash, наприклад, для створення Web-сайтів.

Створення кнопок.

Щоб створити зразок-кнопку, зробіть наступне. Виберіть пункт New Symbol у меню Insert або натисніть комбінацію клавіш <Ctrl>+<F8>. Якщо у вас відкрите вікно бібліотеки, ви також можете вибрати пункт New Symbol у додатковому меню цього вікна. На екрані з'явиться діалогове вікно Create New Symbol. Введіть у поле Name ім'я створюваного зразка, ввімкніть перемикач Button у групі Behavior і натисніть кнопку ОК.

Після всього цього, як ви знаєте, Flash відкриє створений зразок у режимі редагування. Вам залишиться намалювати вашу кнопку.

Але не поспішаєте це робити. Подивимося уважно на тимчасову шкалу Рис.1. Добре видно, що кнопка - це насправді кліп, який складається з чотирьох кадрів, точніше, не кадрів, а розділів тимчасової шкали. Це дуже дивні кадри: усі вони мають підпис: Up, Over, Down і Hit.

Рис.1. Чотири кадри, з яких складається кнопка

Справа в тому, що ці кадри містять зображення, що будуть виведені Flash на робочому листі в різних випадках. Давайте їх перелічимо:

· зображення, що знаходиться в кадрі up, з'являється, коли кнопка не натиснута, і курсор миші не розташований над нею;

· зображення, що знаходиться в кадрі over, з'являється, коли курсор миші розташований над кнопкою, але сама кнопка не натиснута;

· зображення, що знаходиться в кадрі Down, з'являється в той момент, коли користувач натискає ліву кнопку мишки;

· останнє зображення (кадр Hit) задає область, що буде відгукуватися на натискання миші ("гарячу" область кнопки). Це зображення ніколи не відображається Flash.

Виділіть кадр up і намалюйте зображення кнопки. Нехай вона буде овальною. Після цього виділіть розділ тимчасової шкали over і помістіть туди новий основний кадр, вибравши пункт Keyframe меню Insert або пункт Insert Keyframe контекстного меню. Після цього Flash автоматично скопіює намальоване в першому кадрі зображення в новий кадр кнопки, вам залишиться тільки його підправити. Якщо ви хочете цілком змінити зображення, створене в черговому кадрі кнопки, то потрібно буде вибрати пункт Blank Keyframe меню Insert або пункт Blank Insert Keyframe контекстного меню.

Намалюйте вміст інших двох кадрів кнопки. Взагалі, вам необов'язково створювати всі чотири зображення. Ви можете намалювати одне-єдине зображення в кадрі up, після цього Flash автоматично перенесе це зображення в інші три кадри. Звичайно, така кнопка вийде "неживою", тобто не буде реагувати на натискання і рух миші.

От і все. Тепер поверніться в режим виправлення фільму і відкрийте вікно бібліотеки. Знайдіть у списку зразків тільки що створену вами кнопку і виділіть її. Ви можете "програти" кнопку, як кліп, натиснувши кнопку, що знаходиться в правому верхньому куті панелі попереднього перегляду зразків. Для відтворення можна також вибрати пункт Play контекстного чи додаткового меню вікна бібліотеки, а для зупинки - Stop.

Тепер перевіримо нашу кнопку в дії. Помістіть екземпляр кнопки на робочий лист. Клацніть по ньому мишею, щоб його виділити. Змініть розміри кнопки. Можете задати для неї яке-небудь перетворення, наприклад, повернути на 90° або зробити напівпрозорою.

Власне перевірити кнопку ви можете двома шляхами. По-перше, можна просто запустити програвання фільму. По-друге, можна скористатися ще однією цікавою особливістю Flash. Для цього ввімкніть пункт-перемикач Enable Simple Buttons у меню Control чи натисніть комбінацію клавіш <Ctrl>+<Alt>+<B>. Після цього кнопка буде "працювати" прямо на робочому листі Flash, без необхідності запуску програвання фільму.

Спробуйте помістити курсор миші над кнопкою і подивіться, як вона зміниться. Клацніть по кнопці. Як бачите, Flash прекрасно виконує свої обов'язки.

Ви можете прив'язувати звуки до кнопок. Причому, прив'язати свій звук можна до кожного стану кнопки, тобто коли курсор миші вкаже на кнопку, буде програний один звук, а при натисканні по кнопці - інший звук.

Насамперед, потрібні звуки необхідно імпортувати. Як це робиться, було докладно розказано. Помістіть їх прямо в бібліотеку і дайте їм імена, наприклад, buttonup і buttonOver. Якщо бажаєте, задайте для них параметри експорту.

Тепер відкрийте потрібний зразок-кнопку в режимі редагування. Додайте новий шар для звуків і виділіть його. Після цього виділіть конкретний розділ на шкалі анімації, в залежності від того, до якого стану кнопки ви хочете прив'язати звук. Так, якщо ви хочете прив'язати звук до стану Over (коли курсор миші вказує на кнопку), вам належить виділити розділ Over. Створіть новий порожній ключовий кадр. А після цього вам залишиться тільки перекинути потрібний звук на робочий лист.

Щоб прив'язати звуки відразу до двох станів кнопки (Оver або Down; звук прив'язувати не має змісту), буде краще створити для кожного звуку окремий шар. Таким чином, ви зможете краще керувати прив'язаними звуками.

Кнопки Flash мають ще одну цікаву особливість. Справа в тому, що "гаряча" область кнопки зовсім не обов'язково повинна збігатися із самою кнопкою. Кнопка може спрацьовувати, якщо користувач клацне зовсім по іншому місці на робочому листі. Це дозволяє створювати дуже цікаві і корисні речі, на зразок підказок, які з‘являються при наведенні на яке-небудь місце кліпу, та ін.

Контрольні запитання

 

1. Як створити кнопку?

2. Які чотири поля має редактор кнопки?

3. Яким чином можна додати звук до кнопки?

 

Практична частина

Завдання 1.

1. Завантажити програму Flash MX.

2. Створити кнопку у вигляді еліпса.

3. Використовуючи ActionScript написати сценарій для кнопки.

4. На робочому столі знаходиться квадрат. Натискаємо на кнопку - з‘являється коло.

 

Завдання 2.

1. Завантажити програму Flash MX.

2. Створіть інтерактивний фільм, використовуючи кнопки.