Flash Эффект волшебной палочки при помощи AS3

Еще красивостей!

Все примеры в as3 написанные в этом блоге на сегодняшний день являются начального уровня. Поэтому не стоит терять ентузиазм, а следует продолжать в том же духе и вскоре разберем что-то сложное.

Данный пример не исключение, если сравнивать с предыдущими, но является полезным. По аналогии с данным примером можно написать несметное количество симпатичных украшений на сайт, баннер, презентацию и др. Главное принимать во внимание прожорливости Flash, связанной с ресурсами компьютера. Тему использования ресурсов компьютера и средства ускорения работы flash мы рассмотрим позднее.

Помните во всякого рода Диснеевких мультфильмах изображен «чудесненький» :)) взмах волшебной палочкой. Палочкой будет выступать курсор мыши, хотя не проблема заменить курсор на изображение палочки, но это «снова» позднее.

Эффект волшебной палочки на AS3 (Action Script 3)

В прошлой статье мы обсуждали создание градиентной заливки, которую будем использовать в данном примере для создания элементарного объекта свечения.

Создаем файл MagicMouseTrailer.as с таким содержанием:

//подключение пакетов с необходимыми классами
import flash.display.Sprite;
import flash.geom.Matrix;
import flash.display.GradientType;
import flash.display.SpreadMethod;
//описание класса элементарного свечения
//который наследует свои методы и свойства от класса Sprite
class LightBall extends Sprite {
//конструктор класса
public function LightBall () {
//холст, на котором будем рисовать
//конечно, можно рисовать и на холсте класса  LightBall,
//но так будет наглядный пример возможных вариантов
var viewImage:Sprite = new Sprite();
//описание всех последующих параметров можно найти в данной статье
var fillType:String = GradientType.RADIAL;
var colors:Array = [0x9fdcff, 0xdbf2ff];
var alphas:Array = [1, 0];
var ratios:Array = [0, 255];
var matrix:Matrix = new Matrix();
var gradWidth:Number =24;
var gradHeight:Number = 24;
var gradRotation:Number = 0;
var gradOffsetX:Number = -12;
var gradOffsetY:Number = -12;
matrix.createGradientBox(gradWidth, gradHeight, gradRotation, gradOffsetX, gradOffsetY);
var spreadMethod:String = SpreadMethod.PAD;
viewImage.graphics.beginGradientFill(fillType, colors, alphas, ratios, matrix, spreadMethod);
//рисуем окружность радиуса 12
viewImage.graphics.drawCircle(0, 0, 12);
//выполняем заливку
viewImage.graphics.endFill();
viewImage.x=0;
viewImage.y=0;
//добавляем холст в контейнер класса LightBall
addChild(viewImage);
}
}

После того как Мы описали класс LightBall, добавим в пакет MagicMouseTrailer.as описание основного класса MagicMouseTrailer.

В начало файла MagicMouseTrailer.as добавим следующий код Action Script 3:

package
{
import flash.display.Sprite;
import flash.ui.Mouse;
import flash.events.MouseEvent;
import flash.events.Event;
//основные параметры сцены - это по вкусу каждого
[SWF(backgroundColor=0x0c78b5, width=640, height=480, frameRate=24)]
public class MagicMouseTrailer extends Sprite
{
//объект LightBall
var lightBall:LightBall;
//конструктор класса MagicMouseTrailer
public function MagicMouseTrailer():void
{
//скрываем курсор мыши
Mouse.hide();
//добавляем обработчик события перемещения курсора мыши
stage.addEventListener(MouseEvent.MOUSE_MOVE, startTrailer);
}
//обработчик события перемещения курсора мыши
private function startTrailer(e:MouseEvent):void
{
// Создаем новый объект LightBall
lightBall = new LightBall();
//задаем положение случайное от позиции курсора мыши
lightBall.x = mouseX +(2*Math.random()-1) * lightBall.width;
lightBall.y = mouseY +(2*Math.random()-1) * lightBall.height;
//добавляем на сцену
addChild(lightBall);
//добавляем обработчик события смены кадров для анимации шлейфа
lightBall.addEventListener(Event.ENTER_FRAME, animate);
}
//обработчик смены кадров
private function animate(e:Event):void
{
//прозрачность
e.target.alpha -= 0.05;
//если объект стал полностью прозрачным, убираем его со сцены
if (e.target.alpha <= 0)
{
e.target.removeEventListener(Event.ENTER_FRAME, animate);
removeChild(e.target as Sprite);
}
//меняем масштаб объекта
e.target.scaleX -= 0.1;
e.target.scaleY -= 0.1;
//меняем позицию по y (ветром сдувает)
e.target.y += 3;
}
}
}

Вот и все!
После компиляции данного as3 кода при помощи SDK, Flash Prof, Flex Buildera и т.п. должно получиться следующее:

MagicMouseTrailer-AS3

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *