Как создавать свои Flash-игры, подобные Angry Birds и World of Goo?
Box2D - это библиотека, которая моделирует физическое поведение твердых тел в двумерном пространстве. Программисты могут использовать...
В этом уроке я покажу вам как создать анимированный след мыши. Как обычно анимация сделана с помощью ActionScript 3. Вы можете легко внести изменения в код, что бы менять скорость, размеры, формы и т.д. Запускайте ваш Flash и давайте приступим
Подготовка
1. Создаем новый документ 300 х 300
2. Нарисуйте квадрат 10х10. Цвет не имеет значения, т.к. мы поменяем его с помощью кода.
3. Переконвертируйте квадрат в MovieClip. Назовите его myRectangle и установите точку регистрации по центру.
4. В поле Class напишите “MyRectangle”.
ПРИМЕЧАНИЕ: Когда вы нажмете ОК, появится окошко с предупреждением. Не волнуйтесь, Флеш предупреждает, что не может найти класс с таким именем. Это неважно, ы еще не создали этот класс. Когда мы будем тестировать ролик, Флеш создаст этот класс
5. Удаляем квадрат со сцены
Приступим к написанию кода.
Создайте новый слой и в его первом кадре напишите следующее
//Запускаем таймер. Таймер вызывает функцию timerHandler каждые 0.2 секунды. var timer:Timer = new Timer(200, 0); timer.addEventListener (TimerEvent.TIMER, timerHandler); timer.start (); //Находим центр сцены var centerX:Number = stage.stageWidth / 2; var centerY:Number = stage.stageHeight / 2; //Описываем функцию, вызываемую таймером function timerHandler (e:Event):void { //Создаем новый квадрат var newRectangle:MyRectangle = new MyRectangle(); //Устанавливаем для квадрата координаты равные координатам мыши newRectangle.x = mouseX; newRectangle.y = mouseY; //Высчитываем положение квадрата по х и у от центра сцены var dx:Number = newRectangle.x - centerX; var dy:Number = newRectangle.y - centerY; //Высчитываем расстояние от квадрата до центра сцены с помощью теоремы Пифагора newRectangle.radius = Math.sqrt(dx*dx + dy*dy); //Высчитываем угол квадрата относительно центра сцеы newRectangle.myAngle = Math.atan2(dy, dx); //Устанавливаем скорость поворота newRectangle.speed = 0.06; //Сначала квадрат должен быть прозрачный newRectangle.alpha = 0; //Устанавливаем случайные размеры квадрата newRectangle.scaleX = Math.random() + 1.5; newRectangle.scaleY = newRectangle.scaleX; //Получаем доступ к смене цвета квадрата с помощью ColorTransform var colorInfo:ColorTransform = newRectangle.transform.colorTransform; // Устанавливаем случайный цветобъекта ColorTransform colorInfo.color = 0xffffff * Math.random(); //Даем получившийся цвет квадрату newRectangle.transform.colorTransform = colorInfo; //Добавляем квадрат на сцену addChild (newRectangle); //Добавляем функцию ENTER_FRAME для анимации вращения newRectangle.addEventListener (Event.ENTER_FRAME, moveRectangle); } //Эта функция вращает квадраты function moveRectangle (e:Event):void { //Берем квадрат как цель действий var rectangle:MovieClip = e.target as MovieClip; //Высчитываем новые х и у позиции для квадрата var newX:Number = centerX + Math.cos(rectangle.myAngle) * rectangle.radius; var newY:Number = centerY + Math.sin(rectangle.myAngle) * rectangle.radius; //Увеличиваем угол в следующем кадре rectangle.myAngle += rectangle.speed; //Задаем новую позицию rectangle.x = newX; rectangle.y = newY; //Уменьшаем радиус, то бы получить спиральную анимацию rectangle.radius -= 0.6; //Уменьшаем размер rectangle.scaleX -= rectangle.radius * 0.0001; rectangle.scaleY -= rectangle.radius * 0.0001; //Увеличиваем непрозрачность, если она меньше 1 и радиус больше 50 if (rectangle.alpha < 1 && rectangle.radius > 50) { rectangle.alpha += 0.05; } //Увеличиваем прозрачность если радиус меньше 50 if (rectangle.radius < 50) { rectangle.alpha -= 0.005; } //Если радиус меньше 0 удаляем квадрат if (rectangle.radius < 0) { rectangle.removeEventListener (Event.ENTER_FRAME, moveRectangle); removeChild (rectangle); } }