Рисунок 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<text.length;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;
}
...
Примечание
Функция char At выбирает из строки букву, расположенную в определенной позиции. Первый символ строки имеет номер 0. Для того чтобы выделить подстроку, используйте функцию substr.
...
Примечание
Команда for позволяет создать небольшой цикл. Код внутри цикла выполняется заданное количество раз. Первый параметр после команды for используется для задания переменной. Второй параметр необходим для проверки, которая осушествляется перед каждым циклом и определяет, надо ли его продолжать. Третьим и последним параметром является команда, выполняемая в каждом цикле. Например, строка for (i=0;i<text.length; i++) обозначает, что переменная i начиная со значения 0 увеличивается на единицу в каждом цикле, и цикл будет продолжаться до тех пор, пока значение i меньше числа символов в тексте.
Число 19 в конце пятой строки обозначает, что расстояние между буквами составляет 19 пикселов. Это значение устанавливается в зависимости от используемого вами типа и размера шрифта.
...
Совет
При создании данного эффекта лучше использовать моноширинный шрифт, в котором все буквы имеют одинаковую ширину, например Monaco, Courier и Courier New. В противном случае такие буквы, как "w" и "l", могут значительно отличаться по ширине. Использование шрифтов с различной шириной букв в рассматриваемом коде может привести к "склеиванию" символов.
Другой частью ролика является программа 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. В нашем примере, когда пользователь перемешает мышь, за курсором остается характерный шлейф, состояший из таюших копий изображения, привязанного к курсору.
На рис. 5.9 можно увидеть пример этого эффекта. Каждая из окружностей показывает предыдушую позицию курсора. Чем раньше создана окружность, тем она меньше и светлее.
Рисунок 5.9 . Оставляя копии клипа в позиции, в которой только что находился курсор, можно создать след, тянущийся за курсором
Задача проекта
Идея состоит в том, чтобы создать след за курсором из постепенно уменьшаюшихся и таюших окружностей. Когда пользователь перемешает мышь, возникает ошушение, что курсор рисует за собой хвост.
В начальный момент каждый кружок имеет свой фиксированный размер и абсолютно непрозрачен. Постепенно он уменьшается в размерах и бледнеет до тех пор, пока окончательно не сольется с фоном.
В любой момент времени на экране тает и уменьшается множество кружочков, и по мере исчесзновения старых их место занимают новые, появляюшиеся в текушей позиции курсора.
Подход
Окружности являются клипами, которые создаются и помешаются в определенную точку экрана в течение работы программы. В коде хранятся все сушествуюшие клипы. При каждом обрашении к кадру программа просматривает массив, уменьшая размер и увеличивая прозрачность каждого клипа. Когда клип с окружностью становится невидимым, он удаляется; также удаляется соответствуюший элемент массива.
Подготовка ролика
Создадим простой клип с кружочком внутри. Цвет и размер вы можете выбрать по своему усмотрению. В нашем примере мы сделали темно-голубую окружность диаметром 20 пикселов. Клипу присвоено имя "Cursor Trail" (След курсора), в панели Linkage Properties выставлен флажок Export for ActionScript и присвоено имя связи CursorTrail.
Теперь создадим клип с надписью "Actions". Поместим его вне пределов рабочей области. Этот клип будет использоваться только как носитель кода, поэтому его содержание может быть любым. Вы можете даже не создавать внутри него никаких изображений или текста – тогда на экране он будет отображаться в виде маленького кружочка.
Создание кода
Наш "actions\' – клип содержит два обработчика onClipEvent. Первый включается в начале ролика и создает пустой массив, чтобы содержать ссылки на клипы, образуюшие хвост. Он также устанавливает счетчику trailNum значение ноль. Эта переменная содержит значение номера следующего клипа, который вы создадите.
Переменная speed определяет как быстро клипы, составляюшие "хвост", будут уменьшаться в размерах и таять.
On ClipEvent(load) {
// Создаем массив.
trail = new Array();
trailNum = 0;
// Меньшее значение переменной соответствует меньшей
// скорости.
speed = 2;
}
Следуюший обработчик начинается с создания экземпляра клипа. Каждому клипу присваивается уникальное имя вида cursor trail + trailNum. Переменная trailNum используется также для определения уровня очередного клипа.
On ClipEvent(enterFrame) {
// Создаем очередной клип.
var mc = _root.attachMovie("cursor trail", "cursor trail" + trailNum, trailNum);
Созданный клип помешаем в текушую позицию курсора.
// Устанавливаем позицию.
mc._x = _root._xmouse;
mc._y = _root._ymouse;
Указатель на новый клип добавляется в массив trail. Затем значение trailNum увеличивается на единицу.
// Добавляем указатель в массив.
trail.push(mc);
trailNum++;