Компонент SCROLLPANE и все его особенности
RATFACE
И так что же вас ждет в етом уроке!
В етом уроке я расскажу о том как пользоваться этим компонентом, его
осбонности, ньюансы и их решения а также проблемы которые нельзя решить!
Для тех кто вообще не знает как использовать етот чудесный, на мой
взгляд, компонент я начну рассказывать прямо сейчас. А те кто уже знает
промотайте ниже! -)
И так! Поехали!
Как обычно создаете обычный документ с обычным размером 550х400 больше вам
для тест странички не понадобиться. Кидаете на него ScrollPane копмонент,
растените его в ширену или ввысоту,
как вам удобно, до нужного вам размера. В моем уроке я растену
компонент скажем до 300 в ширену (width) и назовем его cmpImageScroller
к примеру, а всякие название
начинающиеся на myТРАТАТА уже надоели.
Создаете MovieClip ааабсолютно пустой, называет его mcScrollContent и
помещаете его в библиотеку :-) там ему место. Клацаете на него правой кнопкой
и выбираете Linkage вам откроеться окошко с параметрами. Клацаете на
белом квадратеке на против которого написано Export for ActionScript после
чего для вас разблокируються два поля ввода. В поле Identifier напиши имя
вашего MovieClip'a в библиотеки, скажем
назовите "imageScrollerContent". Он будет контейнером всего, что вы!
будете грузить в ScrollPane.
Итак в нашем фрэйме де вы собрались писать скрипт начинаем ПРОГРАМИРОВАТЬ!
Пишите следующие
cmpImageScroller.contentPath = "imageScrollerContent";
Что же етой срокой мы сделали!? Мы задали нашему ScrollPane'y контейнер в
нутри которого мы будим размещать картинки или .swf або то что вам нужно!
Так мы ето зделали а вот что делает Flash!? А он делает следующее - он
производит attachMovie используя LinkageName которое вы даете ему в
contentPath тоесть imageScrollerContent. Даёт ему определеное конкретное имя и глубину.
Теперь как нам обратиться в етому контейнеру!? Наш контейнер в
ScrollPane'e называеться spContentHolder ето значит что теперь
все что мы хотим загрузить в ScrollPane мы грузим в наш контейнер
по пути cmpImageScroller.spContentHolder !
Теперь для теста создайте MovieClip и нарисуйте в нем квадрат скажем 80х80.
Теперь надо провести одну хитрость. Компонент ScrollPane владеет рядом
недостатков которые приходиться решать с помощью небольших хитростей.
Если вы хотите что бы между вашими картинками была дистанция у нас не
получиться получить её с помощью скрипта скажем увеличив координату на
ту величину на которую нам нада. Если мы так сделаем то все будет ок, НО!
Последния картинка будет не просто плотно прилегать к краю ScrollPane но
и кусок картинки может уйти за пределы видимости! Поетому мы прибегним к
следущему методу! Мы создадим еще один MovieClip с именем скажем mcShadow,
помести его с правой стороны нашей картинки (кубика) высота етого клипа
должна быть равна высоте картинки или высоте максимального размера картинки
а ширина етого клипа как раз и будит то самое расстояние между картинками.
И еще одна очень важная деталь. В настройках MovieClip'a (Properties)
выставить сolor в alpha и установить значение в 0! Он станет невидимым
собсна что нам и нада! -)
И так все что нам нада мы подготовили а дальше в фрэйм де у вас написано
совсем чуть скрипта, скопируйте и вставьте то что написано ниже там все
с коментам !!!
Только после копирования на торопитесь запускать. Изза плохого пространства
для вписывания уроков на Flasher.ru комменты могу чуть сползать. Просто
посмотрите скрипт и поправьте строки!
stop()
//***********************************************
// initialize variables
//***********************************************
//стартовая позиция картинок по X
var startImageX:Number = 10;
//стартовая позиция картинок по Y
var startImageY:Number = 10;
//дистанция между картинками
var imageShift:Number = 0;
//текущая координата картинки
var currImageX:Number = 10;
//создаем контейнер в ScrollPane'e
cmpImageScroller.contentPath = "imageScrollerContent";
//вставляем в компонент 5 картинок в моем случае одних и тех же
for(var i=0;i<5;i++)
{
//добовляем картинку из библиотеки
cmpImageScroller.spContentHolder.attachMovie("image", "image"+i, i);
//оптимизируем скрипт создавая переменную image передавая ей ссылку на нашу картинку
var image:MovieClip = cmpImageScroller.spContentHolder["image"+i];
//выставляем координаты токо что созданной картинки
image._x = startImageX;
image._y = startImageY;
//выщитываем новую координату для следующей картинки
startImageX += image._width + imageShift;
}
И так вы должны получить ScrollPane с вашими картинка. Ели не работает вы
всегда можете качнуть мой исходник с етой темо и посмотреть как все оно там =)
А ТЕПЕРЬ НЕКОТОРЫЕ ОСОБЕННОСТИ!!!!
Можно сказать так что одну из особенностей мы уже прошли выше! Ето
момент с расстоянием между картинками.
Есть еще один момент. Проработав урок который описан выше вы естественно
заметите что добовляяя картинки у компонента автоматичестки появляеться
Scroll. ScrollPane устроен так что его Scroll формируеться один раз и не в
тот момент когда вы в него что то загружаете!!! А в тот когда запускаете
свою ФЛЭШКУ! Если вы захотите запустить флэшку и при нажатии на,
скажем кнопку, загрузить в ScrollPane свои картинки то картинки загрузяться
а вот Scroll не появиться! -(( ТУПО!? ДА! Я тож так считаю -)) Но что
поделать. Хотя НЕТ! ВРУ! Поделать есть что можно внести пару изменений в
компонент Macromedi'u а вот как ето я вам потом расскажу! На етом все
спасибо за ВНИМАНИЕ! -)
|
