Пятница, 19 Апреля 2024, 00:35

Приветствую Вас Гость

[ Новые сообщения · Игроделы · Правила · Поиск ]
  • Страница 1 из 1
  • 1
Форум игроделов » Движки для разработки игр и сложные системы разработки » 2D-движки для создания игр » Box2D 2.1a Tutorial – Part 1 (Basic) (Урок 1 по Box2D 2.1a)
Box2D 2.1a Tutorial – Part 1 (Basic)
vovnetДата: Понедельник, 25 Июня 2012, 15:40 | Сообщение # 1
почетный гость
Сейчас нет на сайте

Всем привет, меня зовут Владимир.
С недавних пор решил изучить Box2D Flash версии 2.1а. Облазив множество сайтов, я по-крупинкам собирал информацию по движку, на некоторых из них были хорошие уроки, на других сжатые, на третьих заумные... В общем для систематизирования полученных знаний я набросал в word'e конспектик. И решил поделится знаниями, если уроки вас заинтересует - пишите, буду работать над остальными.

Box2D 2.1a Уроки – Часть 1 (Базовые знания)
Физические движки, вероятно, являются самыми привлекательными элементами игровых приложений. Они не только добавляют реалистичности, но также позволяют сделать вашу игру более интерактивной. Платформа Flash имеет множество физических движков, но я остановил свое внимание на Box2D 2.1a — пожалуй, самом мощном и функциональном физическом движке среди остальных.

Немного общей информации: Box2D является детищем Эрина Катто, который написал ее на С++. Но благодаря своей популярности, Box2D был портирован на множество других языков и ActionScript 3.0 не стал исключением. Первый порт был создан неким BorisTheBrave, который следил за обновлениями движка. С выходом версии 2.1 появился новый порт, созданный Джесси Штернбергом.

Тем не менее, на данный момент, я сосредоточу свое внимание на порте BorisTheBrave, который можно скачать отсюда .

Box2D может быть довольно пугающим для тех, кто только начинает свое знакомство с библиотекой в связи с его масштабами, поэтому я постараюсь немного облегчить уроки. Перед началом урока давайте убедимся, что вы знакомы со следующими определениями из руководства по Box2D:
Shape: 2D-форма геометрических объектов, таких как круг или многоугольник.
Rigit body: твердое тело — кусок материи, которая настолько сильна, что расстояние между двумя молекулами вещества всегда является постоянным. Тело твердое как алмаз.
Fixture: соединение — связывает форму тела и добавляет свойства материала, такие как плотность, трение и т.д.
World: мир физики представляет собой совокупность тел, соединений, которые взаимодействуют друг с другом. Box2D поддерживает несколько миров, но обычно в этом нет необходимости.

Конечным результатом этого урока будет такая флэшка:


Для визуального представления связи между классами я создал эту таблицу:


Итак, приступаем к кодингу:

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

Code
package
{
         import Box2D.Collision.b2Bound;
         import Box2D.Dynamics.b2World;
         import Box2D.Common.Math.b2Vec2;
         import Box2D.Dynamics.b2BodyDef;
         import Box2D.Dynamics.b2Body;
         import Box2D.Collision.Shapes.b2PolygonShape;
         import Box2D.Dynamics.b2Fixture;
         import Box2D.Dynamics.b2FixtureDef;
         import Box2D.Dynamics.b2DebugDraw;
         import flash.display.MovieClip;
         import flash.display.Sprite;
         import flash.events.Event;
         
         [SWF(width = "800", height = "600", backgroundColor="#fafed6", frameRate = "30")]

         public class Main extends MovieClip
         {
              private const PIXELS_TO_METRE:int = 30;
              private const SWF_HALF_WIDTH:int = 400;
              private const SWF_HEIGHT:int = 600;
              private var _world:b2World;
          
              public function Main()
              {
                   // создаем мир
                   _world = new b2World(new b2Vec2(0, 10), true);


b2World() конструктор.
public function b2World(gravity:b2Vec2, doSleep:Boolean)
Параметры:
gravity:b2Vec2 – вектор гравитации мира.
doSleep:Boolean — повысить производительность за счет исключения из моделирования неактивных объектов? (true — да).

B2Vec2() конструктор.
public function b2Vec2(x_:Number = 0, y_:Number = 0)
Параметры:
x_:Number (default = 0) - вектор по Х.
y_:Number (default = 0) - вектор по Y.

2. Создание бокса игрового мира. В Box2D единицы измерения в метрах. Поэтому мы указываем количество пикселей на метр (я выбрал 30, а вы можете использовать другую величину). Кроме того, координаты объекта относительно мира располагаются в центре этого объекта. Поэтому, чтобы наш бокс мира соответствовал ширине экрана, я разделил 800/2.

Code
// создаем свойства тела
var groundBodyDef:b2BodyDef = new b2BodyDef();
groundBodyDef.position.Set(SWF_HALF_WIDTH / PIXELS_TO_METRE,     
                    SWF_HEIGHT / PIXELS_TO_METRE-20 / PIXELS_TO_METRE);

b2BodyDef() конструктор.
public function b2BodyDef()
Этот конструктор устанавливает значения тела по умолчанию.

3. Здесь мы наблюдаем использование шаблона проектирования Factory, который служит для создания тела.

Code
// добавляем тело к миру
var groundBody:b2Body = _world.CreateBody(groundBodyDef);


4. Теперь мы создадим нашу форму (shape).

Code
// создаем форму (shape)
var groundBox:b2PolygonShape = new b2PolygonShape();
groundBox.SetAsBox(SWF_HALF_WIDTH / PIXELS_TO_METRE, 20 / PIXELS_TO_METRE);


5. При создании связи объекта с формой мы можем установить различные физические свойства.

Code
// устанавливаем свойства тела
var groundFixtureDef:b2FixtureDef = new b2FixtureDef();
groundFixtureDef.shape = groundBox; // форма
groundFixtureDef.density = 1;       // плотность
groundFixtureDef.friction = 1;      // трение
groundBody.CreateFixture(groundFixtureDef);


На этом шаге мы создаем объект и соединяем его с формой.

Code
// создаем динамическое тело
var bodyDef:b2BodyDef = new b2BodyDef();
bodyDef.type = b2Body.b2_dynamicBody;    // тело будет динамическим
bodyDef.position.Set(SWF_HALF_WIDTH / PIXELS_TO_METRE, 4);
var body:b2Body = _world.CreateBody(bodyDef);
           
var dynamicBox:b2PolygonShape = new b2PolygonShape();
dynamicBox.SetAsBox(1, 1);
           
var fixtureDef:b2FixtureDef = new b2FixtureDef();
fixtureDef.shape = dynamicBox;
fixtureDef.density = 1;
fixtureDef.friction = 0.3;
           
body.CreateFixture(fixtureDef);


6. Следующий фрагмент кода позволит нам отобразить наш мир на экране.

Code
// отображаем все на экране
var debugSprite:Sprite = new Sprite();
addChild(debugSprite);
var debugDraw:b2DebugDraw = new b2DebugDraw();
debugDraw.SetSprite(debugSprite);
debugDraw.SetDrawScale(PIXELS_TO_METRE);
debugDraw.SetLineThickness(1.0);
debugDraw.SetAlpha(1);
debugDraw.SetFillAlpha(0.4);
debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
_world.SetDebugDraw(debugDraw);


7. Теперь нам осталось только вдохнуть жизнь в наш мир и дать ему работать. Для этого воспользуемся слушателем ENTER_FRAME события.

Code
// добавляем слушателя
addEventListener(Event.ENTER_FRAME, update);


8. Для обновления мира мы будем вызывать функцию Step. Step принимает три параметра. Первый — шаг времени. В руководстве по Box2D рекомендуется использовать 1/60 секунды. Я считаю, что лучше всего установить его на частоту кадров flash-ролика, в данном случае 1/30. Второй и третий параметры пока что рассматривать не будем.

Code
public function update(e:Event):void
{
       var timeStep:Number = 1 / 30;
       var velocityIterations:int = 6;
       var positionIterations:int = 2;
           
       _world.Step(timeStep, velocityIterations, positionIterations);


9. В версии 2.1 мы должны очистить силы.

Code
_world.ClearForces();


10. Отображаем отладочные данные, которые мы устанавливали ранее.

Code
// отрисовываем
_world.DrawDebugData();


Скачать исходник с примером.

Следующие уроки:
Part2




Сообщение отредактировал vovnet - Среда, 27 Июня 2012, 14:16
AnarchystДата: Понедельник, 25 Июня 2012, 17:27 | Сообщение # 2
Chaotic Evil
Сейчас нет на сайте
По-моему я это где-то на английском видел.

Good отстой, Neutral - параша, Evil, хой, победа наша!
vovnetДата: Понедельник, 25 Июня 2012, 17:34 | Сообщение # 3
почетный гость
Сейчас нет на сайте
Quote (Anarchyst)
По-моему я это где-то на английском видел.

да, это с англоязычного блога.


AnarchystДата: Понедельник, 25 Июня 2012, 17:34 | Сообщение # 4
Chaotic Evil
Сейчас нет на сайте
А вообще - как я заметил, б2-флеш уже загнивает. Я б начал копать в сторону нейпа.

Good отстой, Neutral - параша, Evil, хой, победа наша!
vovnetДата: Воскресенье, 08 Июля 2012, 22:49 | Сообщение # 5
почетный гость
Сейчас нет на сайте
Quote (Anarchyst)
А вообще - как я заметил, б2-флеш уже загнивает. Я б начал копать в сторону нейпа.

Nape вроде как сложнее


SealreanДата: Среда, 20 Марта 2013, 18:32 | Сообщение # 6
был не раз
Сейчас нет на сайте
Здравствуйте. Большое спасибо за уроки!
Но ссылки на исходники уже умерли, как в первом уроке, так и во всех последующих sad Перезалейте, пожалуйста, если не трудно.
vovnetДата: Среда, 20 Марта 2013, 19:03 | Сообщение # 7
почетный гость
Сейчас нет на сайте
Цитата (Sealrean)
Здравствуйте. Большое спасибо за уроки!
Но ссылки на исходники уже умерли, как в первом уроке, так и во всех последующих sad Перезалейте, пожалуйста, если не трудно.

К сожалению пару дней назад удалил файлы по этим урокам, т.к. нет времени дальше их развивать...
Могу книжку по Box2D дать, но она на английском.
Книжка


SealreanДата: Среда, 20 Марта 2013, 19:10 | Сообщение # 8
был не раз
Сейчас нет на сайте
Жаль, конечно sad
Надеюсь, что в исходниках не было принципиальных отличий от статей, выложенных здесь.
Спасибо за книжку smile
Форум игроделов » Движки для разработки игр и сложные системы разработки » 2D-движки для создания игр » Box2D 2.1a Tutorial – Part 1 (Basic) (Урок 1 по Box2D 2.1a)
  • Страница 1 из 1
  • 1
Поиск:

Все права сохранены. GcUp.ru © 2008-2024 Рейтинг