Гэри Розенцвейг - Adobe Flash. Создание аркад, головоломок и других игр с помощью ActionScript

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

Исходный файл: Textfly.fla

Во многих Flash-роликах по экрану перемешается текст. Сушествует множество способов создания этого эффекта, некоторые из них проиллюстрированы примерами, которые имеются на Web-сайте поддержки книги.

Задача проекта

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

На рис. 5.7 изображены четыре кадра из ролика, имюшегося на Web-сайте. Буквы спускаются сверху и выстраиваются в нужном порядке в нижней части экрана.

Рисунок 5.7. Четыре кадра анимации, созданной при помощи ActionScript

Посмотрите ролик Textfly.fla на Web-сайте. Обратите внимание, где располагаются сценарии и как организован ролик в целом.

Подход

Ролик создается следующим образом: текст делится на отдельные буквы, каждая из которых представляет собой отдельный клип. Затем из случайных мест на экране эти клипы перемешаются в позиции, соответствуюшие исходному тексту.

Подготовка ролика

Ролик включает графическое изображение, расположенное в центре экрана и совершенно не зависяшее от текстового эффекта.

Внутри ролика находится один клип, содержаший букву "А". Клип был создан из небольшого текстового окна. В панели Properties ему было назначено свойство Dynamic Text и присвоено имя переменной letterText(рис. 5.8).

Рисунок 5.8. В панели Properties вы можете назначить текстовой области свойство Dynamic Text и присвоить ей имя переменной

Затем текстовое поле преобразуется в клип при помоши команды Insert → Convert To Symbol. Копия эталона получает имя letter0и помешается в то место, где находится первая буква фразы, в данном случае – в нижний левый угол.

Создание кода

В процессе выполнения программы из одного клипа создается несколько его экземпляров. В каждом новом цикле при помоши функции duplicateMovieClip создается новый экземпляр клипа для каждой из букв. После создания каждого экземпляра в него вводятся переменные endxи endy,задаюшие окончательную позицию букв в анимации. Значение переменной endyсоответствует позиции _y клипа Letter0,значение переменной endxувеличивается слева направо.

Сценарий создает новые копии клипа для букв начиная с той, которая идет под номером 1. Первая буква (она имеет номер 0) использует уже сушествуюший клип Letter0.

text = «Introducing: Flashy the Fox!»;

for (i=0;i

if (i > 0) duplicateMovieClip("Letter0","letter"+i,i);

this["letter"+i].letterText = text.charAt(i);

this["letter"+i].endx = this["LetterO"]._x + i*19;

this["letter"+i].endy = this["LetterO"]._y;

}

Число 19 в конце пятой строки обозначает, что расстояние между буквами составляет 19 пикселов. Это значение устанавливается в зависимости от используемого вами типа и размера шрифта.

Другой частью ролика является программа ActionScript, назначенная клипу Letter0.При загрузке клип помешается в случайную позицию в верхней части экрана и в каждом кадре постепенно перемешается к своей окончательной позиции.

Каждый раз при копировании клипа Letter0сценарий, назначенный ему, также копируется. Поэтому каждая копия клипа включает копию одного и того же кода.

Первая часть сценария задает случайное значение для переменных startxи starty,которые определяют начальное положение клипа в верхней части рабочего поля. Затем эти значения присваиваются соответствуюшим координатам клипа. Помните, что переменные endxи endyбыли заданы сценарием главной временной шкалы при создании клипов. Таким образом, у клипов теперь есть случайное начальное расположение, описываемое переменными startxи starty,а также фиксированное конечное положение, заданное переменными endxи endy.

Значение переменной nизменяется от 0 до 100 с шагом 5, показывая, на сколько процентов выполнено перемешение буквы. Значение 0 соответствует 0 % по отношению к конечной точке и 100 % по отношению к начальной. Для значения 5 это составляет 5 % и 95 % соответственно. С каждым шагом буква приближается к цели на 5 %. Значение местоположения обновляется, если переменная имеет значение меньшее или равное 100.

onClipEvent(load) {

startx = Math.random()*550;

starty = -Math.random()*100;

this._x = startx;

this._y = starty;

n = 0

}

onClipEvent(enterFrame) {

n += 5;

if (n <= 100) {

this._x = endx*n/100 + startx*(100-n)/100;

this._y = endy*n/100 + starty*(100-n)/100;

}

}

К сведению

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

Другие возможности

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

Исходный файл: Cursortrail.fla

Рассмотрим спецэффект, создание которого невозможно без использования ActionScript. В нашем примере, когда пользователь перемешает мышь, за курсором остается характерный шлейф, состояший из таюших копий изображения, привязанного к курсору.

Читать дальше