Главная
Форум
Баннеры
ТОП Сайтов
Мониторинг серверов
Банлист Сервера
Статистика Сервера
Наши отзывы
Новые сообщения · Участники · Правила форума · Поиск · RSS
  • Страница 1 из 1
  • 1
Мышиный след с вращающимся текстом, Урок
DooDLeZДата: Воскресенье, 28.03.2010, 20:22 | Сообщение # 1

WebMaster
Сообщений: 485
[ ]
:-(
Mouse Follower with Text Rotation

В этом уроке мы заставим за нашей мышью следовать поворачивающийся анимированный текст.

Мы разместим этот текст внутри графического символа, потому что позже нам нужно сделать из него твин, а flash не разрешит нам сделать твин прямо из текста.

Итак, создайте новый Flash документ.
Шаг 1. Cоздайте новый графический символ в библиотеке; это то же самое, что вы создаете муви клип, но выберите "Graphic" вместо "Movie Clip":

Мышиный след с вращающимся текстом

Внутри этого символа создайте статическое текстовое поле и напишите то, что пожелаете.

Шаг 2.
Теперь создайте в библиотеке новый муви клип и назовите "textAnimation".

Перетащите экземпляр текстовой графики в первый кадр, скопируйте этот первый кадр и вставьте его во второй и 30-ый кадры.

В библиотеке установите для этого муви клипа идентификатор "Text" для связывания.

Шаг 3.
Перейдите на основную сцену. В первом кадре основной временной шкалы вставьте этот код:

Code

//угол для муви клипа textAnimation
var newAngle = 0;

//используется для создания новых муви клипов
var count = 0;

//аттачим муви клип textAnimation
attachMovie("Text", "Text" + count, 1000 + count);

//установим координаты xPos и yPos для первого муви клипа
var xPos = Text0._x;

//мы будем использовать эти переменные, чтобы двигать муви клипы
var yPos = Text0._y;

Шаг 4. Теперь перейдите в библиотеку. Кликните дважды по мувику textAnimation. Для этого текстового муви клипа откройте панель actions. В первый кадр вставьте этот код:
Code

//если мышь находится справа от этого мувика
if(_root.xPos < (_root._xmouse - 10))
{
          //увеличиваем xPos на 10
          _root.xPos += 10;
}
//если мышь слева
else if(_root.xPos > (_root._xmouse + 10))
{
          //уменьшаем xPos на 10
          _root.xPos -= 10;
}

//если двигалась ввниз
if(_root.yPos < (_root._ymouse - 10))
{
          _root.yPos += 10;
}
Code

//если двигалась вверх
else if(_root.yPos > (_root._ymouse + 10))
{
          _root.yPos -= 10;
}

//установим координаты муви клипа равными x(y)Pos
this._x = _root.xPos;
this._y = _root.yPos;

//увеличим угол на 10, чтобы муви клип повернулся
_root.newAngle += 10;

//установим наш поворот на новый угол
this._rotation = _root.newAngle;

//увеличим count, чтобы мы могли создать новый муви клип в следующем кадре
_root.count++;
В этом кадре мы используем глобальные переменные, чтобы каждый экземпляр этого муви клипа увеличивал глобальные переменные x(y)Pos и newAngle. Эти муви клипы не будут в действительности поворачиваться и двигаться, пока мы не создадим новые экземпляры, используя новые положения и углы.

Во втором кадре выделите текстовую графику, чтобы сделать некоторые изменения.

Выберите эту опцию в панели properties:

Мышиный след с вращающимся текстом

И измените эти установки:

Мышиный след с вращающимся текстом

Это изменит цвет текста; вы можете использовать любой цвет, какой хотите.

В последнем кадре сделайте то же самое, но выберите опцию "Alpha" вместо "Tint" и установите ее в 0%.

И сделайте графический экземпляр меньше, используя Free Transform Tool.

Вставьте этот код во второй кадр:

CODE

//здесь мы аттачим новый муви клип, который будет иметь
//новый угол и положение, которые мы установили в предыдущем кадре.
_root.attachMovie("Text", "Text"+_root.count, 1000+_root.count);

Теперь в последнем кадре:
CODE

//удаляем этот муви клип
this.removeMovieClip();

Это все! Постарайтесь не делать больше одной строки текста, поскольку анимация будет выглядеть не очень привлекательно.

Объяснение кода

CODE

var newAngle = 0;

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

var count = 0;

Переменная используется для новых муви клипов.
CODE

attachMovie("Text", "Text" + count, 1000 + count);

Аттачим муви клип.
CODE

var xPos = Text0._x;
var yPos = Text0._y;

Переменные используются для контроля за положением приаттаченных муви клипов.
Муви клипы также имеют фиксированное положение; эффект движения создается приаттачиванием новых муви клипов на новые позиции в каждом фрейме. Чтобы сделать это, нам только нужно изменить эти две переменные.
CODE

if(_root.xPos < (_root._xmouse - 10))
{
_root.xPos += 10;
}

Если мышь находится справа от этого муви клипа увеличиваем переменную xPos на 10, чтобы следующий приаттаченный муви клип находился на 10px правее.
CODE

else if(_root.xPos > (_root._xmouse + 10))
{
_root.xPos -= 10;
}

Уменьшаем переменную, чтобы двигать следующий муви клип налево.
CODE

if(_root.yPos < (_root._ymouse - 10))
{
_root.yPos += 10;
}

Увеличиваем yPos чтобы двигать вниз.
CODE

else if(_root.yPos > (_root._ymouse + 10))
{
_root.yPos -= 10;
}

Уменьшаем, чтобы двигаться вверх.
CODE

this._x = _root.xPos;
this._y = _root.yPos;

Установим положение муви клипа, используя переменные xPos и yPos.
CODE

_root.newAngle += 10;

Увеличиваем глобальную переменную для угла. Следующий муви клип будет также использовать эту переменную, всегда добавляя 10 и создавая эффект вращения.
CODE

this._rotation = _root.newAngle;

Установим поворот муви клипа.
CODE

_root.count++;

Увеличиваем эту переменную для создания муви клипов.
CODE

_root.attachMovie("Text", "Text"+_root.count, 1000+_root.count);

Аттачим новый муви клип.
CODE

this.removeMovieClip();

Удаляем муви клип, после того как он оказался в последнем фрейме.

Перевод kedicik

Источник

В дополнение хочу сказать, что вместо текста в графический символ можно вставить все, что угодно.
Приведу пример, что получилось у меня. Очень красиво



  • Страница 1 из 1
  • 1
Поиск:


Все права принадлежат PainKiller.Net.Ru 2009-2010. Дизайн сайта разработан - PainKiller.Net.Ru
Внимание! Рип шаблона запрещен "Нарушение авторского права"! Design bY PainKiller.Net.Ru
Тиц и pr сайта