Учимся изменять стандартные изображения курсоров
Часто бывает, что в соответствии с задумками дизайна, или по другим причинам нам нужно изменить стандартное изображение курсора в Flash на другое, своё собственное. Допустим вы хотите сделать анимированный курсор, наподобие “песочных-часов”, что появляются в Windows при загрузке, или мелкий текст, который можно было бы просматривать в увеличенном виде под лупой, согласитесь, смотрелось бы не плохо, если бы курсором в этом случае выступало само увеличительное стекло. В общем применений такому эффекту в флешках можно найти море, а как вы будете его использовать — это уже совсем другой вопрос. Нашей задачей сегодня является разобрать, на примере Flash урока, как такой эффект создаётся. Исходники прилагаются.
Разбираем всё по-полочкам на примерах
Собственно, что нужно для превращения стандартного Flash курсора, в «супер-мега-курсор», которого ни у кого нет? Нужно для этого:
1. а) Выключить старое изображение курсора;
2. б) Создать Movie Clip с новым изображением, и, каждый раз при передвижении мышки, присваивать ему координаты курсора.
Как это делается? Ну, если вас пугает смена координат, то подробнее об этом вы можете почитать в статье, посвящённой основным свойствам Movie Clip объектов в Flash. А что касается “срытия” и “открытия” курсора, то для этого в Flash существует специальный метод объекта Mouse, точнее их даже два:
1. Mouse.hide() — скрыть отображение курсора;
2. Mouse.show() — восстановить нормальное отображение курсора.
Вот, собственно, и всё. Теперь осталось только создать нужные объекты на рабочем поле:

И написать код:
/*
Сегодня мы научимся скрывать стандартное изображение курсора, и устанавливать любое
другое, которое нам понравится. делается это очень просто.
Во-первых, скрывается стандартное изображение курсора.
Во-вторых, выбирается нужный MovieClip объект, который будет просто двигаться за
курсором мышки.
*/
//
//СМОТРИМ
//
//Подгружаем необходимые классы (класс Tween)
import mx.transitions.Tween;
import mx.transitions.easing.*;
//Останавливаем проигрывание
stop();
//На рабочем столе у нас созданно 6 клипов-курсоров, которые мы будем передвигать, при
//наведении на них мышкой.
//Этот цикл, будет перебирать все клипы, заносить в переменные их начальные координаты
//и присваивать каждому клипу событие на onRollOver;
for (var i = 1; i<7; i++) {
//”Запоминаем” начальные координаты
_root[“mc”+i+“_mc”].varStartX = _root[“mc”+i+“_mc”]._x;
_root[“mc”+i+“_mc”].varStartY = _root[“mc”+i+“_mc”]._y;
//Задаём событие onRollOver
_root[“mc”+i+“_mc”].onRollOver = function() {
//Переменная _root.varCursor будет ссылаться на текущий MovieClip объект,
//который двигался за мышкой. При наведении на новый клип, старый нужно убрать
//на место, что мы и делаем следующим кодом.
//Плавно изменяем координаты по оси X
_root.varCursor.varTweenX.stop();
_root.varCursor.varTweenX = new Tween(_root.varCursor, “_x”, Regular.easeOut, _root.varCursor._x, _root.varCursor.varStartX, 0.5, true);
_root.varCursor.varTweenX.onMotionFinished = function() {
//После того, как Movie Clip встал на свою текущую позицию, мы “включаем” его.
this.obj.enabled = true;
};
//Плавно изменяем координаты по оси Y
_root.varCursor.varTweenY.stop();
_root.varCursor.varTweenY = new Tween(_root.varCursor, “_y”, Regular.easeOut, _root.varCursor._y, _root.varCursor.varStartY, 0.5, true);
//Присваиваем переменной _root.varCursor текущий Movie Clip объект, на который
//мы навели мышкой (курсором). Теперь, при движении мышки, текущий Movie Clip
//объект будет двигаться за курсором.
_root.varCursor = this;
//”Оключаем” текущий Movie Clip, чтобы, пока он будет двигаться за мышкой не
//срабатывало события onRollOver. Если объект не “отключить”, то это событие
//будет срабатывать постоянно, т.к. координаты клипа будут совпадать с
//координатами курсора.
this.enabled = false;
};
}
//Создаём событие, которое будет срабатывать каждый раз при движении мышки.
onMouseMove = function () {
//Проверяем, если курсор мышки ниже серой черты (line_mc), то скрываем курсор.
//Если курсор будет опускаться ниже line_mc, то делаем курсор видимым
//
//Функции hide() и show() объекта Mouse, как вы могли уже догадаться, скрывают или
//показывают изображение курсора (стрелочку), соответственно.
if (_root._ymouse<_root.line_mc._y) {
Mouse.hide();
} else {
Mouse.show();
}
//Присваиваем значение координат мышки, координатам Movie Clip’a, на который будет
//ссылаться переменная _root.varCursor. Таким образом будет создаваться впечатление,
//что Movie Clip двигается за мышкой =)
_root.varCursor._x = _root._xmouse;
_root.varCursor._y = _root._ymouse;
};
//Вызываем событие onRollOver (на наведение курсора мышки) для объекта mc1_mc. Теперь
//этот Movie Clip будет передвигаться за курсором.
mc1_mc.onRollOver();
//Вызываем событие onMouseMove, чтобы присвоить mc1_mc координаты курсора.
onMouseMove();
Кто не до конца разобрался, всегда может скачать флеш исходник (fla) к уроку и посмотреть флешку-пример (.swf).
Сама флешка | Исходник |
для AS 1 и 2 нужно использовать updateAfterEvent, чтоб новоявленный курсор двигался плавно, а не дрыгался в такт частоты кадров ролика. в этом примере скачки не так видны, потому что установлен сумасшедший фреймрейт. большой фреймрейт грузит проц. это неправильный путь.
пардон, скачал исходник, фреймрейт нормальный, 30 фпс. :)
но все равно, если дописать после строк
одну строку
updateAfterEvent();движение станет гораздо более плавным.
а как сделать чтобы твой курсор, когда наводишь на кнопку, допустим, становился рукой?
О, я нашла))) клааас))) описание такое же прелестное=***