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

Лом титана 4 предложения


Создание танцующего человечка


В пакете Studio MX есть несколько очень полезных свойств, в том числе возможность создавать Flash-анимацию из рисунков, сделанных с помощью Fireworks MX. Это здорово облегчит нам жизнь, так как рисунки представлены художником в виде растровых изображений, а нам нужно преобразовать их в векторные.
Для того чтобы создать SWF-анимацию в Fireworks MX, выполните следующее.
1. Откройте все семь рисунков с позами танцующего человечка.
2. Создайте новый файл. При этом установите размеры холста 432x475 пикселей. Цвет холста сделайте прозрачным, а разрешение рисунка — 100 пикселей на дюйм.
Когда у вас на сцене появится новый холст, сохраните файл под именем DancerSequence.
3. Выберите файл Dancel.png и щелкните на человечке. Рисунок считается выделенным, если вокруг него появилась рамка (рис. 16.1). Скопируйте рисунок, выбрав в меню Edit=>Copy. Закройте этот рисунок и вставьте скопированное изображение в файл DancerSequence.
4. Когда вы будете вставлять рисунок в новый файл, вы можете получить предупреждающее сообщение, которое показано на рис. 16.2. В этом сообщении вас предупреждают, что разрешение рисунков не совпадает. Если вы щелкнете на кнопке Resample, то рисунок будет пересчитан с увеличением или с уменьшением разрешения. Этого не следует делать при работе с фотографией, потому что в любом случае при пересчете разрешения качество фотографии будет потеряно, но в нашем рисунке присутствуют только линии, поэтому не имеет особого значения, что вы выберете.
5. Размеры выделенного рисунка значительно
превосходят размеры холста. Для того чтобы устранить это несоответствие, выберите в меню View=>Magnification 25%. Выберите на панели инструментов инструмент Scale. Вокруг рисунка появятся маркеры изменения размеров. Подгоните размер рисунка под размер холста, перетаскивая угловой маркер. При этом удерживайте нажатой клавишу <Shift>, чтобы сохранить пропорции рисунка. Когда рисунок разместится на холсте, восстановите масштаб 100%.



Рис. 16.1. Когда вы выделяете рисунок в Fireworks, вокруг него появляется синяя рамка с маркерами по углам



Рис. 16.2. Предупреждение о том, что разрешения вставляемого рисунка и холста не совпадают. Не пересчитывайте разрешение, если работаете с фотографией

6. Вам нужно удалить белую область, чтобы уменьшить размеры рисунка при экспорте его в SWF. На панели инструментов в области Bitmap выберите инструмент Magic Wand (Волшебная палочка) и щелкните им на любом месте белой области. Выделенный участок будет окружен особой линией, которую называют marching ants (марширующие муравьи).
7. Выберите в меню Select=>Similar. Выделенная область расширится, заключив в себя все места с белым цветом (рис. 16.3). Удалите все белые области, выбрав в меню Edit=>Clear.
8. Откройте панель Frames, щелкните на списке и выберите в нем Add Frames. Откроется диалоговое окно. Добавьте 6 кадров и щелкните на кнопке ОК. Теперь на панели Frames должно быть 7 кадров.
9. Перейдите на 2-й кадр, щелкнув на нем в панели Frames.
10. Повторите шаги 3-7, вставляя в каждый кадр новый рисунок со следующей позой танцующего человечка.
11. Когда расстановка кадров закончена, экспортируйте всю последовательность в SWF-файл, выбрав в меню File=>Export. В списке Save As открывшегося диалогового окна выберите Macromedia Flash SWF (рис. 16.4). Назовите файл DancerSequence.swf и щелкните на кнопке ОК.
12. Сохраните файл DancerSequence.png и выйдите из Fireworks MX.



Рис. 16.3. Все белые области вокруг рисунка выделены

Замечание
Когда все рирунки, будут вставлены в свои кадры, проверьте последовательность, воспроизведя кадр окажется не на месте, то при воспроизведении это будет заметно. Поставьте его на место, перетащив куда нужно или установив в окне свойств для его координат X и Y значение 0.