Программное рисование указателей в ActionScript 3.0

Я уже неоднократно обращался к теме динамического рисования в ActionScript (посты №18, №28, №32 и №42). Но сегодня будут рассмотрены не стандартные возможности языка ActionScript 3.0, а библиотека классов от dncompute.com, которая к уже имеющимся в арсенале AS 3.0 геометрическим примитивам добавляет возможность быстрого и удобного создания различных указателей (arrow). То есть, к таким методам как drawRect(), drawRoundRect(), drawCircle() и подобным, добавляется ещё один очень полезный метод - drawArrow(). С помощью метода drawArrow() можно, например, одной строчкой кода создать следующий указатель:

Указатель

Работать с методом drawArrow() довольно просто. Ниже представлен простой случай использования данного метода в флеш-проекте.

Код ActionScript 3.0:

/* Импортируем класс GraphicsUtil. */ import com.dncompute.graphics.GraphicsUtil; /* Создаём спрайт-контейнер, в котором и будем рисовать указатель. Для спрайта-контейнера указываем стиль обводки и цвет заливки, которые будут применены и к указателю. */ var cont:Sprite = new Sprite(); cont.graphics.lineStyle(1,0x000000); cont.graphics.beginFill(0x999999); /* Рисуем указатель. */ GraphicsUtil.drawArrow(cont.graphics, new Point(100, 100), new Point(450, 300)); /* Завершаем заливку (необязательно). */ cont.graphics.endFill(); /* Добавляем спрайт-контейнер в список отображения. */ addChild(cont);

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

Загрузить Adobe Flash Player

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

Свойства класса ArrowStyle:

- shaftThickness - толщина основной части указателя;

- headWidth - ширина головной части стрелки;

- headLength - длина головной части стрелки;

- shaftPosition - изменяет форму головной части указателя

- edgeControlPosition - регулирует искривление краёв головной части стрелки.

Пример использования класса ArrowStyle для настройки стиля указателя приводится ниже:

/* Импортируем необходимые классы. */ import com.dncompute.graphics.GraphicsUtil; import com.dncompute.graphics.ArrowStyle; /* Определяем стиль будущей стрелки. */ var arrow_style:ArrowStyle = new ArrowStyle(); arrow_style.shaftThickness = 5; arrow_style.headWidth = 50; arrow_style.headLength = 50; arrow_style.shaftPosition = .5; arrow_style.edgeControlPosition = .5; /* Создаём спрайт-контейнер, в котором и будем рисовать стрелку. */ var cont:Sprite = new Sprite(); cont.graphics.beginFill(0x999999); /* Рисуем стрелку. */ GraphicsUtil.drawArrow(cont.graphics, new Point(100, 100), new Point(450, 300), arrow_style); /* Завершаем заливку (необязательно). */ cont.graphics.endFill(); /* Добавляем спрайт-контейнер в список отображения. */ addChild(cont);

Теперь стрелка смотрится гораздо лучше.

Данную библиотеку классов можно использовать по-разному. Для примера я немного изменил демо-ролик из урока по созданию пользовательского курсора мышки на ActionScript 3.0, добавив новый курсор:

import com.dncompute.graphics.GraphicsUtil; Mouse.hide(); var cur:Sprite = new Sprite(); cur.graphics.beginFill(0x333333); GraphicsUtil.drawArrow(cur.graphics, new Point(30, 30), new Point(0, 0), {shaftThickness:5,headWidth:30,headLength:40, shaftPosition:0.50,edgeControlPosition:0.50}); cur.graphics.endFill(); addChild(cur); cur.visible = false; cur.mouseEnabled = false; var shadow:DropShadowFilter = new DropShadowFilter(); shadow.distance = 5; shadow.color = 0x999999; shadow.alpha = 0.5; shadow.angle = 45; cur.filters = [shadow]; stage.addEventListener(MouseEvent.MOUSE_MOVE,mMove); function mMove(event:MouseEvent):void { var coordX:int = event.stageX; var coordY:int = event.stageY; if (coordX >= 0 && coordY >= 0 && coordX <= stage.stageWidth && coordY <= stage.stageHeight) { cur.visible = true; cur.x = coordX; cur.y = coordY; event.updateAfterEvent(); } } stage.addEventListener(Event.MOUSE_LEAVE, mLeave); function mLeave(event:Event):void { cur.visible = false; }

Получилось следующее:

Загрузить Adobe Flash Player

Уверен, что найдётся не мало случаев, когда метод drawArrow() облегчит вашу работу над флеш-проектом.

Исходники приведённых примеров можно скачать тут (под Adobe Flash CS5.5).

Автор: admin

Дата добавления: 2011-09-06

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

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

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

Социальные закладки:
Комментарии:
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2013-02-02
Да, согласен. Так действительно красивее будет.
Комментатор
Комментарий добавил(а): RadmirXAn
Дата добавления: 2013-02-02
Хороший урок.
Надо добавить проверку на отображение стандартного курсора что бы его скрыть.
Т.к. при клике правой кнопкой мыши стандартный курсор отображается и не исчезает в дальнейшем.
Добавить комментарий:







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

Идиот-тест

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

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