Архив рубрики: Создание игр на Flash

Серия статей посвященных теме создания Flash игр на языке ActionScript 3.0. В серии разбираем различные методики используемые в играх.

138. [game, ANE] XProject1. Нативное расширение для работы с галлереей и камерой

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/
Adobe Native Extensions – Нативные расширения для платформ iOS
http://flashpress.ru/blog/category/ane/

Суть проблемы

В приложении необходимо было загрузить фотографию из альбома и сохранить в каталоге приложения, для дальнейшей работы с этой фотографией. Во флеше есть класс CameraRoll который умеет загружать фотографии из вашей фотопленки, и есть еще класс CameraUI, с помощью которого можно сделать фотографию с помощью камеры. Эти классы показывают нативные окна операционной системы и прекрасно справляются со своей задачей. Но в моем приложении необходимо было загрузить фотографию и сохранить ее в каталоге приложения, что бы после выхода из приложения можно было продолжить работу с фотографией. Первым делом я загрузил фотографию с помощью класса CameraRoll, попытался конвертировать в ByteArray с помощью PNG-энкодера и сохранил байтовый массив с помощью класса File. В итоге получил проблему с производительностью, процесс сохранения на моем устройстве происходил очень долго. В итоге решил написать ANE-библиотеку для iOS.

Читать далее
Эту статью прочитали 1592 раз

137. [game] XProject1. Обработка Touch-событий на мобильной платформе

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/

Суть проблемы

В стандартной событийной модели ActionScript имеются некоторые неувязки при использовании touch-событий.
Например, в моем приложении необходимо было использовать событие зума TransformGestureEvent.GESTURE_ZOOM (сведение/разведение двух пальцев на сенсорном экране), а для того, чтобы это событие стало доступным, необходимо включить специальный input-режим:

, который в свою очередь отключает поддержку touch-событий TouchEvent, которые необходимы для обработки одиночных касаний на экране.
Другая проблема: в приложении есть визуальный компонент, который может обрабатывать сразу несколько touch-событий:

  • Таскание элемента вверх/вниз – скролл
  • Таскание элементы вправо/влево – чтобы скрыть его
  • Одиночное касание пальцем над элементом

Проблема в том, что если пользователь начал двигать элемент в одном направлении(например вверх или вниз), то остальные события(таскание влево/вправо и одиночное касание) не должны срабатывать до тех пор, пока пользователь не отпустит палец с экрана.

Третья проблема заключается в том, что стандартные touch-события нельзя тестировать в обычном flash-приложении(не мобильном).

Читать далее
Эту статью прочитали 2293 раз

135. [game] XProject1. Распределение элементов вокруг заданной точки

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/

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

Содержание:

Суть проблемы

Есть массив визуальных элементов. Необходимо их распределить равномерно около заданной точки. Распределять их случайно через Math.random() не вариант, потому что элементы часто местами кучкуются, а местами образуются пробелы, а хочется что бы элементы распределялись равномерно. И еще важно что бы элементы не пересекались, в случае простого рандома этого добиться будет проблемно.

Вот как выглядит случайно распределение используя Math.random() (Нажмите кнопку allocation для распределения элементов):

Здесь должна быть флешка. Установите Flash Player

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

Читать далее
Эту статью прочитали 2312 раз

134. [game] XProject1. Масштабирование карты

Matrix – серия статей посвященных работе с Матрицами.
Все статьи серии:
http://flashpress.ru/blog/category/matrix/
Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/

Предыстория

В процессе написание игры(кодовое название XProject1, релиз будет скоро) часто возникают сложности, которые приходится решать различными способами. И я решил писать такие небольшие статьи о том, как была решена та или иная проблема в реальном игровом проекте. После релиза игры, вы сможете увидеть результат в готовом проекте. Эта статья будет первой из такой серии, и расскажу я о том, как я реализовал масштабирование “карты” (на самом деле в моем проекте это не карта, но применение очень близко к игровым картам).

Суть проблемы

Реализовать масштабирование можно различными способами, но в моем проекте было четкое разделение между различными визуальными компонентами и связь между ними была минимальная(чтобы не плодить спагетти-код, с кучей взаимосвязей). А если конкретнее, есть компонент mapView которые отображает карту. У него есть один публичный метод:

который собственно масштабирует карту. Есть еще компонент scrollerView который показывает скролер и генерирует событие при таскании бегунка. У scrollerView есть так же один публичный get-метод:

Который вернет процент масштаба от 0 до 1.
Для того чтобы сконцентрироваться на рассматриваемой проблеме, я написал простой проект, чтобы было нагляднее:

Здесь должна быть флешка. Установите Flash Player

Итак, имеем две проблемы:

  • Карта не должна уменьшаться до точки(должен быть какой-то минимальный размер)
  • Карта масштабируется относительно левого верхнего угла изображения. Необходимо сделать так, чтобы карта масштабировалась относительно центра экрана(там где красный крест)

Читать далее
Эту статью прочитали 2328 раз

126. [game] Углы между векторами

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/

Геометрия – одна из моих любимейших тем в математике. GameDev(разработка игр) – одна из интереснейших тем в программировании. Что общего между геометрией и разработкой игр? Ни одна из современных игр не обходится без векторов, потому что векторами описывается множество различных игровых сущностей. Вектор имеет два параметра, это направление и длина(сила). Направление вектора – это его угол относительно направляющей линии. Так вот в этом уроке мы с вами поговорим об углах между векторами на плоскости.

Я расскажу вам как определить:

  1. Угол, на которой надо повернуть по часовой стрелке один вектор, так, чтобы он совпал с другим
  2. Наименьший угол, на который надо повернуть один вектор, что бы он совпал с другим
  3. Наименьший угол между векторами

angles-2d-1

Читать далее
Эту статью прочитали 2235 раз

106. [game] Растеризация анимации. Создание эффектов Отражение и Тень

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/

В уроке Растеризация анимации. Использование библиотеки FPMovieClip мы научились растеризовывать анимацию с помощью библиотеки FPMovieClip.swc. В этом уроке я расскажу вам как можно получить набор картинок(массив BitmapData) из анимации, с помощью библиотеки FPMovieClip.swc. С помощью такого массива картинок, вы сможете создавать различные эффекты. Также я покажу вам как можно получить из анимации эффект отражения и тени, как показано на скриншоте:
rasterization-animation-effects-1

Читать далее
Эту статью прочитали 1992 раз

105. [game] Растеризация анимации. Использование библиотеки FPMovieClip

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/

Растеризация анимации – это перевод всех кадров анимации в набор растровых картинок. Зачем это нужно? Вы когда нибудь работали с гениальными flash-аниматорами, которые умеют рисовать красивую и эффектную анимацию(например анимацию игрового персонажа)? Так вот обычно такая анимация представляет собой бесконечное множество вложенных друг в друга MovieClip-ов. И управлять такой анимацией в коде ActionScript становится проблемно, а точнее нет возможности остановить-запустить, перейти на определенный кадр и т.д. Не давно была выпущена бета версия AIR 3.8 в которой появился новый метод stopAllMovieClips() у класса MovieClip, честно сказать толку от него мало, т.к. после такой остановки нет возможности восстановить проигрывание всех вложенных клипов. Есть и другая проблема – flash-аниматоры очень любят использовать различного рода фильтры, эффекты, векторную графику… А это все может привести к потере производительности Flash-приложения. Все эти проблемы решаются с помощью растеризации анимации. Ну и в догонку, если у вас создаётся большое количество копий игровых юнитов с анимацией – вы можете один раз растеризовать анимацию, и использовать одни и теже BitmapData-ы во всех юнитах.

Идея растеризации заключается в том, что необходимо сразу после создания объекта MovieClip, пройтись по всем кадрам и нарисовать каждый кадр на BitmapData. Очень важно чтобы смена кадров происходила по событию Event.ENTER_FRAME, потому что если вы будете делать gotoAndStop(), вы получите ошибку в случае если анимация содержит вложенные мувиклипы с анимацией, т.к. на них не распространяется действие метода gotoAndStop. Так же надо учесть тот факт, что на каждом кадре общий размер мувиклипа разный, и координата левой верхней точки тоже разная, если это не учитывать – вы получите BitmapData-ы которые могут не совпадать в анимации.

Рассмотрим пример анимации (исходники анимации в формате fla здесь):

Здесь должна быть флешка. Установите Flash Player

Попробуйте в середине анимации effect_3 нажать кнопку stop (или пробел на клавиатуре), чтобы остановить анимацию. Вы увидите что вложенный мувиклип не остановился. Так же обратите внимание на то, где находится точка отсчета мувиклипа (там где нарисован красный крест). Попробуем растеризовать эту анимацию.

Читать далее
Эту статью прочитали 2263 раз

104. [game] Взаимодействия юнитов на игровом поле. GameController и UnitActions

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/
Серия статей на тему использования анимации персонажей в коде ActionScript 3.0
  1. Анимация персонажа
  2. Анимация персонажа. Продолжение
  3. Управление анимацией персонажа с помощью клавиатуры
  4. Управление анимацией персонажа с помощью сенсорного экрана. Создаем мультиплатформенное приложение
  5. Взаимодействия юнитов на игровом поле. GameController и UnitActions
  6. Хочу продолжение > хочу

Вы читали все предыдущие статьи серии? Тогда вы знаете как написать контроллер для управления анимацией персонажа на игровом поле. Так же мы разбирали принципы создания кросс платформенных приложений, на примере создания игрушки для Web и iOS/Android платформ. А если таких юнитов(контроллеров) на игровом поле будет несколько? В этом случае нам нужны контроллеры для управления группой других контроллеров. В этой статье мы напишем базовый контроллер игры GameController, который будет осуществлять управление и взаимодействие между другими контроллерами. К концу статьи, мы заставим одного юнита атаковать, а другого получать урон в момент удара. Но все по порядку …

Читать далее
Эту статью прочитали 1820 раз

103. [game] Управление анимацией персонажа с помощью сенсорного экрана. Создаем мультиплатформенное приложение

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/
Серия статей на тему использования анимации персонажей в коде ActionScript 3.0
  1. Анимация персонажа
  2. Анимация персонажа. Продолжение
  3. Управление анимацией персонажа с помощью клавиатуры
  4. Управление анимацией персонажа с помощью сенсорного экрана. Создаем мультиплатформенное приложение
  5. Взаимодействия юнитов на игровом поле. GameController и UnitActions
  6. Хочу продолжение > хочу

Одно из достоинств флеша в том, что на языке ActionScript можно с легкостью писать кроссплатформенные приложения. Т.е. вы можете писать один и тот же код ActionScript 3.0, а затем компилировать этот код под разные платформы, например для Web, iOS или Android. Но есть небольшая проблема, возникают ситуации когда необходимо в одном части приложения писать разные куски кода. Рассмотрим пример управления анимацией, который мы реализовали в предыдущем уроке Управление анимацией персонажа с помощью клавиатуры. Если мы будем переносить это приложение на мобильную платформу(iOS, Android) – этот контроллер нам не подойдет, и скорее всего нужен будет контроллер который управляет анимацией с помощью нажатий пальцем на экране и других мультитач жестов. В этом уроке мы с вами решим две проблемы:

  1. как писать мультиплатформенные приложения;
  2. напишем контролер управления для мобильных устройств, как показано на скриншоте:

unit-animation-touchscreen-controller-1

Читать далее
Эту статью прочитали 2582 раз

102. [game] Управление анимацией персонажа с помощью клавиатуры

Game – Серия статей посвященных разработке flash-игр на языке ActionScript. Игры для соц.сетей и мобильных платформ iOS, Android.
http://flashpress.ru/blog/category/game/
Серия статей на тему использования анимации персонажей в коде ActionScript 3.0
  1. Анимация персонажа
  2. Анимация персонажа. Продолжение
  3. Управление анимацией персонажа с помощью клавиатуры
  4. Управление анимацией персонажа с помощью сенсорного экрана. Создаем мультиплатформенное приложение
  5. Взаимодействия юнитов на игровом поле. GameController и UnitActions
  6. Хочу продолжение > хочу

В предыдущей статье Анимация персонажа. Продолжение мы с вами создали класс UnitView и подключили к нему контроллер RandomController, который умеет проигрывать случайные анимации idle, если юнит стоит без движение некоторое время. В этой статье мы подключим к классу UnitView еще один контроллер: MoveController, который будет отвечать за управление юнитом с клавиатуры на игровом поле. Подключение контроллеров управления мы реализуем так, чтобы при необходимости мы смогли быстро подменить контроллер на другой, который будет использоваться в мобильных(iOS/Android) приложениях. Таким образом мы подготовим наше приложение для кросс-платформенной разработки.

Прежде чем мы приступим к написанию кода, хотелось бы уточнить один момент, необходимо создать базовый пакет game/ в который необходимо перенести все пакеты и классы созданные в предыдущих примерах, это необходимо для того чтобы мы могли создать в корне новый контроллер GameController, который будет заниматься управлением других контроллеров и их коммуникацией.

Реализация контроллера MoveController будет происходить в два шага:

Читать далее
Эту статью прочитали 3549 раз