FLASH, И ГОТОВО! Красивое меню-трансформер

Iv (dembicki@narod.ru)

Спецвыпуск Xakep, номер #027, стр. 027-066-4

var nod = _root.input_xml[this.i];

this._y = (this.i-1)*20;

this._x = nod.attributes.tab*20;

this.icon.stop();

this.name_txt.autoSize = true;

this.name_txt.text = nod.attributes.name;

};

// START TO DELETE

Object.registerClass("folder", GeneralClass);

Object.registerClass("item", GeneralClass);

// END TO DELETE

Вот теперь можно тестануть.

НАПОЛНИМ ФУНКЦИОНАЛЬНОСТЬЮ

Конечно, дерево еще не юзабельно. Нам еще предстоит его наполнить функциональностью. Но уже сейчас видно структуру дерева. Продолжаем наполнять функционалом. В первую очередь пропишем общее для обоих мувиков.

Подсветка при наведении мыши:

g_tmp.onRollOver = function() {

this.name_txt.textColor = 0xFF0000;

};

g_tmp.onRollOut = function() {

this.name_txt.textColor = 0x339999;

};

А теперь для создания раздельной функциональности создадим отдельные классы для folder и item.

FolderClass = function () {

};

ItemClass = function () {

};

Теперь пора сносить регистрацию мувиков на GeneralClass в скрипте (то место, которое мы выделяли). И зарегистрируем мувики каждый на свой класс:

Object.registerClass("folder", FolderClass);

Object.registerClass("item", ItemClass);

Добавим наследование этими классами функциональности из GeneralClass:

f_tmp = FolderClass.prototype=new GeneralClass();

i_tmp = ItemClass.prototype=new GeneralClass();

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

папка:

FolderClass -> GeneralClass -> MovieClip -> Object

элемент:

ItemClass -> GeneralClass -> MovieClip -> Object

Знак "->" здесь можно читать как "помимо своих функций и свойств имеет функции и свойства класса". При этом первые два класса созданы нами, вторые два класса это встроенные классы.

Итак, в результате мы имеем три созданных нами класса. А также ссылки на их прототипы: g_tmp, f_tmp, i_tmp, созданные для упрощения обращения. Прежде чем двинуться дальше, давай разберем маленький пример для понимания свойств наследования:

f_tmp.onRollOver = function() {

this.name_txt.textColor = 0x0000FF;

};

Тестани и посмотри, что получилось. Папки начали подсвечиваться синим цветом! Как это произошло? Какие выводы можно сделать из примера? Каков механизм? Как обычно, все довольно просто. Когда проигрыватель исполняет скрипт, он последовательно ищет вызываемую функцию сначала в объекте, который его вызвал, затем в родительском классе, затем дальше вверх по иерархии классов. Проигрыватель прекращает поиск функции в двух случаях:

1. как только ее найдет;

2. если не нашел в самом верхнем по иерархии родителе.

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