Сегодня я покажу, как можно создать простое выпадающее меню на ActionScript 3.0 в Adobe Flash. Акцентирую ваше внимание на том, что создавать буду именно ПРОСТОЕ выпадающее меню. Но ни кто вам не мешает в дальнейшем доработать этот пример под ваш вкус.
Итак, приступим...
Сперва нам потребуется создать заготовку кнопки. Совокупность таких кнопок и будет составлять выпадающее меню. Кнопки, конечно, можно написать исключительно кодом, но не всем это удобно. Да и подгонять внешний вид такой кнопки под дизайн конкретного флеш-приложения будет сложно. Поэтому воспользуемся преимуществами редактора Adobe Flash и создадим кнопку вручную.
Я нарисовал прямоугольник и превратил его в символ MovieClip по имени Item. Это и будет основой кнопки. Особо обращаю ваше внимание на то, что точка регистрации у кнопки должна находится в левом верхнем углу.
Теперь зайдём внутрь нашей кнопки и создадим там динамическое текстовое поле по имени item_txt. В этом текстовом поле будет выводится название кнопки.
После этого заготовку кнопки можно удалить с рабочего стола. Но она сохраниться в библиотеке проекта и с ней нам надо будет проделать ещё одну манипуляцию.
Заходим в библиотеку проекта и жмём правую кнопку мышки над созданным ранее мувиком Item. Появится контекстное меню мувиклипа. В этом контекстном меню выбираем пункт СВОЙСТВА. Откроется окно СВОЙСТВА СИМВОЛА. В этом окне вы должны поставить галочку у пункта ЭКСПОРТ ДЛЯ ACTIONSCRIPT. При этом в поле ввода КЛАСС должно стоять название нашего мувика - Item. Потом кликайте по OK и подтверждайте изменения. Поздравляю, вы создали класс Item. И этот класс нам потребуется на следующем этапе создания выпадающего меню...
Второй этап - это написание кода. Код я писать буду на главной временной шкале. Для большей ясности код снабжён подробными комментариями...
Код ActionScript 3.0:
/*
импорт классов
*/
import flash.display.Sprite;
import flash.filters.DropShadowFilter;
import flash.net.navigateToURL;
import flash.net.URLRequest;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Regular;
/*
функция, которая будет создавать выпадающее меню
*/
function createDropdownMenu(captionText:String,arr:Array):Sprite
{
/*
контейнер для всего выпадающего меню
*/
var cont:Sprite = new Sprite();
cont.addEventListener(MouseEvent.ROLL_OVER,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;new Tween(contItems,"y",Regular.easeIn,contItems.y,0,0.4,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,1,0.4,true);});
cont.addEventListener(MouseEvent.ROLL_OUT,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);});
cont.filters = [new DropShadowFilter(4,45,0x000000,0.4,4,4,1)];
/*
заголовок выпадающего меню
*/
var caption:Item = new Item();
cont.addChild(caption);
caption.item_txt.text = captionText;
/*
контейнер для кнопок выпадающего меню и маски
*/
var contDropdownMenu:Sprite = new Sprite();
cont.addChild(contDropdownMenu);
contDropdownMenu.x = 0;
contDropdownMenu.y = caption.height;
/*
количество кнопок в выпадающем меню
*/
var l:uint = arr.length;
/*
контейнер только для кнопок выпадающего меню
*/
var contItems:Sprite = new Sprite();
contItems.graphics.beginFill(0x000000,0);
contItems.graphics.drawRect(0,0,contItems.width,contItems.height * l);
contItems.graphics.endFill();
contDropdownMenu.addChild(contItems);
/*
создаём сами кнопки выпадающего меню
*/
for (var i:uint = 0; i < l; i++)
{
var item:Item = new Item();
contItems.addChild(item);
item.item_txt.text = arr[i][0];
item.x = 0;
item.y = i * item.height;
item.alpha = 0.6;
item.buttonMode = true;
item.mouseChildren = false;
item.addEventListener(MouseEvent.CLICK,arr[i][1]);
item.addEventListener(MouseEvent.MOUSE_OVER,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,1,0.4,true);});
item.addEventListener(MouseEvent.MOUSE_OUT,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,0.6,0.4,true);});
}
/*
маска
*/
var contItemsMask:Sprite = new Sprite();
contItemsMask.graphics.beginFill(0x000000,1);
contItemsMask.graphics.drawRect(0,0,contItems.width,contItems.height);
contItemsMask.graphics.endFill();
contDropdownMenu.addChild(contItemsMask);
contItems.mask = contItemsMask;
/*
первоначальное положение контейнера с кнопками выпадающего меню
*/
contItems.y = - contItems.height;
/*
возвращаем результат
*/
return cont;
}
/*
массив с именами кнопок выпадающего меню и функциями, которые будут вызываться при клике пользователя по соответствующему пункту выпадающего меню
*/
var arr:Array = [["Псков",func_1],["Великие Луки",func_2],["Остров",func_3]];
/*
создаём выпадающее меню
первый параметр - заголовок меню
второй параметр - массив с данными (надпись, функция) для создания кнопок выпадающего меню
*/
var dropdownMenu:Sprite = createDropdownMenu("Города",arr);
/*
добавляем меню в список отображения
*/
addChild(dropdownMenu);
/*
позиционируем меню на сцене флеш-ролика
*/
dropdownMenu.x = 50;
dropdownMenu.y = 50;
/*
функции, которые будут вызываться по клику на соответствующем пункте меню
*/
function func_1(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Псков")));
}
function func_2(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Великие Луки")));
}
function func_3(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Остров")));
}
Вот, собственно, и всё...
Результат:
Благодаря тому, что создание drop-down menu у нас вынесено в отдельную функцию, мы можем очень быстро наделать сколь угодно много подобных выпадающих менюшек...
Код ActionScript 3.0:
import flash.display.Sprite;
import flash.filters.DropShadowFilter;
import flash.net.navigateToURL;
import flash.net.URLRequest;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Regular;
function createDropdownMenu(captionText:String,arr:Array):Sprite
{
var cont:Sprite = new Sprite();
cont.addEventListener(MouseEvent.ROLL_OVER,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;new Tween(contItems,"y",Regular.easeIn,contItems.y,0,0.4,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,1,0.4,true);});
cont.addEventListener(MouseEvent.ROLL_OUT,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);});
cont.filters = [new DropShadowFilter(4,45,0x000000,0.4,4,4,1)];
var caption:Item = new Item();
cont.addChild(caption);
caption.item_txt.text = captionText;
var contDropdownMenu:Sprite = new Sprite();
cont.addChild(contDropdownMenu);
contDropdownMenu.x = 0;
contDropdownMenu.y = caption.height;
var l:uint = arr.length;
var contItems:Sprite = new Sprite();
contItems.graphics.beginFill(0x000000,0);
contItems.graphics.drawRect(0,0,contItems.width,contItems.height * l);
contItems.graphics.endFill();
contDropdownMenu.addChild(contItems);
for (var i:uint = 0; i < l; i++)
{
var item:Item = new Item();
contItems.addChild(item);
item.item_txt.text = arr[i][0];
item.x = 0;
item.y = i * item.height;
item.alpha = 0.6;
item.buttonMode = true;
item.mouseChildren = false;
item.addEventListener(MouseEvent.CLICK,arr[i][1]);
item.addEventListener(MouseEvent.MOUSE_OVER,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,1,0.4,true);});
item.addEventListener(MouseEvent.MOUSE_OUT,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,0.6,0.4,true);});
}
var contItemsMask:Sprite = new Sprite();
contItemsMask.graphics.beginFill(0x000000,1);
contItemsMask.graphics.drawRect(0,0,contItems.width,contItems.height);
contItemsMask.graphics.endFill();
contDropdownMenu.addChild(contItemsMask);
contItems.mask = contItemsMask;
contItems.y = - contItems.height;
return cont;
}
var arr:Array = [["Псков",func_1],["Великие Луки",func_2],["Остров",func_3]];
var arr2:Array = [["Великая",func_4],["Шелонь",func_5],["Ловать",func_6]];
var dropdownMenu:Sprite = createDropdownMenu("Города",arr);
addChild(dropdownMenu);
dropdownMenu.x = 50;
dropdownMenu.y = 50;
var dropdownMenu2:Sprite = createDropdownMenu("Реки",arr2);
addChild(dropdownMenu2);
dropdownMenu2.x = 250;
dropdownMenu2.y = 50;
function func_1(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Псков")));
}
function func_2(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Великие Луки")));
}
function func_3(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Остров")));
}
function func_4(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Великая")));
}
function func_5(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Шелонь")));
}
function func_6(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://pskovmir.edapskov.ru/index.php?q=" + encodeURI("Ловать")));
}
Результат:
Вот, пожалуй, и всё :-)
Скачать исходник к данному уроку можно по следующей ссылке - скачать (под Adobe Flash CS5).
Дополнение. Добавляем иконки в выпадающее меню.
В комментариях спросили, как в описанное выше меню добавить иконки. Думаю, это можно реализовать следующим образом...
Вернёмся к мувиклипу Item и создадим внутри него ещё один мувик по имени icons. В MovieClip-е icons, как можно догадаться по его имени, хранятся иконки. Каждая иконка лежит на отдельном кадре. Все кадры (кроме первого) подписаны.
Небольшие изменения надо внести и в код...
Код ActionScript 3.0:
/*
импорт классов
*/
import flash.display.Sprite;
import flash.filters.DropShadowFilter;
import flash.net.navigateToURL;
import flash.net.URLRequest;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Regular;
/*
функция, которая будет создавать выпадающее меню
*/
function createDropdownMenu(captionText:String,arr:Array):Sprite
{
/*
контейнер для всего выпадающего меню
*/
var cont:Sprite = new Sprite();
cont.addEventListener(MouseEvent.ROLL_OVER,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;new Tween(contItems,"y",Regular.easeIn,contItems.y,0,0.4,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,1,0.4,true);});
cont.addEventListener(MouseEvent.ROLL_OUT,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);});
cont.filters = [new DropShadowFilter(4,45,0x000000,0.4,4,4,1)];
/*
заголовок выпадающего меню
*/
var caption:Item = new Item();
cont.addChild(caption);
caption.item_txt.text = captionText;
/*
контейнер для кнопок выпадающего меню и маски
*/
var contDropdownMenu:Sprite = new Sprite();
cont.addChild(contDropdownMenu);
contDropdownMenu.x = 0;
contDropdownMenu.y = caption.height;
/*
количество кнопок в выпадающем меню
*/
var l:uint = arr.length;
/*
контейнер только для кнопок выпадающего меню
*/
var contItems:Sprite = new Sprite();
contItems.graphics.beginFill(0x000000,0);
contItems.graphics.drawRect(0,0,contItems.width,contItems.height * l);
contItems.graphics.endFill();
contDropdownMenu.addChild(contItems);
/*
создаём сами кнопки выпадающего меню
*/
for (var i:uint = 0; i < l; i++)
{
var item:Item = new Item();
contItems.addChild(item);
item.item_txt.text = arr[i][0];
item.icons.gotoAndStop(arr[i][2]);
item.x = 0;
item.y = i * item.height;
item.alpha = 0.6;
item.buttonMode = true;
item.mouseChildren = false;
item.addEventListener(MouseEvent.CLICK,arr[i][1]);
item.addEventListener(MouseEvent.MOUSE_OVER,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,1,0.4,true);});
item.addEventListener(MouseEvent.MOUSE_OUT,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,0.6,0.4,true);});
}
/*
маска
*/
var contItemsMask:Sprite = new Sprite();
contItemsMask.graphics.beginFill(0x000000,1);
contItemsMask.graphics.drawRect(0,0,contItems.width,contItems.height);
contItemsMask.graphics.endFill();
contDropdownMenu.addChild(contItemsMask);
contItems.mask = contItemsMask;
/*
первоначальное положение контейнера с кнопками выпадающего меню
*/
contItems.y = - contItems.height;
/*
возвращаем результат
*/
return cont;
}
/*
массив с данными, необходимыми для построения выпадающего меню
В каждом вложенном массиве есть следующие элементы:
- имя кнопки выпадающего меню
- функция, которая будет вызываться при клике пользователя по соответствующему пункту выпадающего меню
- названием кадра, на котором лежит нужная иконка
*/
var arr:Array = [["Google",func_1,"google"],["Facebook",func_2,"facebook"],["Twitter",func_3,"twitter"]];
/*
создаём выпадающее меню
первый параметр - заголовок меню
второй параметр - массив с данными (надпись, функция, метка кадра с иконкой) для создания кнопок выпадающего меню
*/
var dropdownMenu:Sprite = createDropdownMenu("Select:",arr);
/*
добавляем меню в список отображения
*/
addChild(dropdownMenu);
/*
позиционируем меню на сцене флеш-ролика
*/
dropdownMenu.x = 50;
dropdownMenu.y = 50;
/*
функции, которые будут вызываться по клику на соответствующем пункте меню
*/
function func_1(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://www.google.ru/"));
}
function func_2(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://www.facebook.com/"));
}
function func_3(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://twitter.com/"));
}
Результат:
Скачать исходник примера с иконками можно здесь (под Adobe Flash CS5).
Дополнение. Открываем меню по клику мышки над заголовком.
На этот раз графику менять не будем. Изменения коснуться только кода...
Код ActionScript 3.0:
/*
импорт классов
*/
import flash.display.Sprite;
import flash.filters.DropShadowFilter;
import flash.net.navigateToURL;
import flash.net.URLRequest;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Regular;
/*
функция, которая будет создавать выпадающее меню
*/
function createDropdownMenu(captionText:String,arr:Array):Sprite
{
/*
контейнер для всего выпадающего меню
*/
var cont:Sprite = new Sprite();
cont.addEventListener(MouseEvent.ROLL_OUT,function(event:MouseEvent){var contItems:Sprite = event.target.getChildAt(1).getChildAt(0) as Sprite;if(contItems.mouseEnabled){new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);contItems.mouseEnabled=false;}});
cont.filters = [new DropShadowFilter(4,45,0x000000,0.4,4,4,1)];
/*
заголовок выпадающего меню
*/
var caption:Item = new Item();
cont.addChild(caption);
caption.item_txt.text = captionText;
caption.mouseChildren = false;
caption.addEventListener(MouseEvent.CLICK,function(event:MouseEvent){var contItems:Sprite = event.target.parent.getChildAt(1).getChildAt(0) as Sprite;if(contItems.mouseEnabled){new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);contItems.mouseEnabled=false;}else{new Tween(contItems,"y",Regular.easeIn,contItems.y,0,0.4,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,1,0.4,true);contItems.mouseEnabled=true;}});
/*
контейнер для кнопок выпадающего меню и маски
*/
var contDropdownMenu:Sprite = new Sprite();
cont.addChild(contDropdownMenu);
contDropdownMenu.x = 0;
contDropdownMenu.y = caption.height;
/*
количество кнопок в выпадающем меню
*/
var l:uint = arr.length;
/*
контейнер только для кнопок выпадающего меню
*/
var contItems:Sprite = new Sprite();
contItems.graphics.beginFill(0x000000,0);
contItems.graphics.drawRect(0,0,contItems.width,contItems.height * l);
contItems.graphics.endFill();
contDropdownMenu.addChild(contItems);
contItems.mouseEnabled = false;
/*
создаём сами кнопки выпадающего меню
*/
for (var i:uint = 0; i < l; i++)
{
var item:Item = new Item();
contItems.addChild(item);
item.item_txt.text = arr[i][0];
item.icons.gotoAndStop(arr[i][2]);
item.x = 0;
item.y = i * item.height;
item.alpha = 0.6;
item.buttonMode = true;
item.mouseChildren = false;
item.addEventListener(MouseEvent.CLICK,arr[i][1]);
item.addEventListener(MouseEvent.MOUSE_OVER,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,1,0.4,true);});
item.addEventListener(MouseEvent.MOUSE_OUT,function(event:MouseEvent){new Tween(event.target,"alpha",Regular.easeIn,event.target.alpha,0.6,0.4,true);});
}
/*
маска
*/
var contItemsMask:Sprite = new Sprite();
contItemsMask.graphics.beginFill(0x000000,1);
contItemsMask.graphics.drawRect(0,0,contItems.width,contItems.height);
contItemsMask.graphics.endFill();
contDropdownMenu.addChild(contItemsMask);
contItems.mask = contItemsMask;
/*
первоначальное положение контейнера с кнопками выпадающего меню
*/
contItems.y = - contItems.height;
/*
возвращаем результат
*/
return cont;
}
/*
массив с данными, необходимыми для построения выпадающего меню
В каждом вложенном массиве есть следующие элементы:
- имя кнопки выпадающего меню
- функция, которая будет вызываться при клике пользователя по соответствующему пункту выпадающего меню
- названием кадра, на котором лежит нужная иконка
*/
var arr:Array = [["Google",func_1,"google"],["Facebook",func_2,"facebook"],["Twitter",func_3,"twitter"]];
/*
создаём выпадающее меню
первый параметр - заголовок меню
второй параметр - массив с данными (надпись, функция, метка кадра с иконкой) для создания кнопок выпадающего меню
*/
var dropdownMenu:Sprite = createDropdownMenu("Select:",arr);
/*
добавляем меню в список отображения
*/
addChild(dropdownMenu);
/*
позиционируем меню на сцене флеш-ролика
*/
dropdownMenu.x = 50;
dropdownMenu.y = 50;
/*
функции, которые будут вызываться по клику на соответствующем пункте меню
*/
function func_1(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://www.google.ru/"));
}
function func_2(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://www.facebook.com/"));
}
function func_3(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://twitter.com/"));
}
Результат:
А к этому примеру исходник можно скачать здесь (под Adobe Flash CS5).
Выпадающее меню со звуком и анимацией пунктов.
Изменения придётся вносить как в графику (создадим анимацию внутри мувиклипа Item), так и в код...
Код ActionScript 3.0:
/*
импорт классов
*/
import flash.display.Sprite;
import flash.display.MovieClip;
import flash.filters.DropShadowFilter;
import flash.net.navigateToURL;
import flash.net.URLRequest;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.Regular;
/*
функция, которая будет создавать выпадающее меню
*/
function createDropdownMenu(captionText:String,arr:Array):Sprite
{
/*
контейнер для всего выпадающего меню
*/
var cont:Sprite = new Sprite();
cont.addEventListener(MouseEvent.ROLL_OUT,function(event:MouseEvent){var contItems:Sprite = event.currentTarget.getChildAt(1).getChildAt(0) as Sprite;if(contItems.mouseEnabled){new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);contItems.mouseEnabled=false;}});
cont.filters = [new DropShadowFilter(4,45,0x000000,0.4,4,4,1)];
/*
заголовок выпадающего меню
*/
var caption:Item = new Item();
cont.addChild(caption);
caption.item_txt.text = captionText;
caption.mouseChildren = false;
caption.addEventListener(MouseEvent.CLICK,function(event:MouseEvent){new ClickSound().play();var contItems:Sprite = event.currentTarget.parent.getChildAt(1).getChildAt(0) as Sprite;if(contItems.mouseEnabled){new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);contItems.mouseEnabled=false;}else{new Tween(contItems,"y",Regular.easeIn,contItems.y,0,0.4,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,1,0.4,true);contItems.mouseEnabled=true;}});
/*
контейнер для кнопок выпадающего меню и маски
*/
var contDropdownMenu:Sprite = new Sprite();
cont.addChild(contDropdownMenu);
contDropdownMenu.x = 0;
contDropdownMenu.y = caption.height;
/*
количество кнопок в выпадающем меню
*/
var l:uint = arr.length;
/*
контейнер только для кнопок выпадающего меню
*/
var contItems:Sprite = new Sprite();
contItems.graphics.beginFill(0x000000,0);
contItems.graphics.drawRect(0,0,contItems.width,contItems.height * l);
contItems.graphics.endFill();
contDropdownMenu.addChild(contItems);
contItems.mouseEnabled = false;
/*
создаём сами кнопки выпадающего меню
*/
for (var i:uint = 0; i < l; i++)
{
var item:Item = new Item();
contItems.addChild(item);
item.item_txt.text = arr[i][0];
item.icons.gotoAndStop(arr[i][2]);
item.x = 0;
item.y = i * item.height;
item.alpha = 0.6;
item.buttonMode = true;
item.mouseChildren = false;
item.addEventListener(MouseEvent.MOUSE_DOWN,arr[i][1]);
item.addEventListener(MouseEvent.MOUSE_UP,function(event:MouseEvent){new ClickSound().play();var contItems:Sprite = event.currentTarget.parent as Sprite;if(contItems.mouseEnabled){new Tween(contItems,"y",Regular.easeIn,contItems.y,-contItems.height,0.6,true);new Tween(contItems,"alpha",Regular.easeIn,contItems.alpha,0,0.6,true);contItems.mouseEnabled=false;}});
item.addEventListener(MouseEvent.MOUSE_OVER,function(event:MouseEvent){new ClickSound().play();var item:MovieClip = event.currentTarget as MovieClip;item.gotoAndPlay(1);new Tween(item,"alpha",Regular.easeIn,item.alpha,1,0.4,true);});
item.addEventListener(MouseEvent.MOUSE_OUT,function(event:MouseEvent){var item:MovieClip = event.currentTarget as MovieClip;item.gotoAndStop(1);new Tween(item,"alpha",Regular.easeIn,item.alpha,0.6,0.4,true);});
}
/*
маска
*/
var contItemsMask:Sprite = new Sprite();
contItemsMask.graphics.beginFill(0x000000,1);
contItemsMask.graphics.drawRect(0,0,contItems.width,contItems.height);
contItemsMask.graphics.endFill();
contDropdownMenu.addChild(contItemsMask);
contItems.mask = contItemsMask;
/*
первоначальное положение контейнера с кнопками выпадающего меню
*/
contItems.y = - contItems.height;
/*
возвращаем результат
*/
return cont;
}
/*
массив с данными, необходимыми для построения выпадающего меню
В каждом вложенном массиве есть следующие элементы:
- имя кнопки выпадающего меню
- функция, которая будет вызываться при клике пользователя по соответствующему пункту выпадающего меню
- названием кадра, на котором лежит нужная иконка
*/
var arr:Array = [["Google",func_1,"google"],["Facebook",func_2,"facebook"],["Twitter",func_3,"twitter"]];
/*
создаём выпадающее меню
первый параметр - заголовок меню
второй параметр - массив с данными (надпись, функция, метка кадра с иконкой) для создания кнопок выпадающего меню
*/
var dropdownMenu:Sprite = createDropdownMenu("Select:",arr);
/*
добавляем меню в список отображения
*/
addChild(dropdownMenu);
/*
позиционируем меню на сцене флеш-ролика
*/
dropdownMenu.x = 50;
dropdownMenu.y = 50;
/*
функции, которые будут вызываться по клику на соответствующем пункте меню
*/
function func_1(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://www.google.ru/"));
}
function func_2(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://www.facebook.com/"));
}
function func_3(event:MouseEvent):void
{
navigateToURL(new URLRequest("https://twitter.com/"));
}
Кроме этого, нам надо настроить звук, который мы используем в скрипте. О том, как импортировать звук в флеш-проекты смотрите тут: Flash IDE & ActionScript 3.0 & Sound.
Результат:
Скачать исходник примера можно здесь (под Adobe Flash CS5).