Скроллинг для MovieClip-а в ActionScript



Опишу самый доступный способ создания скролла для мувиклипа. Часто возникают ситуации когда разбитие на страницы вашего flash-мувика неприемлемо, следовательно нужно сделать скроллинг чтобы отобразить длинный контент (созданный динамически) на одной странице.

Итак с самого начала - создайте новый flash-документ. Добавьте из компонентов в библиотеку UIScrollBar (вызвать окно компонентов обычно можно нажав Ctrl+F7). Теперь открываем панель "actions" и пишем туда такой код:

// Подключаем классы "скроллбара" и "прямоугольника" (ниже понадобятся)
import flash.geom.Rectangle
import mx.controls.UIScrollBar
// Создаем movieclip, в котором у нас будет находится содержимое:
_root.createEmptyMovieClip("stage0", _root.getNextHighestDepth());
// Добавим в 'stage0' 30 текстовых строк (для наглядности):
for (var i = 0; i < 30; i ++) {
   stage0.createTextField('myText' + i, stage0.getNextHighestDepth(),5,5+30*i,50,30);
   stage0['myText' + i].text = 'Строка #' + i;
}
// Создаем видимую область - прямоугольник (размером во все окно):
stage0.scrollRect = new Rectangle(0, 0, Stage.width, Stage.height);
// Если высота контента больше, чем высота окна - делаем скролл:
if (stage0._height > Stage.height) {
   makeScrollBar();
}
// Функция, добавляющая скролл:
function makeScrollBar():UIScrollBar {
   // Обьект добавляем не в мувиклип stage0, а в родитель - _root:
   // ! Компонент UIScrollBar должен быть в библиотеке:
   var scrollbar:UIScrollBar = _root.createClassObject(UIScrollBar, "scrollbar",
                                                       _root.getNextHighestDepth());
   // Двигаем обьект на нужное местоположение (у нас - справа):
   scrollbar.move(Stage.width - scrollbar.width, 0);
   // Задаем размеры (ширину не трогаем, высоту - во все окно):
   scrollbar.setSize(scrollbar.width, Stage.height);
   // Число видимых строк, минимальная позиция, максимальная позиция:
   scrollbar.setScrollProperties(stage0._height, 0, stage0._height - Stage.height);
   // Размер прокрутки (в строках) при клике на бегунок:
   scrollbar.pageScrollSize = stage0._height;
   // Добавляем обработчик события "scroll" - функцию onScrollMc:
   scrollbar.addEventListener("scroll", onScrollMc);
   return scrollbar;
}
// Обработчик события:
function onScrollMc(event:Object):Void {
   // Рисуем новый прямоугольник-маску, в зависимости от позиции скролла:
   stage0.scrollRect = new Rectangle(0, event.target.scrollPosition,
                                     Stage.width, Stage.height);
}

В комментариях я постарался написать как можно более подробно. Добавлю только, что писал этот код на actionscript 2. Будьте внимательны с методом getNextHighestDepth - могут возникнуть проблемы с удалением созданных с использованием этой функции сущностей.

В прикрепленном файле находится исходник (.fla). Результат можно посмотреть здесь же:

Прикрепленный файлРазмер
sample.fla448 кб

Комментарии

Приветствую! у меня вопрос есть по коду: как вставить несколько строк или текст в этот код?!

Отправить комментарий

Содержание этого поля является приватным и не предназначено к показу.
  • Разрешаю теги: <a> <em> <strong> <pre> <ul> <ol> <li>
  • Строки и параграфы переносятся автоматически.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.

Подробнее о форматировании

Image CAPTCHA
Регистр символов учитывается.