Создание игр для мобильных телефонов - Майкл Моррисон

Например, вы хотите «оживить» воду в примере Wanderer, чтобы карта мира выглядела более реалистично. Некоторые из слоев карты вы можете обозначить индексом -1, а не 1 (1 – это индекс изображения воды). Затем в методе update() мидлета необходимо добавить код, обрабатывающий все слои с индексом -1. Я имею в виду, что этот код должен менять изображения, чтобы создавать иллюзию движения. Для этого вы можете использовать любые слои из множества замощенного слоя. Чтобы создать иллюзию движения воды, достаточно добавить еще несколько «водных» изображений в набор.

Анимация в замощенных слоях поддерживается двумя методами класса TiledLayer():

► createAnimatedTile()  – создание анимации в замощенном слое;

► setAnimatedTile()  – установление статического изображения для определенного элемента слоя.

Чтобы понять принцип работы, нужно объяснить значение некоторых терминов. Статическим элементом будем называть элемент слоя, имеющий индекс 1 или более. Индекс 0 означает пустой элемент замощенного слоя. Анимационным элементом будем называть элемент слоя, который может отображать последовательность статических изображений, и имеет индекс -1 и меньше. Итак, анимационный элемент слоя имеет отрицательный индекс, однако в любой момент времени этот элемент представляет собой статическое изображение – часть анимации.

1, 1, -1, 1,

–1, -1, 1, 1,

1, -1, 1, -1,

Перед тем как интерпретировать эту карту, важно отметить, что в ней четыре статических элемента, отображающих различные изображения воды. Если эти изображения показывать в определенном порядке, то создается иллюзия движения воды. Эти элементы имеют индексы 1, 2, 3 и 4. Элементы слоя с индексом 1 – это обычные элементы, с которыми вы работали прежде. Элементы с индексом -1 – это анимационные элементы, они отображают последовательность статических элементов с индексами 1, 2, 3, 4. Эта последовательность не отражена в карте, чуть позже вы узнаете, как она применяется к анимационным слоям. Если говорить на языке кода, сначала вы создаете анимационный слой, а потом карту замощенного слоя. Ниже приведен код, создающий анимационный слой для примера с водой:

waterLayer.createAnimatedTile(1);

Параметр в вызове этого метода – начальное статическое изображение, которое будет выводиться на месте анимационного слоя. Несмотря на то что этот элемент будет изменяться, создавая анимацию, вы должны задать нужный статический элемент. Метод createAnimatedTile() возвращает индекс созданного элемента. Первому созданному анимационному слою автоматически присваивается индекс -1, при создании последующих слоев этот индекс уменьшается (-2, -3 и т. д.). Теперь вы создали анимационный элемент и установили карту для замощенного слоя. Пока этот элемент будет похож на все остальные, без анимации, поскольку ему при инициализации был присвоен индекс 1. Чтобы начать анимацию, вызовите метод setAnimatedTile() и передайте ему новое значение индекса:

waterLayer.setAnimationTile(-1, 2);

Этот код изменяет все анимационные элементы с индексом -1, теперь на их месте отображаются изображения с индексом 2. Полезно хранить индекс текущего изображения в отдельной переменной, чтобы периодически увеличивать его. В этом случае вы можете изменять элементы циклически, вызывая переменную setAnimatedTile().

Совет Разработчику

Если вы хотите создать реалистичный эффект движения воды, используйте несколько различных анимационных элементов слоя, которые изменяются асинхронно. Это создаст реалистичную иллюзию движения.

Если вы потеряли суть в таком количестве деталей, то я повторю. Основное достоинство анимационных элементов слоя заключается в том, что они реализуют возможность изменять множество элементов слоя одной строкой кода. Если пример анимации воды показался вам интересным, вы будете приятно удивлены, что в примере Wanderer 2, приведенном в следующем разделе, применяется эта техника.

Создание программы Wanderer 2

В предыдущей главе вы познакомились с замощенными слоями и создали программу Wanderer. В мидлете Wanderer вы можете управлять героем, перемещающимся по карте, которая намного крупнее экрана большинства мобильных телефонов. В мидлете Wanderer использовался один замощенный слой, который играл роль скорее фона, нежели интерактивной составляющей программы. Слои становятся более ценными, если вы разрабатываете их так, чтобы они взаимодействовали со спрайтами. Например, вы можете создать «слои-барьеры», ограничивающие перемещение спрайтов. Это становится возможным благодаря классу Sprite, который позволяет определять столкновения не только спрайтов, но и спрайтов с замощенными слоями.

Оставшаяся часть этой главы посвящена модификации мидлета Wanderer, в котором будет применяться фоновый слой и слои-барьеры. Фоновый слой в мидлете Wanderer похож на исходный фоновый слой, а слои-преграды – это нововведение, они создают лабиринт, по которому должен пробираться герой. Если вы знакомы со старыми играми, например, Gauntlet или Castle Wolfenstein, вы можете представить, насколько полезными могут быть слои-лабиринты для создания уровней игры.

В мидлете Wanderer 2 используются не только замощенные слои, эта программа также демонстрирует преимущества анимационных слоев. В этом случае анимационные слои – слои с изображением воды, расположенные вдоль краев фонового слоя из примера Wanderer.

Другое важное изменение кода в Wanderer 2 – это применение класса LayerManager, который в новой программе используется для управления фоновым слоем и спрайтом героя. Окно вида менеджера показывает текущее положение слоев, нет необходимости перемещать слои относительно экрана телефона.

Подведем краткий итог. Я перечислю все изменения, которые мы внесем в мидлет Wanderer, созданный в предыдущей главе:

► добавить слои-барьеры, немного изменить фоновый слой. Слои-барьеры ограничивают передвижение героя;

► анимационные элементы замощенного слоя создают более реалистичную имитацию воды;

► менеджер слоев применяется для управления слоями и спрайтом персонажа;

► код должен перемещать окно вида менеджера слоев, при этом слои остаются неподвижными. Поскольку спрайт должен перемещаться в координатах, связанных с окном вида, то он должен перемещаться вместе с окном вида.

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

Разработка карты замощенного слоя

В мидлете Wanderer 2 используются два замощенных слоя, следовательно, необходимы и две карты слоев. Два слоя – это фоновый слой, земля, по которой герой может свободно перемещаться, и слой-барьер, состоящий из воды и стен, и ограничивающий. Слой-барьер должен отображаться поверх фонового слоя так, чтобы создавалась иллюзия единого пространства.

Смысл использования двух слоев заключается в том, чтобы разъединить объекты, ограничивающие перемещение героя, от прочих объектов. Любая графика слоя-барьера ограничивает движения персонажа.

Фоновая карта

Вы можете подумать, что фоновая карта в программе Wanderer 2 будет точно такая же, как и в мидлете Wanderer, однако это не так, в ней будет существенное отличие. Если вы вспомните программу Wanderer, то герой не мог передвигаться по воде. Такое ограничение было сделано простым вычислением текущего положения спрайта персонажа. Поскольку, используя слой-барьер, можно с легкостью ограничить перемещение спрайта персонажа, то нет необходимости ограничивать движение героя, создавая специальный код. Важно также то, что теперь нет необходимости создавать элементы в тех местах, где будет размещаться слой-барьер.

Чтобы представить, о чем я говорю, посмотрите на рис. 11.2, теперь фоновому слою не нужны границы.

Рис. 11.2. Теперь фоновому слою не нужны границы, поскольку они будут покрыты элементами с изображением воды слоя-барьера

Черная область, которую вы видите вокруг области суши на рисунке, – это прозрачные элементы слоя, которые не содержат графики. Аналогичные элементы, расположенные в слое-преграде, будут заполнены изображением воды, которое будет ограничивать перемещения персонажа. На самом деле, как вы увидите чуть позже, травянистый берег будет ограничен скалами слоя-преграды. А пока посмотрим на код карты фонового слоя:

0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,

0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,

0, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 0,

0, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 0,

0, 2, 2, 2, 2, 5, 15, 15, 15, 15, 15, 15, 6, 2, 2, 0,

0, 2, 2, 2, 2, 7, 10, 1, 1, 1, 1, 1, 16, 2, 2, 0,

0, 2, 2, 2, 2, 2, 14, 1, 1, 1, 1, 1, 16, 2, 2, 0,

0, 2, 2, 2, 2, 2, 7, 10, 1, 1, 1, 1, 16, 2, 2, 0,

0, 2, 2, 2, 2, 2, 2, 14, 1, 1, 1, 1, 16, 2, 2, 0,

0, 2, 2, 2, 2, 2, 2, 14, 1, 9, 10, 1, 16, 2, 2, 0,

0, 2, 2, 5, 15, 6, 2, 14, 1, 11, 12, 1, 16, 2, 2, 0,

0, 2, 2, 14, 1, 16, 2, 7, 13, 13, 13, 13, 8, 2, 2, 0,