Техника анимации в Fireworks MX. Соединение.
После того как вы получили некоторое представление и простейшие навыки, займемся созданием анимации с помощью Fireworks MX, что позволит вам освоить всю мощь этого приложения.
В Fireworks MX можно создавать эффектные ролики, которые можно разместить непосредственно в Web или экспортировать во Flash MX.
В этом разделе вы освоите технику использования графических символов и передачи их во Flash MX. Мы сфокусируем внимание на работе с объектами. Вы создадите рекламный баннер из графического символа и освоите интересный эффект.
Соединение
Соединение (tweening) – это процесс, при котором программа создает промежуточные состояния для некоторого объекта исходя из его начального и конечного состояния. Лучше всего это делать с графическими символами. Например, для того чтобы получить изображение сжимающегося объекта, вы создаете его обычное изображение и уменьшенное до 10%. Программа соединяет эти два изображения, создавая некоторое количество промежуточных. Для того чтобы создать соединение, выполните следующее.
- Скопируйте папку с упражнениями для главы 14с Web-узла этой книги. Откройте файл Tweening.png. Там вы увидите изображение большого красного ботинка. Щелкните на этом ботинке. В нижнем левом углу рисунка появится стрелка, означающая, что этот рисунок является символом из библиотеки.
- Скопируйте и вставьте ботинок на холст. Появится новый экземпляр ботинка, который останется выделенным. Перетащите его от оригинала и оставьте выделенным.
- Выберите инструмент Scale и перетащите угловой маркер ботинка так, чтобы уменьшить его. Оставив его выделенным, выберите Modify › TransfomT › Numeric Transform. В открывшемся диалоговом окне выберите в списке Rotate и введите в числовое поле значение 270. Меньший ботинок должен повернуться. Щелкните на кнопке ОК.
- Перетащите маленький ботинок в центр большого. Нажмите клавишу SHIFT и щелкните на большом ботинке. Оба экземпляра должны быть у вас выделенными. Выберите в меню Modify › Symbol › Tween Instances. Откроется диалоговое окно, показанное на рис. 14.14.
- Введите число 10 и установите флажок Distribute to Frames. Щелкните на кнопке ОК.
- Откройте панель Frames и убедитесь, что теперь ваш ролик содержит 10 кадров. Воспроизведите ролик, щелкнув на кнопке Play. Ботинок должен вращаться и сжиматься.
Рис. 14.14. В этом окне можно задать число кадров для анимации
Этот ролик можно отредактировать. Например, вы можете добавить логотип компании JCT и сделать так, чтобы маленький ботинок перемещался в нижний правый угол.
- Выберите последний кадр ролика. Нажмите клавишу ALT и, удерживая ее, перетащите копию ботинка в нижний правый угол кадра.
- Выберите инструмент Scale и предельно уменьшите копию.
- Выделите маленький ботинок и щелкните, удерживая нажатой клавишу SHIFT, на ботинке, который расположен посредине рабочей области. Соедините два этих экземпляра (Modify › Symbol › Tween Instances) и установите флажок Distribute to Frames. Воспроизведите ролик.
- Выберите 1 – и кадр и перетащите на холст символ логотипа из библиотеки. Когда логотип будет выделен, выберите Copy to Frames в панели Frames. Установите диапазон кадров с 2-го по 20-й в диалоговом окне Copy to Frames. Щелкните на кнопке ОК.
- Воспроизведите ролик. Теперь логотип виден в каждом кадре.
Можно добавить материал и в середину ролика. Например, вам нужно, чтобы по экрану перемещалось слово Shoe. Для этого сделайте следующее.
- Выберите 11-й кадр. Выберите инструмент Text, щелкните на холсте и введите слово Shoe. Установите шрифт Arial Black, размером 36 пунктов.
- Щелкните на слове правой кнопкой мыши и выберите в контекстном меню Convert to Symbol. В открывшемся диалоговом окне задайте имя объекта и установите для него свойство Graphic.
- Перетащите экземпляр слова за левый край холста. Оставив слово выделенным, скопируйте его и перетащите копию на середину холста.
- Выделите оба экземпляра, щелкнув на них и одновременно нажав клавишу SHIFT, и соедините их, как раньше. Для числа кадров установите значение 8.
- Щелкните на кнопке ОК и воспроизведите ролик. Сохраните файл.