или еще один шаг в развитии Flash-технологии

4-го марта Macromedia анонсировала новую версию Flash: Flash MX. A 15-го марта на www.macromedia.com уже была опубликована пробная версия Flash MX (от полной версии она отличается тем, что действует только 30 дней). Для интересующихся: стоит Macromedia Flash MX всего $499, а upgrade с предыдущей версии обойдется в $199.

Я, понятное дело, быстренько скачал этот продукт (весит он 46 Мб) и попробовал его в деле. Эта маленькая статья представляет собой обзор новых возможностей Flash MX, немного разбавленных моими комментариями.

Бросается в глаза деление Macromedia пользователей Flash на дизайнеров (designers) и разработчиков (developers). Стоит открыть окошко What's new, и тебе популярно объяснят в чем состоит выигрыш для дизайнеров и для разработчиков (ну ладно, ладно, назовем их "программистами"), а в предустановленных расположениях окошек (panel sets) присутствуют "заводские" настройки для designer-ов и developer-ов. В статье я решил такого деления не проводить, а просто перечислить новые возможности программы и немножко поделится опытом использования этих самых возможностей.

Начнем с совместимости. Вместе с новым Flash был выпущен и новый Flash Player 6 (примочка для браузеров, позволяющая проигрывать Flash-мультики). Он понадобится, чтобы наблюдать творения, созданные во Flash MX. Однако, как и в предыдущих версиях, вы спокойно можете экспортировать вашу анимацию для любой версии Flash Player-а, при этом будут использованы только возможности указанной версии. Формат авторских.fla файлов тоже изменился. Но есть возможность сохранять файлы в формате Flash 5. В случае, если вы использовали какие-то возможности Flash MX, программа выдаст вам список использованных новых "фич" и предупредит, что все они будут потеряны, если файл будет сохранен в формате Flash 5. В любом случае, никто не мешает для работы использовать Flash MX, а экспортировать во Flash 5. Большинство дизайнеров будут так поступать еще некоторое время, пока новый plug-in не получит достаточного распространения.

Хорошее (я бы сказал, обязательное) решение для больших Flash-фильмов - иерархические слои. Теперь слои (layers) можно укладывать в иерархическое дерево папок. В первый раз я подумал о такой возможности, когда увидел у одного парня 78 слоев в мультике, и вот она появилась! Ура!

Рис.1 - Иерархические слои

Заметно изменился интерфейс. Вместо Adobe-овских панелек с закладками появились "складывающиеся" панельки. Одним кликом мышки они разворачиваются или сворачиваются, экономя драгоценное место на экране. Мне это показалось довольно удобным, т.к. можно быстро перестраивать рабочее пространство. Появилась полезная панелька Properties (инспектор свойств), в которой можно изменять параметры любого выбранного объекта. Если ничего не выбрано, в ней отображаются свойства самого фильма. По сути, эта панелька заменила множество панелек, отвечающих за свойства текста, звука, символов, кадров, эффекты и т.д.

Рис. 2 - Панелька Properties

Достаточно серьезное новшество - поддержка специальных средств для людей с ограниченными способностями (по-английски это называется accessibility). Macromedia использует технологию Microsoft Active Accessibility (MSAA) в качестве интерфейса к специальным программам для таких людей. Теперь для объектов Flash можно назначать название, описание и сочетания клавиш, которые будут доступны инвалидам. К сожалению, эти возможности поддерживаются только во Flash Player 6 для Internet Explorer-а. В Netscape и других браузерах, не использующих IE-технологию, поддержка accessibility будет недоступна.

Еще одно значительное нововведение - импорт видеоклипов. Теперь видео можно импортировать практически в любом формате, причем Flash может изменить любые параметры этого видеоклипа, что позволит существенно сокращать размеры Flash фильмов. При импорте видеоклипа можно изменить его качество, размер и распределение по временной шкале во Flash.

Появились общие библиотеки (shared libraries). Теперь можно подключить такую общую библиотеку и использовать какие-либо символы во многих фильмах одновременно. Это позволит значительно сокращать размеры авторских файлов. Можно, например, импортировать видеоклип или звук в shared library, а потом использовать эти компоненты в разных.fla файлах.

Flash MX позволяет создавать шаблоны (templates) и использовать их в качестве заготовок для новых фильмов. Все что нужно сделать - сохранить Flash файл в качестве шаблона и далее выбрать File -> New from template... В пробной версии Flash были обнаружены некоторые достаточно функциональные шаблоны (презентация, опрос, слайд-шоу).

Теперь к новостям для любителей всего сложного (для программистов, то бишь:).
Конечно же вырос, окреп и поднялся над собой ActionScript. О новшествах этого компонента Flash можно написать отдельную большую статью. Добавились новые объекты, новые методы и переменные. Изменилась классификация объектов и функций. Теперь гораздо удобнее находить в дереве нужные возможности языка.

По прежнему существуют нормальный и экспертный режимы создания скриптов. Редактор стал намного удобнее. Появились функции автозаполнения, автоформата и автоматического размещения отступов. Подсветка синтаксиса (как и все остальное в редакторе) гибко настраивается.

Рис. 3 - Редактор ActionScript-а

Наконец-то появился нормальный отладчик (debugger), позволяющий ставить breakpoint-ы и осуществлять пошаговую отладку.

Рис. 4 - Отладчик

В новом Flash есть встроенные компоненты пользовательского интерфейса (UI Components) - кнопки, списки, полосы прокрутки и т.д., причем для каждого из этих элементов существует свой класс в языке ActionScript. Все элементы могут настраиваться на любое графическое представление, а классы языка позволяют удобно оперировать с их свойствами.

В программе появилось большое количество других полезных мелочей, например, увеличилось количество настроек текста, появилась подстановка несуществующих шрифтов, пиксельная сетка и т.д. Все эти новшества вы можете обнаружить сами, когда перейдете на Flash MX. А я надеюсь, что эта статья поспособствует этому событию. Скачивайте 6-й Flash Player, устанавливайте MX и успехов вам на Flash-поприще!

Автор: Рубен Сардарян

Ваш первый Flash-баннер

Создавать собственную анимацию во Flash может даже тот, кто абсолютно лишен способностей к рисованию (или способностей хоть отбавляй, а вот по пальчикам проехал бульдозер). Не стоит отчаиваться! Забинтуем многострадальные пальцы, пообещав себе в очередной раз не проверять, почему так хорошо работает мясорубка, и приступим к изучению основ будущего мастерства.

Давайте попробуем сделать простой баннер. Прежде всего необходимо четко представить себе, что мы хотим создать, то есть разработать сценарий. Чем лучше вы будете знать, что и как должно быть в вашем проекте – именно так называется работа во Flash-редакторе, – тем быстрее и проще будет осуществить задуманное. В нашем случае баннер будет очень простым: на фоне вращающегося квадрата выезжает надпись, которая затем растворяется.

Как известно, в кинематографе используется частота 24 кадра в секунду, но в мультипликации, особенно предназначенной для Интернета, вполне достаточно 12. Чем больше будет частота кадров, тем более плавными получатся движения, но при этом значительно сильнее загружается процессор, что становится существенно в сложных сценах. Именно от процессора зависит скорость воспроизведения Flash, и на разных компьютерах она может заметно различаться. Обычно это проявляется в торможении или прерывистом движении, особенно когда сложная анимация синхронизирована со звуком.

Определившись со сценарием, приступим к творчеству. Для начала решим, какого размера должен быть баннер. Пусть это будет общепринятый в баннерообменных сетях формат 468і60. Именно эти размеры необходимо указать в панели Movie Properties (параметры фильма) ModifyёMovie [Ctrl+M] (рис. 2), в полях Width (ширина) и Height (высота). В этом же окне выберем цвет фона (Background Color) нашего баннера, а также в поле Frame Rate укажем значение fps – количество кадров в секунду.

После того как указаны все параметры фильма и нажата кнопка ОК, проверьте масштаб отображения сцены. При необходимости установите 100%.

Теперь создадим основу будущего баннера – движущуюся надпись:

· Выберите инструмент Text [T].

· Откройте панель настройки данного инструмента: WindowёPanelsёCharacters [Ctrl+T] или нажмите в правом нижнем углу окна кнопку с изображением буквы «А».

· В выпадающем меню Font открытой панели Characters выберите кириллический шрифт, например Arial Cyr.

· Установите необходимый размер, например 35, и цвет.

· Щелкните на месте начала надписи (в нашем случае — в начале баннера) и введите текст. Если вдруг выяснилось, что выбранный размер или цвет не подходят, переключитесь на инструмент Arrow [M] (черная стрелка на панели инструментов) и выделите текст, щелкнув по нему. Вокруг текста появится рамка, теперь на панели Characters можно изменить его параметры: размер, цвет шрифта и т. п.

Настало время вашей первой анимации. Успокойте дрожащие от волнения руки и продолжайте творить:

· Преобразуйте текст в символ: Insertё Convert to Symbol [F8]. Не забудьте дать ему соответствующее имя и указать тип Graphic. При этом созданный символ будет помещен в библиотеку текущего проекта.

· Выделите 20-й кадр на линейке Timelime и вставьте ключевой кадр InsertёKeyframe [F6]. Слева от нового кадра появится серая полоска, идущая от первого ключевого кадра.

· Вернитесь в первый кадр и переместите надпись на баннере за его границу, например, за правый край.

· Не снимая выделения с первого кадра, откройте панель параметров кадра WindowёPanelsёFrame [Ctrl+F] (можно также нажать кнопку Show Instance в правом нижнем углу экрана), затем переключитесь на вкладку Frame.

· В выпадающем меню Tweening (построение промежуточных кадров) выберите тип анимации – Motion, то есть анимацию движения. При этом серая полоска между ключевыми кадрами станет голубой со стрелкой вправо.

Поздравляю! Вы только что заставили текст двигаться. Убедиться в этом можно, перемещая указатель кадров, расположенный над линейкой Timeline, или включив режим предварительного просмотра: ControlёTest Movie [Ctrl+Enter].

Время, которое займет проигрывание фильма или клипа от начала воспроизведения, отображается в строке статистики Timeline. Реальная длительность отдельных эпизодов может незначительно отличаться от отображаемого значения, которое вычисляется на основе установленного fps. Оно зависит в основном от сложности расчетов, требующихся для построения изображения отдельного кадра, и быстродействия компьютера.

Использование слоев дает большие возможности при создании фильма. Кроме того, что объекты, помещенные на разные слои, можно накладывать или скрывать, создавая имитацию объема сцены, правильное применение слоев может заметно уменьшить размер готового файла. Любой объект, который предстоит анимировать, нужно помещать на собственный слой. Так вы значительно быстрее добьетесь нужных эффектов и сократите загрузку процессора.

Для каждого слоя старайтесь придумать подходящее название. Для изменения имени слоя щелкните дважды левой кнопкой мыши на названии слоя и введите новое.

Если предполагается, что на кнопках будут анимированные объекты, создайте заранее символы Movie clip, а затем просто разместите их в соответствующем кадре кнопки.

Согласно нашему сценарию, текст должен не только «выехать» на экран, но и, побыв некоторое время, исчезнуть. Следовательно, придется еще немного помучить символ с текстом, ведь мы анимируем именно символ, а не сам текст.

· Вставьте новый ключевой кадр, на этот раз 60-й. Надеюсь, вы уже привыкли к тому, что для этого надо выделить соответствующий кадр и нажать F6? Тем самым мы установили время статического отображения текста после его остановки – примерно на три с половиной секунды.

· Вставьте последний ключевой кадр, например 80-й.

· Из выпадающего списка выберите эффект Alpha и, передвигая ползунок, установите нулевую прозрачность.

Этим мы указали редактору Flash, что последний кадр будет прозрачным, но не объяснили ему, что менять прозрачность следует постепенно. Как уже, наверное, понятно, необходимо анимировать отрезок между ключевыми кадрами, в нашем случае — между 60-м и 80-м.

· Перейдите на предыдущий ключевой кадр (60-й) и установите для него тип анимации Motion так же, как мы делали это с первым ключевым кадром.

Основа нашего баннера готова. Текст делает то, что мы от него хотели, убедитесь в этом, включив тестовый просмотр: ControlёTest Movie [Ctrl+Enter].

Теперь необходимо добавить последний элемент фильма – вращающийся квадрат:

· Создайте новый символ: InsertёNew Symbol [Ctrl+F8], присвоив ему необходимое имя и установив тип Movie Clip.

· Выберите инструмент Rectangle [R] и установите нужный цвет заливки и тип границ. Цвет можно выбрать на палитре (панель Mixer), вызываемой через меню (WindowёPanelsёMixer), или соответствующей кнопкой в правом нижнем углу программы.

· Нарисуйте квадрат, постаравшись сделать так, чтобы метка центра объекта действительно приходилась на центр квадрата, или переместите уже нарисованный квадрат.

· Преобразуйте квадрат в графический символ, как вы ранее это сделали с текстом.

· Вставьте ключевой кадр, например, на 30-м фрейме.

· Выделите первый кадр, откройте панель Frame для данного кадра и укажите уже знакомый тип анимации Motion.

· В выпадающем меню Rotation выберите вращение по часовой стрелке – CW, а в поле Times укажите, сколько оборотов должен сделать объект (например, один).

Осталось совсем немного — разместить созданный Movie-клип на сцене, то есть на нашем баннере:

· Перейдите в режим сцены, щелкнув на вкладке Scene1 над списком слоев.

· Добавьте новый слой. Для этого необходимо нажать на изображение бумажки с загнутым уголком и плюсиком под списком слоев.

· Перейдите в первый кадр созданного слоя, выделив его мышкой.

· Откройте библиотеку проекта: WindowёLibrary [Ctrl+L] или щелкнув на книжке в правом нижнем углу экрана.

· Найдите в библиотеке Movie-клип вращающегося квадрата и перенесите его на сцену, расположив на нужном месте баннера.

· Если, создавая квадрат, вы ошиблись с размерами, – ничего страшного, воспользуйтесь модификатором Scale, изменив размеры квадрата до необходимых.

· Убедитесь, что Flash создал на панели Timeline неанимированную линейку для данного слоя, равную по продолжительности предыдущему. Если этого не произошло, щелкните на последнем кадре слоя и вставьте пустой кадр: Insert/Flame [F5].

Просмотрите созданный фильм в тестовом режиме. Что не так? Правильно! Вращающийся квадрат закрывает собой надпись. Все верно, ведь мы его поместили на слой, расположенный выше слоя с текстом. Достаточно перетащить верхний слой вниз. Перемещать слои следует, нажав на название слоя и передвигая его вверх или вниз.

Конечно, можно было бы остановиться на том, что уже создано, но покой нам только снится! Не кажется ли вам, что вращающийся квадрат очень одинок и ему не помешала бы пара разноцветных приятелей? Для этого не придется создавать новые Movie-клипы, достаточно использовать уже имеющийся с небольшими изменениями для каждого экземпляра:

· Разместите на баннере еще пару квадратов, перетащив соответствующий Movie-клип из библиотеки проекта на сцену, можно на уже имеющийся слой с первым квадратом.

· После того как квадраты заняли свое место и подогнаны по размерам, выделите один из них, щелкнув по нему мышью.

· Откройте панель эффектов экземпляра Effects и в выпадающем меню выберите эффект Tint (оттенок). Установите необходимый цвет для каждого из экземпляров квадратов.

Раз уж речь зашла о баннерах, хочется упомянуть, что некоторые баннерообменные сети ограничиваются принятием Flash-роликов определенного размера, а некоторые требуют обязательного размещения кнопки, выполняющей роль фона (подложки) со специальным сценарием на ActionSript.

Баннер немыслим без возможности перехода на сайт при щелчке на нем мышью, в противном случае это уже не баннер, а обыкновенный Flash-ролик. За обработку нажатий во Flash отвечают символы-кнопки с присвоенными им фрагментами кода на ActionScript.

Создание кнопки мало отличается от создания Movie-клипа: InsertёNew Symbol [Ctrl+F8] (тип символа – Button). Основная особенность кнопки состоит в том, что ее Timeline используется нестандартно. Она содержит всего четыре кадра, никак не связанных с последовательностью анимации. В кадре Up представлено обычное состояние кнопки, в кадре Over – вид, когда над ней находится курсор мыши, Down – нажатая кнопка и Hit – область реагирования.

· Нарисуйте прямоугольник в первом кадре кнопки, равный по размерам всему баннеру и имеющий цвет фона. Размеры можно проконтролировать на панели Info, вызываемой кнопкой в правом нижнем углу окна с изображением квадрата и координатных стрелок, или через меню: WindowёPanelsёInfo [Ctrl+Alt+I].

· Перейдите на второй фрейм – Over, вставьте ключевой кадр [F6]. Измените цвет прямоугольника, выделив его и выбрав цвет заливки Fill.

· Установите область реагирования кнопки во фрейме – Hit, просто вставив еще один кадр [F5] для данного фрейма.

· Вернитесь на основную сцену, создайте новый слой и разместите в нем кнопку, совместив ее с границами баннера.

Теперь необходимо заставить кнопку открывать необходимый сайт. Для этого нам надо научиться присваивать объектам сценарий на ActionScript:

· Выделите кнопку и откройте панель Object Action, нажав в нижнем правом углу кнопку с изображением голубой стрелки или выбрав в меню Windowё Actions [Ctrl+Alt+A].

· В правом окне открывшейся панели найдите группу Basic Actions и дважды щелкните на команде Get URL или просто перетащите ее в правое окно.

· Выделите вторую строку.

· Заполните поля в нижней части окна. В поле URL введите имя своего любимого сайта (например, http://www.flash.polarcom.ru), а в поле Window выберите значение «_blank» – открывать в новом окне (если вы создавали свои веб-проекты, это значение должно быть вам хорошо знакомо). Поле Variable используется при необходимости передавать данные серверному CGI-скрипту с использованием методов GET и POST; в нашем случае оставьте значение «Don’t sent». В результате в правой части окна у нас получится следующий сценарий:
on (release) {
getURL ("http://www.flash.
polarcom.ru", "_blank");
}

Вот мы и создали баннер, а точнее — Flash-ролик с элементами интерактивности. Пришла пора сохранить созданный проект. Сохранение ничем не отличается от аналогичного процесса в других программах. Созданный файл имеет расширение.fla, его нельзя использовать для размещения в Интернете, так как это формат редактора, да и объем этого файла может быть достаточно большим, в нашем случае около 20 Кбайт. Для размещения фильма на веб-странице необходимо сохранить его в подходящем формате. Как правило, создаются сразу два файла: HTML-страница и файл формата.swf – собственно сам фильм. Это вовсе не означает, что мы не можем использовать другие форматы! При желании можно опубликовать проект в таких распространенных графических форматах, как GIF, JPEG, PNG, доступен видеоформат MOV, а при желании Flash создаст для вас исполняемый файл в формате.exe, и ваш фильм можно будет показать даже на компьютерах, где не установлен Flash.

· Откройте панель настройки публикации: FileёPublish Settings (рис. 8).

· Выберите нужные форматы, в нашем случае — HTML и Flash.

· Нажмите кнопку Publish.

Все! Процесс создания баннера можно считать законченным. Теперь в папке, в которой вы сохранили Flash-проект, появятся еще два файла. После публикации размер готового файла.swf будет гораздо меньше исходного.fla (в нашем случае меньше 3 Кбайт).

Конечно, в небольшой статье невозможно описать все приемы работы во Flash. Но надеюсь, после этого небольшого примера, когда буквально за несколько минут был создан Flash-баннер, применена пара эффектов анимации и создана кнопка, реагирующая на прохождение над ней курсора мыши и открывающая сайт после нажатия, вы убедились, что работать с Flash действительно легко и интересно. Мы не успели коснуться таких приемов анимации, как трансформация, когда один объект превращается в другой, или движение по заданной траектории. Не познакомились с различными типами слоев, например маскирующим слоем, позволяющим достигать удивительно красивых эффектов. Не изучили возможности текстовых полей: динамических – изменяемых в ходе работы сценария ActionScript, полей для ввода – дающих возможность пользователю вводить необходимую информацию, которую затем можно передать для обработки серверу. Мы почти не говорили об ActionScript, языке, очень похожем по своей структуре на JavaScript, но предназначенном для работы с объектами анимации. Его применение позволяет создать фильм, полный движения, но состоящий из одного-двух кадров. Не коснулись мы и такого нововведения пятой версии Flash, как интеллектуальные Smart-клипы. Собственно, и приемы рисования во Flash мы не рассматривали. Но все это нетрудно изучить самостоятельно. Главное начать, а это, будем надеяться, вы сегодня смогли.

Источник: www.winsov.com

Загрузка текста и переменных во Flash

Как таковой возможности загружать текст во Flash нету, но имеется возможность загружать переменные извне (в том числе и из текстовых файлов). Переменные передаются в стандартном формате GET-запроса:

[переменная]=[значение]&[переменная]=[значение]&...&...

- в таком виде формируются пары переменная-значение, разделённые символом амперсанда ("&"). Flash может также принимать переменные, сформированные серверными сценариями (PHP, ASP, JSP, CGI, Cold Fusion и т.п.). Но об этом пойдёт речь ниже. Сейчас же продемонстрируем загрузку текста (и почему только текста? да любых переменных!:) из обычного (текстового:) файла.

Для начала, сформируем текстовый файл, который нам предстоит загрузить. Он должен состоять из пар переменная=значение, разделенных амперсандом. Амперсанд определяет конец значения переменной, так что перед ним не должно быть пробелов или символов перевода каретки (если, конечно, это не входит в ваши планы). Вот пример содержимого текстового файла, который можно дать Flash на загрузку:

myText=This is the text to be loaded to Flash.&myValue=123.45

Сохраняем этот файл под именем "vars.txt".

Теперь создадим Flash файл, в который будет загружаться этот файл. Нам потребуются текстовые поля с именами myText и myValue и кнопка, которую мы будем использовать, чтобы инициировать загрузку:

Нам нужен только очень простой код для кнопки:

on(release) {
loadVariables("vars.txt", "_root");
}

Как вы догадались, всё выполняет функция loadVariables(). Рассмотрим её подробнее.

loadVariables() служит не только для загрузки переменных из внешних источников, но и для передачи переменных из Flash в серверные скрипты или другие ролики Flash.

Формат фунцкции loadVariables() следующий:

loadVariables("url", level/"target" [, variables]);

url - абсолютная или относительная ссылка на файл, из которого/в который будут посылаться данные.

level - номер уровня, на который будут загружены переменные. Чтобы указать числовое значение, нужно использовать функцию loadVariablesNum(). В этой же функции можно использовать идентификаторы уровней (например, loadVariablesNum("vars.txt", "_level0") для загрузки на 0-й уровень).

target - идентификатор клипа (movie clip), в который загружаются переменные.

Указывается либо идентификатор уровня, либо идентификатор клипа. Нельзя указать оба параметра одновременно.

variables - необязательный параметр, используется при посылке переменных, указывает метод посылки: GET или POST.

В нашем примере, мы загружали переменные из текстового файла vars.txt в основной объект Flash-ролика: _root.

Автор: Рубен Сардарян

Рисуем "работающие" часы

Flash позволяет работать с датой/временем. За это отвечает объект

Date (object)

Рассмотрим некоторые возможности объекта, позволяющие создать часы, отображающие системное время.

Такие часы можно, например, разместить на странице сайта или встроить в поздравительную открытку.

Итак, создадим новый файл размером 100 х 50 px. На Scene1 в первом кадре поместим динамическую текстовую надпись и присвоим ей имя, например TimeField:

Для удобства размещения/выравнивания присвойте значение 00:00:00, все равно в процессе работы ролика надпись изменится. Если вы используете "экзотический" шрифт, укажите Flash, что начертание цифр и разделителя надо храниить в самом ролике:

На этом процесс "рисования" заканчивается. Приступим к кодированию.

Для первого кадра в панели ActionScript (не забудьте установить режим ExpertMode) пишем следующий код:

Time = new Date();
H = Time.GetHours();
M = Time.GetMinutes();
S = Time.GetSeconds();
if (Length(H) < 2) {H = "0" + H};
if (Length(M) < 2) {M = "0" + M};
if (Length(S) < 2) {S = "0" + S};
TimeField = H + ":" + M + ":" + S;

В первой строке создаем экземпляр объекта Date и присваиваем ему текущее системное время.
В строках 2 - 4 переменным H, M и S присваеваем значения часов, минут и секунд соответственно.
В строках 5 - 7 добавляем текстовый "0" к началу переменной в случае, если длина переменной меньше 2.
И, наконец, в последней строке для надписи TimeField присваиваем "собранное" значение времени.

Во втором ключевом кадре ролика пишем код:

GotoAndPlay(1);

Если вы правильно повторили все шаги, то часы должны "заработать".

Мы разобрались с "электронными" часами. Попробуем сделать часы "со стрелками".

Создаем новый файл размером 100 х 100 px. Вставляем новый слой и в свойствах называем слои соотвественно Arrows и Grid. Разумно, чтобы стрелки были расположены над циферблатом:

На слое Grid рисуем сам циферблат. Далее создаем три новых символа с часовой, минутной и секундной стрелками. (Учтите, что поворачиваться "стрелки" будут относительно центра, помеченного "крестиком"). Назовем их соответсвенно HArr, MArr и SArr:

Помещаем символы на слой Arrows и в разделе Instance присвоим им имена HA, MA и SA:

Для первого кадра слоя Arrows в панели ActionScript (не забудьте установить режим ExpertMode) пишем следующий код:

Time = new Date();
H = Time.GetHours();
M = Time.GetMinutes();
S = Time.GetSeconds();
HA._rotation = 30 * (H - 12) + M / 2;
MA._rotation = 6 * M + S / 10;
SA._rotation = 6 * S;

Первые четыре строчки вам уже понятны по первому примеру. В строках 5 - 7 вычисляем угол поворота для соответствующих стрелок в зависимости от времени.

Во втором ключевом кадре ролика на слое Arrows пишем код:

GotoAndPlay(1);

Вот и все! Обратите внимание на размеры swf-файлов!

Далее все зависит от вашей фантазии.

Источник: www.rastyle.com

Снег во Flash

В этом уроке предлагается разобраться с ActionScript, а заодно научиться делать "настоящий" снег!

Итак, шаг 1: В вашем любимом графическом пакете создайте картинку 480 х 60 px. Это наш фон. (Я поставил максимальное сжатие и самое плохое качество). Если у вас там всякий лес цветной разный нарисован - подберите степень сжатия, чтобы фон не смотрелся убого. Но учтите, что чем сложнее фон - тем больше размер баннера.

Шаг 2: Теперь надо браться непосредственно за Flash. Создайте новый файл. Цвет фона значения не имеет. Измените параметр Modify | Movie... | Frame Rate с 12 до 50 и установите размер 480 х 60 px. Добавьте еще 2 слоя. Назовите слои соответственно "Snow", "Text" и "Back". В кадр 50 для каждого слоя вставьте фрейм:

Шаг 3: Вызываем пункт меню Insert | New Symbol... В разделе Name называем символ: "Back", параметру Behavior назначаем Button. Импортируем наш фон: File | Import... В панели Info Устанавливаем размер 480 х 60:

Помещаем символ Back на слой Back и центрируем:

Шаг 4: Создание символа "Снежинка". Создаем новый символ: Insert | New Symbol... с именем Snow и типом "Movie Clip". Не забудьте: заливка должна быть белой, фон - прозрачный. Можно воспользоваться векторным редактором Flash или скопировать нарисованный символ, например, из программы Corel Draw.

Размер снежинки 70 х 70 px. Нажмите Ctrl+Shift+G, чтобы разгруппировать изображение. Поместите Movie Clip Snow на слой Snow и в панели Instance присвойте имя Snow:

Установите позицию символа -35:

Шаг 5: Создание надписи. Создайте новый символ с именем Text, типом "Movie Clip" и поместите в него текст. Преобразуйте текст в растровое изображение (Ctr+b). Установите прозрачность 30%:

Поместите Move Clip на слой Text и в резделе Instance присвойте имя Text. У вас должно получиться примерно так:

Мы сделали всю подготовительную работу. Приступим к кодированию. Для символа Snow кликом правой клавиши мыши вызываем Object Actions.

Включаем режим Expert Mode:

Теперь старательно списываем этот код:

onClipEvent (enterFrame)
Событие возникает при смене кадра.

_root.snow._y = (35 + 60 + 35) / 60 * _root._currentframe;
Вычисляем новое положение снежинки по вертикали (35 - половина вертикального размера снежинки, 60 - высота баннера. Можно было написать сразу 130).

_root.snow._rotation = _root.snow._rotation + rotate;
Поворачиваем снежинку в зависимости от переменной rotate.

if (_root._currentframe == 1)
Если текущий кадр первый, выполняется последующий код по установке первоначальных параметров снежинки.

var scale;
var rotate;
Объявляем переменные.

rotate = random(3) - 1;
Переменная rotate принимает случайные значения: -1, 0 и 1.

_root.snow._rotation = random(30);
_root.snow._x = random(480);
Устанавливаем случайный начальный угол поворота снежинки и случайное положение по горизонтали.

_root.Snow._alpha = random(50) + 50;
Устанавливаем прозрачность снежинки в диапазоне 50 - 100%.

scale = random(90) + 10;
_root.Snow._xscale = scale;
_root.Snow._yscale = scale;
Генерируем случайный начальный размер снежинки в диапазоне 10 - 100%.

Итак, со снежинками разобрались. Сделали 2 важных вывода:
1. Все работает. Можно проверить Control | Test Movie
2. Встроенный редактор кода просто ужасен!

Осталось сделать обработчик для надписи. Откройте TimeLine для символа Text, дважды щелкнув по его пиктограмме:

Втавьте ключевой кадр в позицию 35. (Insert Keyframe). Выделите надпись и увеличьте значение Alpha в 100%:

Установите указатель на 1-й кадр и в панеле Frame установите значение Tweening в Shape:

Для первого и последнего кадров в панели Frame Actions напишите единственную строчку кода:

stop();

Перейдите к Scene 1, для символа Back в Frame Actions напишите следующий код:

on (rollOver, dragOver) {_root.Text.gotoAndPlay(2);}
on (rollOut, dragOut) {_root.text.gotoAndPlay(1);}

Вот и все. Успехов!

Источник: www.rastyle.com

Дата добавления: 2015-11-14