Иллюстрированный самоучитель по Web-разработке на Macromedia Studio MX

Создание анимированного экрана

Вы уже создали все необходимое для того, чтобы собрать и протестировать все приложение. Для этого нужно добавить в рабочую область символы слов и массированную строку с призывом (tag line).

1. После выполнения действий, описанных в предыдущем разделе, у вас должен быть открыт клип. Чтобы закрыть его, щелкните на кнопке Scene 1 над рабочей областью. Протащите указатель мыши по всем слоям 70-го кадра и добавьте новый кадр. Поскольку вы не будете использовать символ Background, заблокируйте слой, щелкнув на точке под значком Lock в слое Background. Если вы не собираетесь менять что-нибудь в слое, возьмите себе за правило блокировать этот слой, чтобы не внести в него случайных изменений.
2. Перенесите символ Hats в рабочую область в слое Hats и перемещайте ползунок воспроизведения до тех пор, пока слово Hats не станет видимым. Щелкните на символе Hats в рабочей области, выделив его, и перетащите его в верхний левый угол рабочей области так, чтобы первая буква слова касалась направляющих линий. Повторите то же самое с остальными символами, но разместите их так, как показано на рис. 12.28.

   
   Рис. 12.28. Конечное расположение символов в рабочей области. Ваши слои и шкала времени должны выглядеть так же

3. Перетащите символ Tag Line в рабочую область и поместите его внизу. Перемещайте ползунок воспроизведения вдоль временной шкалы так, чтобы слово стало видимым, а потом – в крайнее конечное положение.
4. Если вы сейчас все так и оставите, то все эти символы будут воспроизводиться постоянно. Для того чтобы изменить это, выделите символ Hats в рабочей области и установите флажок Play Once в окне свойств под кнопкой Loop. Повторите это со всеми символами в рабочей области, включая строку Tag Line.
5. Добавьте ключевой кадр в 53-м кадре слоя Logo и перетащите из библиотеки символ Logo в рабочую область, выровняв его по центру и добавив ключевой кадр в 60-м кадре. Добавьте последовательность Motion между ключевыми кадрами.
6. Выделите ключевой кадр в 53-м кадре, установите для параметра Alpha символа Logo значение 0 и уменьшите этот символ до 25%. После уменьшения символа проверьте, чтобы он был выровнен по центру, потому что иногда при изменении масштаба выравнивание меняется.

Итак, у вас все установлено. Символы расположены по местам и выполняют то, для чего были предназначены. Теперь необходимо сделать так, чтобы символы товаров исчезали с рабочей области с той же скоростью, с которой проявляется символ Logo.

1. Добавьте ключевые кадры в 53-й и 60-й кадры слоя Hats. Удерживая нажатой клавишу SHIFT, щелкните на двух ключевых кадрах, чтобы выделить интервал. Нажмите клавишу ALT и перетащите копию выделенных кадров на слой HatsFade.
2. Отключите видимость слоя HatsFade. Выделите символ Hats в 60-м кадре слоя HatsFade. В окне свойств установите для параметра Alpha значение 0. Снова щелкните на символе и с помощью клавиши управления курсором опустите его ниже базовой линии текстового блока.
3. Отключите видимость слоя Hats и включите видимость слоя HatsFade.
4. Выделите символ в слое HatsFade. С помощью клавиши управления курсором поднимите его выше верхнего края текстового блока. Включите видимость слоя Hats.
5. Повторите шаги 1-4 для всех оставшихся слоев.
6. Запустите клип, и вы увидите то, ради чего старались. Сохраните свою работу.