Adobe Flash. Создание аркад, головоломок и других игр с помощью ActionScript
Шрифт:
Подход
Иллюзия глубины может быть достигнута простым использованием перспективы. На рисунке 9.9 показано, что границы дороги нарисованы диагонально по направлению к нижним углам экрана. Хотя ширина дороги предполагается постоянной, глазу кажется, что дорога спереди у" же.
В дополнение к линиям, все элементы игры должны появляться с некоторого расстояния. Это означает, что они должны двигаться не только сверху вниз, но и в стороны. Сыграйте прямо сейчас, чтобы посмотреть, как движутся камни по краям дороги и дорожные метки, похожие на звезды.
Три типа элементов движутся в этой игре: камни по сторонам дороги, звездообразные "бонусы"-метки
Звездообразные метки располагаются ближе к центру экрана, поэтому они движутся в стороны не так быстро, как вниз; скорость их движения в стороны составляет половину от значения скорости движения вниз. Это соответствует перспективе, заданной сторонами дороги. Центральная линия просто движется прямо вниз.
Все эти элементы повторяются в игре раз за разом. Например, как только камень достигает нижней границы экрана, он снова появляется на горизонте и опять движется к игроку.
В дополнение к движению трех элементов игры мы также изменяем их масштаб. Таким образом, объекты, которые предполагаются далекими, выглядят меньше и увеличиваются по мере приближения.
Наша цель не в том, чтобы создать перспективу, реальную до последнего пиксела, а в том, чтобы достаточно к ней приблизиться, предоставив возможность воображению пользователя довершить остальное и почувствовать себя въезжающим в экран.
Подготовка ролика
Фон и линии, обозначающие границы дороги, – неподвижные элементы. Но для камней и звездообразных меток нужны клипы. Клип центральной линии – это просто линия, но расположенная таким образом, чтобы центральная точка клипа была на вершине линии.
Машина сама по себе нуждается в трех кадрах: прямое движение, левый и правый повороты, которые используются, чтобы показать, что машина поворачивает.
Клипы камней и бонусных меток должны быть помещены под нижней границей экрана и названы "SideObject" и "bonus". Клип машины следует поместить внизу экрана и назвать "car". Кроме того, слева находится клип "actions". Во всех четырех клипах содержатся сценарии.
На экране должны быть два динамических текстовых поля: "timeDisplay" и "score". Они оба должны быть привязаны к переменным с такими же именами.
В ролике-примере я обозначил вводный кадр как кадр 1, таким образом, все действие начинается с кадра 2. Есть еще третий кадр с меткой "game over".
Создание кода
Основная часть кода – это сценарий клипа машины. Он начинается с задания переменной speed значения 0. Эта переменная должна быть на уровне _root, поскольку остальные клипы будут к ней обращаться.
onClipEvent(load) {
// Инициализируем переменную скорости.
_root.speed = 0;
}Обработчик onClipEvent(enterFrame) сначала проверяет все четыре клавиши с изображением стрелок. Левая и правая клавиши со стрелкой перемещают машину влево или вправо и также заставляют клип с машиной показывать соответствующий кадр поворота.
Клавиши со стрелками вверх и вниз изменяют скорость машины на 0,1. Постоянно осуществляется проверка, не упала ли скорость ниже 0.
Если ни одна из клавиш со стрелками не нажата, клип с машиной возвращается к первому кадру. Обработчик осуществляет еще две проверки. Первая нужна, чтобы узнать, не находится ли под машиной клип "bonus". Если да, игрок получает очки, и бонус очень быстро проезжает далее, чтобы игрок не получил за него очки еще раз.
Вторая проверка выясняет, не коснулась ли машина обочины. Если да, движение машины в сторону ограничивается и замедляется.onClipEvent(enterFrame) {
if (Key.isDown(Key.LEFT)) {
// Поворачиваем влево.
this._x -= 10;
this.gotoAndStop(“left”);
} else if (Key.isDown(Key.RIGHT)) {
// Поворачиваем вправо.
this._x += 15;
this.gotoAndStop(“right”);
} else if (Key.isDown(Key.UP)) {
// Увеличиваем скорость.
_root.speed += .1;
} else if (Key.isDown(Key.DOWN)) {
// Тормозим.
_root.speed -= .1;
// Проверяем, что скорость не меньше 0.
if (_root.speed < 0) _root.speed = 0;
} else {
_root.car.gotoAndStop(“straight”);
}
// Проверяем бонус.
if (this.hitTest(_root.bonus._x,_root.bonus._y)) {
_root.score++;
_root.bonus._y += 100;
}
// Замедляем движение, если коснулись обочины.
if (this._x < 80) {
this._x = 80;
_root.speed /= 2;
} else if (this._x > 470) {
this._x = 470;
_root.speed /= 2;
}
}Клип «sideObject» содержит сценарий, двигающий объект вниз и в сторону от центра. Для каждого следующего кадра значение _y увеличивается, а _x – изменяется. Оба параметра используют переменную speed для характеристики этого изменения, но _х использует коэффициент dx, который может быть равен 1 или -1. Объект перемещается соответственно вправо или влево.
Когда объект достигает значения 600 по вертикали, что на 200 пикселов ниже границы экрана, он возвращается назад к значению 200, то есть вновь появляется на горизонте. С вероятностью 50/50 он помещается слева или справа от дороги. Именно в этот момент определяется значение переменной dx.
И наконец, масштаб объекта определяется в соответствии со значением _y. Это означает, что объект становится больше по мере приближения.onClipEvent(enterFrame) {
// Движемся вниз.
this._y += _root.speed;
// Движемся в стороны.
this._x += dx*_root.speed;
// Возвращаем объект на исходную озицию, если он проехал за
// нижнюю границу экрана.
if (this._y > 600) {
this._y = 200;
if (Math.random < .5) {
// Объект слева.
this._x = Math.random*170;
dx = -1;
} else {
// Объект справа.
this._x = 550-Math.random*170;
dx = 1;
}
}
// Задаем масштаб в соответствие со значением _y.
this._xscale = this._y/4;
this._yscale = this._y/4;
}Обратите внимание, что клип «sideObject» не взаимодействует с машиной. Это делает только клип «bonus». Но объекты по сторонам дороги направляют взгляд игрока так, что создается ощущение глубины. Центральная линия движется, как и камни, но, поскольку она находится в центре экрана, она не передвигается ни вправо, ни влево. Она просто движется вниз и изменяет масштаб.
onClipEvent(enterFrame) {
// Движемся вниз.
this._y += _root.speed;
// Возвращаемся к горизонту.
if (this._y > 400) {
this._y = 200;
}
// Устанавливаем масштаб.
this._xscale = this._y/4;
this._yscale = this._y/4;
}