Web-разработка с Macromedia Studio MX



Соединение


Соединение (tweening) — это процесс, при котором программа создает промежуточные состояния для некоторого объекта исходя из его начального и конечного состояния. Лучше всего это делать с графическими символами. Например, для того чтобы получить изображение сжимающегося объекта, вы создаете его обычное изображение и уменьшенное до 10%. Программа соединяет эти два изображения, создавая некоторое количество промежуточных. Для того чтобы создать соединение, выполните следующее.
1. Скопируйте папку с упражнениями для главы 14с Web-узла этой книги. Откройте файл Tweening.png. Там вы увидите изображение большого красного ботинка. Щелкните на этом ботинке. В нижнем левом углу рисунка появится стрелка, означающая, что этот рисунок является символом из библиотеки.
2. Скопируйте и вставьте ботинок на холст. Появится новый экземпляр ботинка, который останется выделенным. Перетащите его от оригинала и оставьте выделенным.
3. Выберите инструмент Scale и перетащите угловой маркер ботинка так, чтобы уменьшить его. Оставив его выделенным, выберите Modify=>TransfomT=>Numeric Transform. В открывшемся диалоговом окне выберите в списке Rotate и введите в числовое поле значение 270. Меньший ботинок должен повернуться. Щелкните на кнопке ОК.
4. Перетащите маленький ботинок в центр большого. Нажмите клавишу <Shift> и щелкните на большом ботинке. Оба экземпляра должны быть у вас выделенными. Выберите в меню Modify=>Symbol=>Tween Instances. Откроется диалоговое окно, показанное на рис. 14.14.
5. Введите число 10 и установите флажок Distribute to Frames. Щелкните на кнопке ОК.
6. Откройте панель Frames и убедитесь, что теперь ваш ролик содержит 10 кадров. Воспроизведите ролик, щелкнув на кнопке Play. Ботинок должен вращаться и сжиматься.



Рис. 14.14. В этом окне можно задать число кадров для анимации

Этот ролик можно отредактировать. Например, вы можете добавить логотип компании JCT и сделать так, чтобы маленький ботинок перемещался в нижний правый угол.
1. Выберите последний кадр ролика. Нажмите клавишу <Alt> и, удерживая ее, перетащите копию ботинка в нижний правый угол кадра.
2. Выберите инструмент Scale и предельно уменьшите копию.
3. Выделите маленький ботинок и щелкните, удерживая нажатой клавишу <Shift>, на ботинке, который расположен посредине рабочей области. Соедините два этих экземпляра (Modify=>Symbol=>Tween Instances) и установите флажок Distribute to Frames. Воспроизведите ролик.
4. Выберите 1 -и кадр и перетащите на холст символ логотипа из библиотеки. Когда логотип будет выделен, выберите Copy to Frames в панели Frames. Установите диапазон кадров с 2-го по 20-й в диалоговом окне Copy to Frames. Щелкните на кнопке ОК.
5. Воспроизведите ролик. Теперь логотип виден в каждом кадре.
Можно добавить материал и в середину ролика. Например, вам нужно, чтобы по экрану перемещалось слово Shoe. Для этого сделайте следующее.
1. Выберите 11-й кадр. Выберите инструмент Text, щелкните на холсте и введите слово Shoe. Установите шрифт Arial Black, размером 36 пунктов.
2. Щелкните на слове правой кнопкой мыши и выберите в контекстном меню Convert to Symbol. В открывшемся диалоговом окне задайте имя объекта и установите для него свойство Graphic.
3. Перетащите экземпляр слова за левый край холста. Оставив слово выделенным, скопируйте его и перетащите копию на середину холста.
4. Выделите оба экземпляра, щелкнув на них и одновременно нажав клавишу <Shift>, и соедините их, как раньше. Для числа кадров установите значение 8.
5. Щелкните на кнопке ОК и воспроизведите ролик. Сохраните файл.
Воспроизведение ролика Fireworks MX во Rash MX
Fireworks MX полностью интегрировано с Flash MX. Вы можете с помощью одного щелчка экспортировать векторную графику, ролики, графические кнопки из Fireworks во Flash. Это дает вам большую гибкость, позволяя выполнять дизайн в Fireworks, и использовать результаты во Flash. Это особенно полезно и удобно, когда вам нужно создать векторные и растровые рисунки.
Для того чтобы воспроизвести во Flash ролик, созданный в Fireworks, выполните следующее.
1. Открыв ролик в Fireworks, щелкните на кнопке Quick Export и выберите в меню Macromedia Flash=>Launch Macromedia Flash.
2. Когда Flash откроется, выберите в меню File=>Import и найдите файл ролика. Выделите файл в диалоговом окне Import и щелкните на кнопке Open. Откроется диалоговое окно, представленное на рис. 14.15.
3. Настройте параметры этого окна, как показано на рис. 14.15. Проследите, чтобы флажок Import as a single flattened bitmap был сброшен. Щелкните на кнопке ОК.
Ролик попадет в 1-й кадр на шкале времени. Если вы откроете библиотеку символов Flash, то увидите два графических символа и папку Fireworks Objects. Ваш ролик находится в этой папке.
4. Откройте папку и дважды щелкните на ролике. Когда откроется символ, нажмите клавишу <Enter>, и ролик воспроизведется.



Рис. 14.15. В этом диалоговом окне можно экспортировать ролик во Flash MX