Matrix ефект на курсора
Ще правим ето това:

matrix_2

Всичко е обяснено подробно, така че урокът е подходящ и за начинаещи.

1. Отворете нов документ:

File > New > Flash Document > Ok

2. Настройте кадрите в секунда на 30, височината на 400 и фона черен:
Modify > Document...

.: Frame rate: 30
.: Height: 400
.: Background color: #000000
> Ok

3. Направете динамично текстово поле и го кръстете letter_txt:

Text Tool (T)

Properties >

.: Text Type: Dynamic
.: Instance Name: letter_txt
.: Font: Verdana
.: Font Size: 12
.: Text (fill) color: #00FF00
.: Alaign Center

Съвет: За всеки случай можете да вградите шрифтовете. Това може да
предотврати проблеми с визуализацията на проекта, но имайте предвид, че
увеличава размера му: Properties > Embed... > задържате 'Ctrl' и последователно
кликате на: Uppercase, Lowercase, Numerals > Оk

> Кликнете някъде върху работната площ > Напишете само една буква (която и да е) >
Esc

4. Поставете създаденото току що текстово поле в MovieClip, с името letter_mc

.: Ако letter_txt не е избрано, изберете го

Modify > Convert to Symbol....

.: Name: letter
.: Type: Movie clip
.: Registration: ( точно посредата)

Properties >

.: Instatce Name: letter_mc

С това се изчерпва работата по графичните елемнти на проекта, остава само кода,
който всъщност ще свърши цялата работа.

5. В кадър 1 на главната времедиаграма поставете следния скрипт:

import mx.transitions.Tween;
import mx.transitions.easing.*;
var options:String = new String("abcdefghigklmnopqrstuvwxyz");
letter_mc._visible = false;
var index:Number = new Number(1);
_root.onMouseMove = function() {
var ime:String = "letter"+index+"_mc";
duplicateMovieClip(letter_mc, ime, index);
index++;
_root[ime]._x = _xmouse+10;
_root[ime]._y = _ymouse+15;
_root[ime].onMouseMove = function() {
if (this._alpha == 0) {
removeMovieClip(this);
}
};
var num:Number = new Number(random(options.length));
_root[ime].letter_txt.text = options.charAt(num);
new Tween(_root[ime], "_alpha", Strong.easeOut, 100, 0, 5, true);
new Tween(_root[ime], "_y", Strong.easeIn, _root[ime]._y, 400, 1, true);
};



// Това става в прозореца 'Actions', който може да бъде извикан от Window >
Actions или като натиснете F9

6. Тествайте филма:

Control > Test Movie
или
Ctrl + Enter

За тези, които се интересуват как работи скриптът - обяснението:

import mx.transitions.Tween;
import mx.transitions.easing.*;


Импортира класовете, които ще ползваме по-нататък в скрипта

var options:String = new String("abcdefghigklmnopqrstuvwxyz");


Създава променлива от типа String, в която се съхраняват възможните стойности на
текстовото поле (падащите букви)

var index:Number = new Number(1);


създава променлива от типа Number, чиято стойност указва индексът на дупликата
на letter_mc

_root.onMouseMove = function() {


Оттук започва фунцията, която ще се изпълнява при събитието onMouseMove на
главната времедиаграма (_root), тоест всеки път, когато курсорът бъде преместен

var ime:String = "letter"+index+"_mc";


Създава променлива от типа String, която указва настоящето име на дупликата на
letter_mc. Както се вижда това име се образува като между "letter" и "_mc" се
постави стойноста на променливата index. Пример: letter1_mc, letter2_mc и тнт.
Тази промелива се използва при адресирането на целта на следващите действия.

duplicateMovieClip(letter_mc, ime, index);index++;


Създава дупликат на инстанцията letter_mc на класа MovieClip, задава й за име
стойността на променливата ime, и я поставя в ниво, отговарящо на стойността на
променливата index (така се осигурява всеки дупликат да има уникално име и да е
разположен на собствено ниво - нещо важно при адресирането на инстанции).
Стойността на променливата index се увеличава с единица.

_root[ime]._x = _xmouse+10;
_root[ime]._y = _ymouse+15;


Задава координати на съответния дупликат, така че да се намира почти на мястото
на курсора (спрямо главната времедиаграма) и да има леко изместване надолу и
вдясно.

_root[ime].onMouseMove = function() {
if (this._alpha == 0) {
removeMovieClip(this);
}


Ако съотвтната инстанция не се вижда тя се изтрива - така не натоварваме излишно
проекта. Проверката се извършва за всяка инстанция поотделно, при настъпване на
събитието onMouseMove.

var num:Number = new Number(random(option.length));


Създава променлива от типа Number, чиято стойност указва кой символ от
променливата options ще се просвои като текст на текстовото поле в съответната
инстаниция. Тази стойност всеки път е случайно цяло число с максимална стойност
дължината на променливата/стринга options.

_root[ime].letter_txt.text = options.charAt(num);


И ето тука вече се задава стойността на текстовото поле (ако трябва да сме точни
- на текста му, защото то има и други параметри). Както вече стана ясно, тази
стойност ще един от символите на options, и ще е случайна.

Ето и частта, която отговаря за анимацията:

new Tween(_root[ime], "_alpha", Strong.easeOut, 100, 0, 5, true);
new Tween(_root[ime], "_y", Strong.easeIn, _root[ime]._y, 400, 1, true);


Първият ред прави така, че параметърът _alpha на съответната инстанция се
променя от 100 на 0 за 5 секунди.
Вторият ред променя параметърът _y на съответната инстанция от текущата си
стойност до 400 (което е долната граница на проекта) за 1 секунда.

};


Затваря цялата тая функция ;)

//извинявам се ако не съм използвал точната терминология и например вместо
'инстаниция на класа TextField, с име бля бля....' , съм казал просто името на
инстанцията, обаче се надявам да сте ме разбрали.

Това е, успех!

/ Трябва да сте регистриран за да напишете коментар /