MiniUI: выпадающий список

Продолжим рассматривать библиотеку компонентов MiniUI (на ActionScript 3.0) и сегодня остановимся на компоненте TextList. Данный компонент представляет из себя простой выпадающий список. Внешне TextList выглядит следующим образом:

Как видите, компонент смотрится весьма и весьма скромно, но удобен для пользователей и работает исправно.

Давайте же рассмотрим, как TextList использовать в flash-приложениях.

Первым делом, нам, конечно, потребуется сама библиотека MiniUI. Напомню, что скачать её можно по ссылкам, указанным в посте «MiniUI: компоненты Label и Button». После того, как скачаете архив с библиотекой, вам надо разархивировать его содержимое в ту папку, в которой у вас находится ваш флеш-проект.

А теперь давайте рассмотрим самый простой способ создания выпадающего списка с помощью компонента TextList.

Код ActionScript 3.0:

/* импорт классов */ import sliz.miniui.TextList; /* создаём выпадающий список */ var textList:TextList = new TextList(["пункт № 1","пункт № 2","пункт № 3","пункт № 4"],50,50,100,this,func); /* функция, которая вызывается при выборе пункта из выпадающего списка */ function func(event:Event):void{ /* получаем название выбранного пункта */ trace(event.target.text) /* получаем индекс выбранного пункта */ trace(event.target.getSelectItem().index); /* получаем индекс предыдущего выбранного пункта списка */ trace(event.target.getLastSelectItem().index); }

Здесь конструктор объектов TextList принимает следующие параметры:

1.) массив с названиями пунктов выпадающего списка;

2.) положение выпадающего списка по оси X;

3.) положение выпадающего списка по оси Y;

4.) ширина выпадающего списка;

5.) объект-контейнер, внутрь которого будет помещён выпадающий список;

6.) функция, которая будет вызываться при клике по пункту в выпадающем списке.

Добавить новые пункты в выпадающий список можно и с помощью специального метода add():

Код ActionScript 3.0:

/* импорт классов */ import sliz.miniui.TextList; /* создаём выпадающий список */ var textList:TextList = new TextList(["пункт № 1","пункт № 2","пункт № 3","пункт № 4"],50,50,100,this,func); /* функция, которая вызывается при выборе пункта из выпадающего списка */ function func(event:Event):void{ /* получаем название выбранного пункта */ trace(event.target.text) /* получаем индекс выбранного пункта */ trace(event.target.getSelectItem().index); /* получаем индекс предыдущего выбранного пункта списка */ trace(event.target.getLastSelectItem().index); } /* добавляем новый пункт в список */ textList.add("пункт № 5",4);

Но, допустим, надо заменить уже имеющиеся пункты выпадающего списка на новые. Для этого имеется метод reset():

Код ActionScript 3.0:

/* импорт классов */ import sliz.miniui.TextList; /* создаём выпадающий список */ var textList:TextList = new TextList(["пункт № 1","пункт № 2","пункт № 3","пункт № 4"],50,50,100,this,func); /* функция, которая вызывается при выборе пункта из выпадающего списка */ function func(event:Event):void{ /* получаем название выбранного пункта */ trace(event.target.text) /* получаем индекс выбранного пункта */ trace(event.target.getSelectItem().index); /* получаем индекс предыдущего выбранного пункта списка */ trace(event.target.getLastSelectItem().index); } /* добавляем новый пункт в список */ textList.add("пункт № 5",4); /* удаляем все старые пункты и устанавливаем новые */ textList.reset(["пункт № 6","пункт № 7","пункт № 8"]);

Результат:

По-умолчанию, показывается первый пункт выпадающего списка. Если надо, чтобы показывался не первый пункт, а какой-то другой, то используем метод select():

Код ActionScript 3.0:

/* импорт классов */ import sliz.miniui.TextList; /* создаём выпадающий список */ var textList:TextList = new TextList(["пункт № 1","пункт № 2","пункт № 3","пункт № 4"],50,50,100,this,func); /* функция, которая вызывается при выборе пункта из выпадающего списка */ function func(event:Event):void{ /* получаем название выбранного пункта */ trace(event.target.text) /* получаем индекс выбранного пункта */ trace(event.target.getSelectItem().index); /* получаем индекс предыдущего выбранного пункта списка */ trace(event.target.getLastSelectItem().index); } /* добавляем новый пункт в список */ textList.add("пункт № 5",4); /* выбираем третий пункт выпадающего списка */ textList.select(2);

Результат:

Если вам надо, чтобы сразу были видны все пункты, то используем метод showMenu():

Код ActionScript 3.0:

/* импорт классов */ import sliz.miniui.TextList; /* создаём выпадающий список */ var textList:TextList = new TextList(["пункт № 1","пункт № 2","пункт № 3","пункт № 4"],50,50,100,this,func); /* функция, которая вызывается при выборе пункта из выпадающего списка */ function func(event:Event):void{ /* получаем название выбранного пункта */ trace(event.target.text) /* получаем индекс выбранного пункта */ trace(event.target.getSelectItem().index); /* получаем индекс предыдущего выбранного пункта списка */ trace(event.target.getLastSelectItem().index); } /* добавляем новый пункт в список */ textList.add("пункт № 5",4); /* показываем все пункты выпадающего меню */ textList.showMenu();

Результат:

Обратным, по отношению к showMenu(), является метод hideMenu().

Ну а для закрепления напишем небольшое приложение со списком поисковых систем. Пользователь может выбрать пункт с нужной поисковой системой и откроется главная страница этого поисковика.

Код ActionScript 3.0:

/* импорт классов */ import sliz.miniui.TextList; import flash.net.URLRequest; import flash.net.navigateToURL; /* создаём выпадающий список */ new TextList(["Yandex","Google","Mail","Rambler"],50,50,100,this,func); /* функция, которая вызывается при выборе пункта из выпадающего списка */ function func(event:Event):void { /* получаем индекс выбранного пункта */ var selectItem:uint = event.target.getSelectItem().index; /* переходим к соответствующему поисковику */ if (event.target.getLastSelectItem().index >= 0) { if (selectItem==0) { navigateToURL(new URLRequest("http://www.yandex.ru/")); } else if (selectItem==1) { navigateToURL(new URLRequest("http://www.google.ru/")); } else if (selectItem==2) { navigateToURL(new URLRequest("http://mail.ru/")); } else if (selectItem==3) { navigateToURL(new URLRequest("http://www.rambler.ru/")); } } }

Результат:

Вот так вот.

Автор: admin

Дата добавления: 2012-05-01

Просмотров: 3058

Рейтинг поста: +14-

Правила перепечатки

Социальные закладки:
Комментарии:
Комментатор
Комментарий добавил(а): Роман
Дата добавления: 2014-05-13
Спасибо огромное, то что нужно.Очень помогли , если бы не вы застрял бы на этом моменте.
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2014-05-13
Понял. Вам нужны не ссылки, а что-то вроде этого:


import sliz.miniui.TextList;

var textList:TextList = new TextList(["Раздел 1", "Раздел 2", "Раздел 3", "Раздел 4"], 20, 20, 200, this, func);

function func(event:Event):void{
this.gotoAndStop(event.target.getSelectItem().index + 1);
}


Это самое простое решение, которое приходит в голову. Сами разделы при этом будут размещаться на отдельных кадрах ролика: Раздел 1 - на первом, Раздел 2 - на втором и т.д..

Пример и исходник тут - edapskov.ru/content/electronic_textbook.rar
Комментатор
Комментарий добавил(а): Роман
Дата добавления: 2014-05-13
Мне нужно сделать как бы электронный учебник и я хотел бы использовать это меню под разделы для тем, как бы выбрал нажал на нужную тему в этом контекстном меню и оно перешло на swf где лекция , но нужно чтоб это работало не через браузер.Как то так. Спасибо за отзывчивость.Может что посоветуете.
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2014-05-13
Хм... Сдаётся мне, что вы не совсем понимаете, о чём спрашиваете. Давайте так: подробно опишите то, что вы хотите получить, а я потом скажу, как это сделать.
Комментатор
Комментарий добавил(а): Роман
Дата добавления: 2014-05-13
Ну а все же код есть? можно так сделать мне не нужно чтоб это работало в браузере , а просто в самом флеш.
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2014-05-13
Роман, не совсем понимаю ваш вопрос. Если вы о ссылке на swf, то, честно говоря, не стоит так делать. Гораздо практичнее встроить swf в веб-страницу и давать ссылку именно на веб-страницу, а не на swf.
Комментатор
Комментарий добавил(а): Роман
Дата добавления: 2014-05-13
Здравствуйте, как осуществить переход на swf ?
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2014-02-22
Комментатор
Комментарий добавил(а): Денис
Дата добавления: 2014-02-22
Как изменить шрифт элементов в списке?
Комментатор
Комментарий добавил(а): Просто я
Дата добавления: 2012-05-04
Что ж , сообщение нашло адресата. Не думаю, что я чем-то заслужила такую ненависть. Но пусть будет так.
Добавить комментарий:







[ + ] помощь по форматирование текста

Идиот-тест

Если все обязательные поля (отмечены * ) заполнены необходимой информацией, то нажимаем кнопку Добавить комментарий.

Меню
Подписка
Рубрики
Метки
Последние комментарии
Рейтинг постов
Реклама
Друзья
География гостей
Статистика
Яндекс.Метрика