В последнее время изучаю 11 flash на примере двух движков, Alternativa3D и AWAY3D. И применение этого всего дела в мультиплеере.
Ну и чтобы не делать простые кубики, решил наваять боле менее рабочий проект…
А так как на Хабре уже традиция, писать статьи о разных технологиях на примере танчиков, то не будем далеко отходить от нее.
В итоге родилась идея сделать простой аналог танков онлайн. Именно простой.
Очень не люблю велосипедостроение, поэтому по максимуму будут использоваться готовые, открытые технологии.
В общем цель: используя готовые и свободные технологии, сделать набросок сетевого 3D шутера на танках.
Итак, что мы хотим получить?
У нас есть цель, понять как и соответственно сделать сетевой 3D проект на флеше. Понятно, что полноценный коммерческий проект осилить одному будет очень сложно, да и статей понадобится пачка, поэтому сразу условимся, что делаем только ключевые части. А именно, простейший сервер, который обрабатывает только подключение, движение и выстрел. Клиент тоже будет простой, плоскость на которой подключившиеся игроки пуляют друг в друга. Никаких вращающихся башен и т. д. В общем халявы не будет. Будет пинок в нужную сторону, достаточный для того, чтобы сделать в итоге свои танки с шахматами и поэтессами.
Приступим.
Мы будет использовать следующие технологии:
- Flash, в качестве клиента
- AWAY3D 4, в качестве 3D движка
- Netty, в качестве сетевой библиотеки для сервера
- Protobuf, в качестве протокола
- Ну и мой любимый язык Scala для сервера
- Blender в качестве редактора игровых объектов и мира в целом.
Что хочу сказать. Альтернативовцы молодцы. Создали хорошие технологии, на основе которых сделали свои танчики. Когда я их первый раз увидел, у меня просто крышу снесло. Особенно радует, что это наша, российская команда.
Но всегда есть «но». Их технологии закрыты. Исправлений и дополнений приходится ждать неделями… Ну очень медленно все делается… Поэтому я голосую за опенсорс. Тем более, что он есть. Есть альтернатива альтернативовским разработкам в 3D. Во завернул ))
Имя им AWAY3D. Исходники доступны на Gihub. Библиотека активно развивается (коммиты очень частые) и вы всегда можете что-то исправить или дополнить. Ну а потом отправить это им для внесения в исходники. Комьюнити будет вам благодарно.
Что такое AWAY3D 4? Это 3D библиотека для 11 флеша, что означает отображение объектов посредством GPU видеокарты. Это дает нам возможность показывать на сцене сложные объекты с освещением, различными эффектами… и все это с приличной скоростью.
Надо заметить, что у AWAY3D есть версия для Flash10, в которой отображение производятся с помощью программного рендеринга. Так как в этом случае все расчеты ложатся на плечи CPU, то скорость многократно падает. Да и эффектов много вывести уже не получится. Но эта версия может быть полезна для несложных проектов. Ибо 11-й Flash только вышел и не у всех еще установлен. Да и не все видеокарты его поддерживают.
Но ситуация улучшается с каждым днем, поэтому мы, находясь на острие прогресса, будем использовать последнюю версию для 11-го флеша.
Для интересующихся, подробности можно почитать тут
Статей будет несколько. Сначала мы создадим клиента, потом напишем сервер, а в конце опишем протокол и заставим все это работать вместе.
С архитектурой проекта особенно заморачиваться не будем. Цель статьи не руководство по программированию, а знакомство с технологиями. В дальнейшем, если статьи найдут отзыв у читателей, возможно продолжение в виде рефакторинга с улучшением архитектуры… ну и вообще, развитием проекта.
AWAY3D основа
Создадим во FlashDevelop проект AS3 и подключим к нему библиотеку AWAY3D. Как подключать библиотеки к проекту и прочую базовую мелочь я опущу. Ибо и так много инфы в интернете.
Чтобы в дальнейшем упростить понимание того что происходит на сцене в AWAY3D, приведу картинку, которая поможет с ориентироваться в пространстве сцены.
На ней изображены координатные оси, как они представлены а движке AWAY3D. Т.е. по умолчанию движение вперед это по Z+.
Базовый принцип работы с движком очень простой. Необходимо проинициализировать сцену View3D. Настроить камеру, при этом мы указываем положение камеры на сцене. Камера это объект отвечающий за отображение нашего взгляда на сцену. Т.е. то, что мы будем видеть на экране, наши глаза так сказать. Далее надо расположить источник света. Они бывают разные, точечные, рассеянные и т. д. Мы будем использовать точечный источник (свет равномерно распространяется из одной точки во все стороны), он будет изображать солнце. В принципе можно обойтись и без него, но тогда на сцене не будет теней, а это не очень хорошо выглядит. Для того, чтобы рассчитать и вывести сцену на экран используется команда view.render(). Ее надо вызывать каждый кадр. Дальше можно создавать объекты на сцене и манипулировать ими.
Вообще я не планировал описывать подробно работу библиотеки AWAY3D. У нее достаточно хорошая документация. Но если у читателей будет желание, то в следующей статье про создание клиента, я более подробно опишу работу с ней.
Теперь опишем класс Main, который будет отвечать за игру в целом.
public class Main extends Sprite
{
// Это наша сцена
private var view : View3D;
// Это солнце
public var light: PointLight;
// Это игрок
public var player: ObjectContainer3D;
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
// Создадим сцену
view = new View3D();
view.camera.y = 140;
view.camera.z = -120;
view.camera.rotationX = 50;
addChild(view);
// debug
addChild(new AwayStats(view));
// Добавим игрока на сцену
addPlayer();
stage.addEventListener( Event.ENTER_FRAME, onEnterFrame );
}
public function addPlayer():void
{
// создадим игрока
player = new ObjectContainer3D();
// сделаем прикольную текстурку для него
var bitmapData: BitmapData = new BitmapData(512, 512, false, 0x000000);
bitmapData.perlinNoise(64, 64, 5, 0, false, true, BitmapDataChannel.RED);
// присвоим текстуру материалу
var material: BitmapMaterial = new BitmapMaterial(bitmapData);
// создадим геометрическую форму игроку
var mesh:Mesh = new Cube(material, 50, 50, 50);
player.addChild(mesh);
view.scene.addChild(player);
}
public function onEnterFrame( e:Event ):void
{
player.rotationX += .11;
player.rotationY += .15;
player.rotationZ += .19;
view.render();
}
}В результате у нас на экране должен получиться вращающийся кубик.
Это означает, что все подключено верно и можно переходить непосредственно к создаю клиента.
Об этом будет написано в следующей статье. К тому моменту я создам проект на GitHub и выложу на сервер работающий код, отображающий текущее состояние проекта.