Главная » Flash Обучение » Flash Уроки Текстом » Random Boxes Text Effect with Actionscript 3

Наш журнал

Видео Журнал "Легко о Flash" - подписавшись на него, вы будете один раз в месяц получать его выпуск на свой почтовый ящик, там вы найдете новые видео уроки по работе в программе Adobe Flash CS4, а также интересные новости из мира flash сообщества.

Flash Журнл

Ваш e-mail:

Ваше имя на русском:

Политика антиспама

подпишитесь сейчас и получите доступ ко всем выпущенным журналам

Наш курс - аналогов нет!

Adobe Flash CS4 и Actionscript 3.0. Полный курс видео уроков.

Внимание!

Вы можете изучить все секреты flash анимации всего за 3 недели! Перейти из разряда новичка в разряд опытного пользователя даже без посещения дорогих курсов и чтиния толстенных талмудов.

110 видео уроков,

в превосходном качестве помогут пройти, Вам, терни flash анимации самым быстрым и легким путём!

+ActionScript 3.0

Подробнее!..

Вход на сайт



Регистрация / Напомнить?

 

return_links(2); ?> return_links(2); ?> return_links(1); ?> return_links(); ?>

Random Boxes Text Effect with Actionscript 3

SarGun   17 февраля 2009   

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

Ниже показано, что должно получиться в конце урока:

Итак, начнём!

1. Создаём новый документ Flash размера 250x250.

2. Далее создайте статическую текстовую область и введите необходимый текст (в этом уроке - "easyflash.org"). Спозиционируйте текст в центре рабочего поля.

3. Преобразуйте текстовую область в мувиклип(нажмите F8). В поле Name введите "My Text" и устанавите точку регистрации в верхнем левом углу. И нажмите OK. Теперь Ваш мувиклип должен выглядеть так:

Random Boxes Text Effect with Actionscript 3

4. Дайте мувиклипу имя "myText" в настройках в поле instance name .

5. Теперь нарисуйте на сцене квадрат размером 10x10. Используйте рамку например 2 пикселя.

6. Преобразуйте квадрат в мувиклип(F8). В поле Name введите ”My Rectangle” и устанавите точку регистрации в центре и нажмите OK

удалите квадрат с рабочего поля, т.к. мы его будем вставлять с помощью кода.

7. Выберите в библиотеке этот квадрат и нажмите правой кнопкой и выберите Properties. Далее установите галочку напротив Export For ActionScript и в поле Class введите "MyRectangle". Потом нажмите OK.

9. Создайте новый слой для кода и назовите его Actions.

вот код:

//Мы используем таймер, чтобы создавать прямоугольники когда мышь - над текстом.
//Этот таймер посылает событие каждые 0.02 секунды.
var timer:Timer = new Timer(20,0);
timer.addEventListener (TimerEvent.TIMER, createRectangle);
//Мы хотим узнать где мышь - над текстом или нет.
var mouseOverText:Boolean = false;
//Сделаем текст похожим на кнопку (появляется курсор руки)
myText.buttonMode = true;
//Слушаем событие наведения когда мышь над текстом
myText.addEventListener (MouseEvent.MOUSE_OVER, mouseOverHandler);
//Слушаем когда мышь убирается с текста
myText.addEventListener (MouseEvent.MOUSE_OUT, mouseOutHandler);
//Эта функция вызывается когда мышь - над текстом
function mouseOverHandler (e:Event):void
{
//Запускаем таймер
timer.start ();
}
//Эта функция вызывается когда мышь убирается с текста
function mouseOutHandler (e:Event):void
{
//Сбрасываем таймер на 0
timer.reset ();
}
//Эта функция вызывается каждые 0.02 секунд когда таймер работает
function createRectangle (e:Event):void
{
//Создаём новый квадрат
var rectangle:MyRectangle = new MyRectangle();
//Назначаем произвольную x позицию квадрату
rectangle.x = myText.x + Math.random() * myText.width;
//Назначаем y позицию квадрату
rectangle.y = myText.y + myText.height / 2;
//Назначаем произвольные размеры квадрату
rectangle.scaleX = rectangle.scaleY = Math.random() * 2;
//Назначаем произвольную скорость по x и по y для квадрата
rectangle.xspeed = Math.random() * 10 - 5;
rectangle.yspeed = Math.random() * 10 - 5;
//Назначаем произвольную скорость прозрачности(как быстро квадрат исчезает)
rectangle.alphaSpeed = -(Math.random() * 0.1);
//Назначаем произвольную масштабную скорость
rectangle.scaleSpeed = Math.random() * 0.05;
//Назначаем произвольный цвет для прямоугольника
var colorInfo:ColorTransform = rectangle.transform.colorTransform;
colorInfo.color = 0xffffff * Math.random();
rectangle.transform.colorTransform = colorInfo;
//Мы не хотим слушать события мыши из квадрата
rectangle.mouseEnabled = false;
//Добавляем слушатель ENTER_FRAME для квадрата
rectangle.addEventListener (Event.ENTER_FRAME, animate);
//Добавляем прямоугольник в список отображения. на уровень 0
//чтобы квадраты всегда были за текстом
addChildAt (rectangle,0);
}
//Эта функция вызывается в каждом кадре
function animate (e:Event):void
{
//Сохраните квадрат в локальную переменную
var rectangle:MyRectangle = (MyRectangle)(e.target);
//обновим его позицию
rectangle.x += rectangle.xspeed;
rectangle.y+=rectangle.yspeed;
//Обновим его прозрачность
rectangle.alpha+=rectangle.alphaSpeed;
//Обновим его масштаб
rectangle.scaleX+=rectangle.scaleSpeed;
rectangle.scaleY+=rectangle.scaleSpeed;
//Назначим случайный поворот квадрату
rectangle.rotation=Math.random()*256;
if (rectangle.alpha<0)
{
rectangle.removeEventListener (Event.ENTER_FRAME, animate);
removeChild (rectangle);
}
}

Это всё протестируйте ролик)

Вот исходник:

random-boxes-text-effect-with-actionscript-3.rar [5.57 Kb] (cкачиваний: 409)

Перевод: SarGun

Оригинал: тут

Просмотров: 3260 | Комментарии (7) | flash урок, actionscript 3, текст
#1   TeT      28 февраля 2009 01:58   ICQ: 8096403   



Регистрация: 8.02.2009
Публикаций: 10
Комментариев: 61
Ой, а на AS 2 мона такое сделать ? (((


--------------------
Keyboard not found. Press any key to continue
#2   Fly      28 февраля 2009 04:34   ICQ: --   



Регистрация: 21.07.2008
Публикаций: 46
Комментариев: 297
Можно, но зачем? Когда технологии идут вперёд - надо развиваться вместе с ними, а не оставаться в каменном веке :) АС2 - это уже практически каменный век :)))


--------------------
1) Админ всегда прав
2) Если админ не прав, смотри пункт 1

Мы в контакте - https://vkontakte.ru/club9573247
#3   Aloran      17 марта 2009 23:41   ICQ: --   



Регистрация: 6.03.2009
Публикаций: 11
Комментариев: 105
У меня такой вопрос откуда взялись переменные:
rectangle.xspeed =
rectangle.yspeed =
rectangle.alphaSpeed =
rectangle.scaleSpeed =

их разве не надо объявлять?


--------------------
Учитель достается тому, кто его достает!
#4   rahimazeri      16 мая 2009 12:23   ICQ: --   



Регистрация: 14.05.2009
Публикаций: 0
Комментариев: 2
буду делать..
#5   denleo      2 июня 2009 10:04   ICQ: 341496828   



Регистрация: 2.06.2009
Публикаций: 1
Комментариев: 1
Классная вещь, заменил надпись на имя любимой и вместо квадратиков мувик сделал сердечки, и убрал смену цвета, получилось супер.....спасибо! yahoo
#6   ARMAgeddoN      20 июня 2009 14:53   ICQ: 381147022   



Регистрация: 20.06.2009
Публикаций: 0
Комментариев: 4
Сделал =)
Спасибо за урок, очень красивый эффект.
Надеюсь пригодится.
#7   Dernier Sourire      4 октября 2009 22:54   ICQ: --   



Регистрация: 18.08.2009
Публикаций: 0
Комментариев: 1
Гениально:) А можно добавить звук при наведении мыши на текст?

Информация

Посетители, находящиеся в группе Гости, не могут оставлять комментарии в данной новости.