Emanuele Feronato » Box2D http://www.emanueleferonato.com italian geek and PROgrammer Thu, 02 Sep 2010 09:32:52 +0000 en hourly 1 http://wordpress.org/?v=abc Create Box2D levels in a quick with Bison Kick http://www.emanueleferonato.com/2010/08/16/create-box2d-levels-in-a-quick-with-bison-kick/ http://www.emanueleferonato.com/2010/08/16/create-box2d-levels-in-a-quick-with-bison-kick/#comments Mon, 16 Aug 2010 21:41:38 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=3235 Some time ago I published a Basic Box2D editor using Flash movieclips.

Now it’s time to show you something way more interesting called Bison Kick by Jacob Schatz who runs the blog jacobschatz.com (bookmark it! It contains a lot of useful information).

It’s an online Box2D editor with live preview.

Besides it’s still under development, with more options to be added and a few bugs to be removed, it’s very fun and simple to use.

I tried to design a level to be used in a game like Totem Destroyer and I managed to export it both in AS3:

//order: x , y , height, width, rotation, isDynamic, shape, friction,density,restitution,ID 
 var map:Array = [
[175,324,50,50,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[325,325,50,50,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[250,375,50,500,0,false,'SQUARE' , 1,0.5,0.5,'ground']
,[250,275,50,300,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[250,200,100,150,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[125,225,50,50,0,true,'SQUARE' , 1,2,0.5,'heavy']
,[250,125,50,50,0,true,'SQUARE' , 1,2,0.5,'heavy']
,[375,225,50,50,0,true,'SQUARE' , 1,2,0.5,'heavy']
,[250,50,100,50,0,true,'SQUARE' , 1,0.25,0.5,'totem']
];

and in XML:

<level>
  <completeShape>
    <xprop>175</xprop>
    <yprop>324</yprop>
    <height>50</height>
    <width>50</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,0.5,0.5,'normal'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>325</xprop>
    <yprop>325</yprop>
    <height>50</height>
    <width>50</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,0.5,0.5,'normal'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>250</xprop>
    <yprop>375</yprop>
    <height>50</height>
    <width>500</width>
    <rotation>0</rotation>
    <isDynamic>false</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,0.5,0.5,'ground'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>250</xprop>
    <yprop>275</yprop>
    <height>50</height>
    <width>300</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,0.5,0.5,'normal'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>250</xprop>
    <yprop>200</yprop>
    <height>100</height>
    <width>150</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,0.5,0.5,'normal'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>125</xprop>
    <yprop>225</yprop>
    <height>50</height>
    <width>50</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,2,0.5,'heavy'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>250</xprop>
    <yprop>125</yprop>
    <height>50</height>
    <width>50</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,2,0.5,'heavy'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>375</xprop>
    <yprop>225</yprop>
    <height>50</height>
    <width>50</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,2,0.5,'heavy'</physicsandID>
  </completeShape>
  <completeShape>
    <xprop>250</xprop>
    <yprop>50</yprop>
    <height>100</height>
    <width>50</width>
    <rotation>0</rotation>
    <isDynamic>true</isDynamic>
    <shape>SQUARE</shape>
    <physicsandID>1,0.25,0.5,'totem'</physicsandID>
  </completeShape>
</level>

Then, creating a Box2D world from these data was really easy thanks to the snippet of code provided by Jacob:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122

package 
{	
	import Box2D.Dynamics.Joints.*;
	import flash.display.Sprite;
	import flash.events.KeyboardEvent;
	import flash.events.Event;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
 
	public class Main extends Sprite {
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int = 30;
 
		public static const SQUARE:String = "SQUARE";
		public static const CIRCLE:String = "CIRCLE";
		public var fixtureDef:b2FixtureDef = new b2FixtureDef();
 
		public var specialB2Body:b2Body;
 
		public var motorOn:Boolean;
 
		//order: x , y , height, width, rotation, isDynamic, shape, friction,density,restitution,ID 
 var map:Array = [
[175,324,50,50,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[325,325,50,50,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[250,375,50,500,0,false,'SQUARE' , 1,0.5,0.5,'ground']
,[250,275,50,300,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[250,200,100,150,0,true,'SQUARE' , 1,0.5,0.5,'normal']
,[125,225,50,50,0,true,'SQUARE' , 1,2,0.5,'heavy']
,[250,125,50,50,0,true,'SQUARE' , 1,2,0.5,'heavy']
,[375,225,50,50,0,true,'SQUARE' , 1,2,0.5,'heavy']
,[250,50,100,50,0,true,'SQUARE' , 1,0.25,0.5,'totem']
];		//
		public function Main():void 
		{
			debug_draw();
 
			for (var i:uint = 0; i < map.length; i++)
			{
				var sx:Number = map[i][0];
				var sy:Number = map[i][1];
				var sizerh:Number = map[i][2];
				var sizerw:Number = map[i][3];
				var srot:Number = map[i][4];
				var sIsDynamic:* = map[i][5];
				var sShape:String = map[i][6];
				var sFric:Number = map[i][7];
				var sMass:Number = map[i][8];
				var sRest:Number = map[i][9];
				var boxId:int = map[i][10];
 
				if (sShape == SQUARE)
				{	
					draw_box(sx, sy, sizerw, sizerh, sIsDynamic,srot,sFric,sMass,sRest,boxId);
				}
				else if (sShape == CIRCLE)
				{
					draw_circle(sx, sy, sizerw / 2, sIsDynamic,srot,sFric,sMass,sRest,boxId);
				}
			}
			addEventListener(Event.ENTER_FRAME, update);
		}
 
		public function draw_circle(px:Number, py:Number, r:Number, d:Boolean, rot:Number,
		fric:Number,mass:Number,rest:Number,boxId:int):void {
			var my_body:b2BodyDef= new b2BodyDef();
			my_body.position.Set(px / world_scale, py / world_scale);
			if (d) 
			{
				my_body.type=b2Body.b2_dynamicBody;
			}
			my_body.angle = rot;
			var my_circle:b2CircleShape=new b2CircleShape(r/world_scale);
			var my_fixture:b2FixtureDef = new b2FixtureDef();
			my_fixture.density = mass;
			my_fixture.friction = fric;
			my_fixture.restitution = rest;
			my_fixture.shape=my_circle;
			var world_body:b2Body = world.CreateBody(my_body);
			world_body.CreateFixture(my_fixture);
		}
 
		public function draw_box(px:Number, py:Number, w:Number, h:Number, d:Boolean, rot:Number,
		fric:Number,mass:Number,rest:Number,boxId:int):void {
			var my_body:b2BodyDef = new b2BodyDef();
 
			my_body.position.Set(px / world_scale, py / world_scale);
			my_body.angle = rot;
			if (d) 
			{
				my_body.type=b2Body.b2_dynamicBody;
			}
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsBox(w/2/world_scale, h/2/world_scale);
			var my_fixture:b2FixtureDef = new b2FixtureDef();
			my_fixture.density = mass;
			my_fixture.friction = fric;
			my_fixture.restitution = rest;
			my_fixture.shape=my_box;
			var world_body:b2Body=world.CreateBody(my_body);
			world_body.CreateFixture(my_fixture);
		}
 
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetFillAlpha(0.3);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit);
			world.SetDebugDraw(debug_draw);
		}
		public function update(e : Event):void {
			world.Step(1 / 30, 10, 10);			
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

… and this is what you’ll get:

This the same scene of the screenshot you can see at the beginning of this post.

Next time, I’ll show you how to generate the same thing reading an external XML, and how to add more features.

Download the source code.

]]> http://www.emanueleferonato.com/2010/08/16/create-box2d-levels-in-a-quick-with-bison-kick/feed/ 1 Basic Box2D editor using Flash movieclips http://www.emanueleferonato.com/2010/07/12/basic-box2d-editor-using-flash-movieclips/ http://www.emanueleferonato.com/2010/07/12/basic-box2d-editor-using-flash-movieclips/#comments Mon, 12 Jul 2010 11:16:20 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=3103 When you are about to design a level or whatever else in Box2D, you have to face some design issues due to different unit measurements (Flash works with pixels while Box2D uses meters) and the common problems in level design: the need to have a WYSIWYG interface.

Some frameworks such as Citrus Engine, have a built in editor, but what if you are making a Box2D project on your own?

I am making a little Box2D editor to be used in a couple of games I am making, and it’s based on… Flash movieclips.

It’s the easiest solution if you don’t need a lot of features. The best solution for simple games such as Totem Destroyer.

It works this way: first, we need a movieclip with a box, centered in its origin:

Then using this movieclip, we start building the level in another movieclip just adding and transforming the original box movieclip:

Finally, we need to tell the movieclip which boxes are static and which ones are dynamic: I am giving a d instance name for dynamic boxes and a s instance name for static boxes.

Then it’s just actionscript:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
	public class b2ded extends Sprite {
		// this is the size of the original box movieclip
		public var box_original_size:int=40;
		// importing the editor movieclip
		public var editor:editor_mc = new editor_mc();
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int=30;
		public function b2ded():void {
			debug_draw();
			// placing the editor movieclip in transparency to show its precision
			addChild(editor);
			editor.alpha=0.2
			// looping through all children in the editor movieclip
			for (var i:int=0;i<editor.numChildren;i++) {
				with (editor.getChildAt(i)) {
					// calling the function to fraw a Box2D oriented box
					// just notice how I use scaleX and scaleY instead of width and height
					// because it would give wrong results when dealing with rotated movieclips
					draw_box(x,y,box_original_size*scaleX,box_original_size*scaleY,rotation*0.0174532925,name=="d");
				}
			}
			addEventListener(Event.ENTER_FRAME, update);
		}
		public function draw_box(x_origin:Number,y_origin:Number,box_width:Number,box_height:Number,angle:Number,is_dynamic:Number):void {
			var my_body:b2BodyDef= new b2BodyDef();
			if (is_dynamic) {
				my_body.type=b2Body.b2_dynamicBody;
			}
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsOrientedBox(box_width/2/world_scale, box_height/2/world_scale, new b2Vec2(x_origin/world_scale,y_origin/world_scale),angle);
			var my_fixture:b2FixtureDef = new b2FixtureDef();
			my_fixture.shape=my_box;
			var world_body:b2Body=world.CreateBody(my_body);
			world_body.CreateFixture(my_fixture);
		}
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit);
			world.SetDebugDraw(debug_draw);
		}
		public function update(e : Event):void {
			world.Step(1/30,10,10);
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

And this is the result:

As you can see I perfectly recreated the Box2D environment I made in the editor movieclip.

Obviously it’s far from being complete, but you can add more features just playing with instance name, adding attributes such as density, restitution and so on. If I receive a good feedback, I can improve the editor or share the one I am making for my games.

Download the source code

]]> http://www.emanueleferonato.com/2010/07/12/basic-box2d-editor-using-flash-movieclips/feed/ 10 Following a body with the camera in Box2D – The smart way http://www.emanueleferonato.com/2010/05/04/following-a-body-with-the-camera-in-box2d-the-smart-way/ http://www.emanueleferonato.com/2010/05/04/following-a-body-with-the-camera-in-box2d-the-smart-way/#comments Tue, 04 May 2010 15:49:50 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2828 We are about to create an intelligent camera that will follow a body in Box2D. What’s the difference between an intelligent camera and a dumb one?

Simple… the intelligent camera follows the object keeping it in the middle of the screen as long as there are enough game area to fill the screen. The dumb one just keeps the object in the middle of the screen, sometime causing to have just a little part of the game on the screen.

Let me make things clearer with a real world example:

In this map, taken from Crystal Kingdom Dizzy, the cherry is followed by a smart camera, because the cherry is centered and the game area fills the entire screen.

Now look at this:

The cherry moved up and the camera followed it in a dumb way: the camera wanted to keep the cherry in the middle of the screen, but doing it will make the game scroll down even if there aren’t enough game area to fill the entire screen.

An intelligent camera should show the cherry this way:

So when the cherry moves in a direction that would make the game scroll away from the screen, the camera has to release it and don’t keep it in the middle of the screen until there is enough gaming area to fill the entire screen.

How do we apply this concept to the catapult prototype?

This way:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.KeyboardEvent;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
	import Box2D.Dynamics.Joints.*;
	public class main extends Sprite {
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int=30;
		var the_cannonball_itself:b2Body;
		var catapult_chassis_body:b2Body;
		var catapult_arm_body:b2Body;
		var rear_wheel_body:b2Body;
		var front_wheel_body:b2Body;
		var arm_revolute_joint:b2RevoluteJoint;
		var front_wheel_revolute_joint:b2RevoluteJoint;
		var rear_wheel_revolute_joint:b2RevoluteJoint;
		var left_key_pressed:Boolean=false;
		var right_key_pressed:Boolean=false;
		var following_catapult:Boolean=true;
		var bg:background_mc = new background_mc();
		public function main():void {
			addChild(bg);
			debug_draw();
			the_ground();
			the_catapult_body();
			the_catapult_arm();
			the_catapult_motor();
			the_wheels();
			the_wheel_motors();
			the_cannonball();
			addEventListener(Event.ENTER_FRAME, update);
			stage.addEventListener(KeyboardEvent.KEY_DOWN, key_down);
			stage.addEventListener(KeyboardEvent.KEY_UP, key_up);
		}
		public function the_cannonball():void {
			var cannonball:b2BodyDef= new b2BodyDef();
			cannonball.position.Set(90/world_scale, 90/world_scale);
			cannonball.type=b2Body.b2_dynamicBody;
			var ball:b2CircleShape=new b2CircleShape(10/world_scale);
			var cannonball_fixture:b2FixtureDef = new b2FixtureDef();
			cannonball_fixture.shape=ball;
			cannonball_fixture.friction=0.9;
			cannonball_fixture.density=20;
			cannonball_fixture.restitution=0.5;
			the_cannonball_itself=world.CreateBody(cannonball);
			the_cannonball_itself.CreateFixture(cannonball_fixture);
		}
		public function the_wheel_motors():void {
			var front_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			front_wheel_joint.enableMotor=true;
			front_wheel_joint.Initialize(catapult_chassis_body, front_wheel_body,new b2Vec2(0,0));
			front_wheel_joint.localAnchorA=new b2Vec2(80/world_scale,0);
			front_wheel_joint.localAnchorB=new b2Vec2(0,0);
			front_wheel_revolute_joint=world.CreateJoint(front_wheel_joint) as b2RevoluteJoint;
			front_wheel_revolute_joint.SetMaxMotorTorque(1000000);
			//
			var rear_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			rear_wheel_joint.enableMotor=true;
			rear_wheel_joint.Initialize(catapult_chassis_body, rear_wheel_body,new b2Vec2(0,0));
			rear_wheel_joint.localAnchorA=new b2Vec2(-80/world_scale,0);
			rear_wheel_joint.localAnchorB=new b2Vec2(0,0);
			rear_wheel_revolute_joint=world.CreateJoint(rear_wheel_joint) as b2RevoluteJoint;
			rear_wheel_revolute_joint.SetMaxMotorTorque(1000000);
		}
		public function the_wheels():void {
			var rear_wheel:b2BodyDef= new b2BodyDef();
			rear_wheel.position.Set(250/world_scale, 200/world_scale);
			rear_wheel.type=b2Body.b2_dynamicBody;
			var rear_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var rear_wheel_fixture:b2FixtureDef = new b2FixtureDef();
			rear_wheel_fixture.shape=rear_wheel_shape;
			rear_wheel_fixture.friction=0.9;
			rear_wheel_fixture.density=30;
			rear_wheel_fixture.restitution=0.1;
			rear_wheel_body=world.CreateBody(rear_wheel);
			rear_wheel_body.CreateFixture(rear_wheel_fixture);
			//
			var front_wheel:b2BodyDef= new b2BodyDef();
			front_wheel.position.Set(450/world_scale, 200/world_scale);
			front_wheel.type=b2Body.b2_dynamicBody;
			var front_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var front_wheel_fixture:b2FixtureDef = new b2FixtureDef();
			front_wheel_fixture.shape=front_wheel_shape;
			front_wheel_fixture.friction=0.9;
			front_wheel_fixture.density=30;
			front_wheel_fixture.restitution=0.1;
			front_wheel_body=world.CreateBody(front_wheel);
			front_wheel_body.CreateFixture(front_wheel_fixture);
		}
		public function the_catapult_motor():void {
			var arm_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			arm_joint.enableMotor=true;
			arm_joint.enableLimit=true;
			arm_joint.Initialize(catapult_chassis_body, catapult_arm_body,new b2Vec2(0,0));
			arm_joint.localAnchorA=new b2Vec2(-80/world_scale,-90/world_scale);
			arm_joint.localAnchorB=new b2Vec2(60/world_scale,0);
			arm_revolute_joint=world.CreateJoint(arm_joint) as b2RevoluteJoint;
			arm_revolute_joint.SetMotorSpeed(1000);
			arm_revolute_joint.SetLimits(-Math.PI,Math.PI/3);
			arm_revolute_joint.SetMaxMotorTorque(1);
		}
		public function the_catapult_arm():void {
			var catapult_arm:b2BodyDef = new b2BodyDef();
			catapult_arm.allowSleep=false;
			catapult_arm.position.Set(210/world_scale,110/world_scale);
			catapult_arm.type=b2Body.b2_dynamicBody;
			var arm_part:b2PolygonShape = new b2PolygonShape();
			arm_part.SetAsOrientedBox(150/world_scale, 10/world_scale, new b2Vec2(0,0),0);
			var arm_part_fixture:b2FixtureDef = new b2FixtureDef();
			arm_part_fixture.shape=arm_part;
			arm_part_fixture.friction=0.9;
			arm_part_fixture.density=5;
			arm_part_fixture.restitution=0.1;
			var stopper:b2PolygonShape = new b2PolygonShape();
			stopper.SetAsOrientedBox(10/world_scale, 20/world_scale, new b2Vec2(-140/world_scale,-30/world_scale),0);
			var stopper_fixture:b2FixtureDef = new b2FixtureDef();
			stopper_fixture.shape=stopper;
			stopper_fixture.friction=0.9;
			stopper_fixture.density=10;
			stopper_fixture.restitution=0.1;
			catapult_arm_body=world.CreateBody(catapult_arm);
			catapult_arm_body.CreateFixture(arm_part_fixture);
			catapult_arm_body.CreateFixture(stopper_fixture);
		}
		public function the_catapult_body():void {
			var catapult_body:b2BodyDef = new b2BodyDef();
			catapult_body.position.Set(350/world_scale,200/world_scale);
			catapult_body.type=b2Body.b2_dynamicBody;
			var main_part:b2PolygonShape = new b2PolygonShape();
			main_part.SetAsOrientedBox(125/world_scale, 20/world_scale, new b2Vec2(0,0),0);
			var chassis_fixture:b2FixtureDef = new b2FixtureDef();
			chassis_fixture.shape=main_part;
			chassis_fixture.friction=0.9;
			chassis_fixture.density=50;
			chassis_fixture.restitution=0.1;
			var fixed_arm:b2PolygonShape = new b2PolygonShape();
			fixed_arm.SetAsOrientedBox(20/world_scale, 60/world_scale, new b2Vec2(-80/world_scale,-40/world_scale),0);
			var fixed_arm_fixture:b2FixtureDef = new b2FixtureDef();
			fixed_arm_fixture.shape=fixed_arm;
			fixed_arm_fixture.friction=0.9;
			fixed_arm_fixture.density=1;
			fixed_arm_fixture.restitution=0.1;
			catapult_chassis_body=world.CreateBody(catapult_body);
			catapult_chassis_body.CreateFixture(chassis_fixture);
			catapult_chassis_body.CreateFixture(fixed_arm_fixture);
		}
		public function the_ground():void {
			var ground:b2BodyDef= new b2BodyDef();
			ground.position.Set(2500/world_scale, 400/world_scale);
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsBox(2500/world_scale, 15/world_scale);
			var ground_fixture:b2FixtureDef = new b2FixtureDef();
			ground_fixture.shape=my_box;
			ground_fixture.friction=0.9;
			ground_fixture.restitution=0.1;
			//
			var my_box2:b2PolygonShape = new b2PolygonShape();
			my_box2.SetAsOrientedBox(15/world_scale, 350/world_scale, new b2Vec2(2485/world_scale,-335/world_scale),0);
			var right_wall_fixture:b2FixtureDef = new b2FixtureDef();
			right_wall_fixture.shape=my_box2;
			right_wall_fixture.friction=0.9;
			right_wall_fixture.restitution=0.1;
			//
			var my_box3:b2PolygonShape = new b2PolygonShape();
			my_box3.SetAsOrientedBox(15/world_scale, 350/world_scale, new b2Vec2(-2485/world_scale,-335/world_scale),0);
			var left_wall_fixture:b2FixtureDef = new b2FixtureDef();
			left_wall_fixture.shape=my_box3;
			left_wall_fixture.friction=0.9;
			left_wall_fixture.restitution=0.1;
			//
			var my_box4:b2PolygonShape = new b2PolygonShape();
			my_box4.SetAsOrientedBox(2500/world_scale, 15/world_scale, new b2Vec2(0,-670/world_scale),0);
			var roof_fixture:b2FixtureDef = new b2FixtureDef();
			roof_fixture.shape=my_box4;
			roof_fixture.friction=0.9;
			roof_fixture.restitution=0.1;
			//
			var the_ground_itself:b2Body=world.CreateBody(ground);
			the_ground_itself.CreateFixture(ground_fixture);
			the_ground_itself.CreateFixture(right_wall_fixture);
			the_ground_itself.CreateFixture(left_wall_fixture);
			the_ground_itself.CreateFixture(roof_fixture);
		}
		public function key_up(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					right_key_pressed=false;
					break;
				case 37 :
					left_key_pressed=false;
					break;
			}
		}
		public function key_down(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					right_key_pressed=true;
					left_key_pressed=false;
					break;
				case 37 :
					left_key_pressed=true;
					right_key_pressed=false;
					break;
				case 32 :
					arm_revolute_joint.SetMaxMotorTorque(10000);
					following_catapult=false;
					break;
			}
		}
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit|b2DebugDraw.e_jointBit);
			debug_draw.SetFillAlpha(0.5);
			world.SetDebugDraw(debug_draw);
		}
		public function set_motor_speed():void {
			var current_speed:Number;
			if (right_key_pressed) {
				current_speed=1;
			}
			if (left_key_pressed) {
				current_speed=-1;
			}
			if (! right_key_pressed&&! left_key_pressed) {
				current_speed=rear_wheel_revolute_joint.GetMotorSpeed()*0.9;
				if (Math.abs(current_speed)<0.1) {
					current_speed=0;
				}
			}
			rear_wheel_revolute_joint.SetMotorSpeed(current_speed);
			front_wheel_revolute_joint.SetMotorSpeed(current_speed);
		}
		public function update(e:Event):void {
			var pos_x:Number;
			var pos_y:Number;
			set_motor_speed();
			world.Step(1/30,10,10);
			if (following_catapult) {
				pos_x=catapult_chassis_body.GetWorldCenter().x*world_scale;
				pos_y=catapult_chassis_body.GetWorldCenter().y*world_scale;
			} else {
				pos_x=the_cannonball_itself.GetWorldCenter().x*world_scale;
				pos_y=the_cannonball_itself.GetWorldCenter().y*world_scale;
			}
			pos_x=stage.stageWidth/2-pos_x;
			if (pos_x<0-4500) {
				pos_x=-4500;
			}
			if (pos_x>0) {
				pos_x=0;
			}
			x=pos_x;
			pos_y=stage.stageHeight/2-pos_y;
			if (pos_y<0-15) {
				pos_y=-15;
			}
			if (pos_y>285) {
				pos_y=285;
			}
			y=pos_y;
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

And this is the result:

Left and right arrows to move the catapult, spacebar to fire

Download the example and wait for the fully commented source code.

]]> http://www.emanueleferonato.com/2010/05/04/following-a-body-with-the-camera-in-box2d-the-smart-way/feed/ 7 Following a body with the camera in Box2D http://www.emanueleferonato.com/2010/04/29/following-a-body-with-the-camera-in-box2d/ http://www.emanueleferonato.com/2010/04/29/following-a-body-with-the-camera-in-box2d/#comments Thu, 29 Apr 2010 03:57:19 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2813 If you want to make a good game, a good camera movement is necessary.

This time we’ll learn to follow a Box2D object with the camera. Box2D does not have a “camera”, so we will have to move the stage according to body position. This is the same script as Real world catapult using Box2D – cleaner code, I just placed a gradient background to help you seeing how the camera is following the objects.

The main idea is following the catapult until it fires the cannonball, then following the cannonball.

This is the result:

Left and right to move, spacebar to fire

And this is the code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.KeyboardEvent;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
	import Box2D.Dynamics.Joints.*;
	public class main extends Sprite {
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int=30;
		var the_cannonball_itself:b2Body;
		var catapult_chassis_body:b2Body;
		var catapult_arm_body:b2Body;
		var rear_wheel_body:b2Body;
		var front_wheel_body:b2Body;
		var arm_revolute_joint:b2RevoluteJoint;
		var front_wheel_revolute_joint:b2RevoluteJoint;
		var rear_wheel_revolute_joint:b2RevoluteJoint;
		var left_key_pressed:Boolean=false;
		var right_key_pressed:Boolean=false;
		var following_catapult:Boolean=true;
		var bg:background_mc = new background_mc();
		public function main():void {
			addChild(bg);
			debug_draw();
			the_ground();
			the_catapult_body();
			the_catapult_arm();
			the_catapult_motor();
			the_wheels();
			the_wheel_motors();
			the_cannonball();
			addEventListener(Event.ENTER_FRAME, update);
			stage.addEventListener(KeyboardEvent.KEY_DOWN, key_down);
			stage.addEventListener(KeyboardEvent.KEY_UP, key_up);
		}
		public function the_cannonball():void {
			var cannonball:b2BodyDef= new b2BodyDef();
			cannonball.position.Set(90/world_scale, 90/world_scale);
			cannonball.type=b2Body.b2_dynamicBody;
			var ball:b2CircleShape=new b2CircleShape(10/world_scale);
			var cannonball_fixture:b2FixtureDef = new b2FixtureDef();
			cannonball_fixture.shape=ball;
			cannonball_fixture.friction=0.9;
			cannonball_fixture.density=20;
			cannonball_fixture.restitution=0.5;
			the_cannonball_itself=world.CreateBody(cannonball);
			the_cannonball_itself.CreateFixture(cannonball_fixture);
		}
		public function the_wheel_motors():void {
			var front_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			front_wheel_joint.enableMotor=true;
			front_wheel_joint.Initialize(catapult_chassis_body, front_wheel_body,new b2Vec2(0,0));
			front_wheel_joint.localAnchorA=new b2Vec2(80/world_scale,0);
			front_wheel_joint.localAnchorB=new b2Vec2(0,0);
			front_wheel_revolute_joint=world.CreateJoint(front_wheel_joint) as b2RevoluteJoint;
			front_wheel_revolute_joint.SetMaxMotorTorque(1000000);
			//
			var rear_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			rear_wheel_joint.enableMotor=true;
			rear_wheel_joint.Initialize(catapult_chassis_body, rear_wheel_body,new b2Vec2(0,0));
			rear_wheel_joint.localAnchorA=new b2Vec2(-80/world_scale,0);
			rear_wheel_joint.localAnchorB=new b2Vec2(0,0);
			rear_wheel_revolute_joint=world.CreateJoint(rear_wheel_joint) as b2RevoluteJoint;
			rear_wheel_revolute_joint.SetMaxMotorTorque(1000000);
		}
		public function the_wheels():void {
			var rear_wheel:b2BodyDef= new b2BodyDef();
			rear_wheel.position.Set(250/world_scale, 200/world_scale);
			rear_wheel.type=b2Body.b2_dynamicBody;
			var rear_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var rear_wheel_fixture:b2FixtureDef = new b2FixtureDef();
			rear_wheel_fixture.shape=rear_wheel_shape;
			rear_wheel_fixture.friction=0.9;
			rear_wheel_fixture.density=30;
			rear_wheel_fixture.restitution=0.1;
			rear_wheel_body=world.CreateBody(rear_wheel);
			rear_wheel_body.CreateFixture(rear_wheel_fixture);
			//
			var front_wheel:b2BodyDef= new b2BodyDef();
			front_wheel.position.Set(450/world_scale, 200/world_scale);
			front_wheel.type=b2Body.b2_dynamicBody;
			var front_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var front_wheel_fixture:b2FixtureDef = new b2FixtureDef();
			front_wheel_fixture.shape=front_wheel_shape;
			front_wheel_fixture.friction=0.9;
			front_wheel_fixture.density=30;
			front_wheel_fixture.restitution=0.1;
			front_wheel_body=world.CreateBody(front_wheel);
			front_wheel_body.CreateFixture(front_wheel_fixture);
		}
		public function the_catapult_motor():void {
			var arm_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			arm_joint.enableMotor=true;
			arm_joint.enableLimit=true;
			arm_joint.Initialize(catapult_chassis_body, catapult_arm_body,new b2Vec2(0,0));
			arm_joint.localAnchorA=new b2Vec2(-80/world_scale,-90/world_scale);
			arm_joint.localAnchorB=new b2Vec2(60/world_scale,0);
			arm_revolute_joint=world.CreateJoint(arm_joint) as b2RevoluteJoint;
			arm_revolute_joint.SetMotorSpeed(1000);
			arm_revolute_joint.SetLimits(-Math.PI,Math.PI/3);
			arm_revolute_joint.SetMaxMotorTorque(1);
		}
		public function the_catapult_arm():void {
			var catapult_arm:b2BodyDef = new b2BodyDef();
			catapult_arm.allowSleep=false;
			catapult_arm.position.Set(210/world_scale,110/world_scale);
			catapult_arm.type=b2Body.b2_dynamicBody;
			var arm_part:b2PolygonShape = new b2PolygonShape();
			arm_part.SetAsOrientedBox(150/world_scale, 10/world_scale, new b2Vec2(0,0),0);
			var arm_part_fixture:b2FixtureDef = new b2FixtureDef();
			arm_part_fixture.shape=arm_part;
			arm_part_fixture.friction=0.9;
			arm_part_fixture.density=5;
			arm_part_fixture.restitution=0.1;
			var stopper:b2PolygonShape = new b2PolygonShape();
			stopper.SetAsOrientedBox(10/world_scale, 20/world_scale, new b2Vec2(-140/world_scale,-30/world_scale),0);
			var stopper_fixture:b2FixtureDef = new b2FixtureDef();
			stopper_fixture.shape=stopper;
			stopper_fixture.friction=0.9;
			stopper_fixture.density=10;
			stopper_fixture.restitution=0.1;
			catapult_arm_body=world.CreateBody(catapult_arm);
			catapult_arm_body.CreateFixture(arm_part_fixture);
			catapult_arm_body.CreateFixture(stopper_fixture);
		}
		public function the_catapult_body():void {
			var catapult_body:b2BodyDef = new b2BodyDef();
			catapult_body.position.Set(350/world_scale,200/world_scale);
			catapult_body.type=b2Body.b2_dynamicBody;
			var main_part:b2PolygonShape = new b2PolygonShape();
			main_part.SetAsOrientedBox(125/world_scale, 20/world_scale, new b2Vec2(0,0),0);
			var chassis_fixture:b2FixtureDef = new b2FixtureDef();
			chassis_fixture.shape=main_part;
			chassis_fixture.friction=0.9;
			chassis_fixture.density=50;
			chassis_fixture.restitution=0.1;
			var fixed_arm:b2PolygonShape = new b2PolygonShape();
			fixed_arm.SetAsOrientedBox(20/world_scale, 60/world_scale, new b2Vec2(-80/world_scale,-40/world_scale),0);
			var fixed_arm_fixture:b2FixtureDef = new b2FixtureDef();
			fixed_arm_fixture.shape=fixed_arm;
			fixed_arm_fixture.friction=0.9;
			fixed_arm_fixture.density=1;
			fixed_arm_fixture.restitution=0.1;
			catapult_chassis_body=world.CreateBody(catapult_body);
			catapult_chassis_body.CreateFixture(chassis_fixture);
			catapult_chassis_body.CreateFixture(fixed_arm_fixture);
		}
		public function the_ground():void {
			var ground:b2BodyDef= new b2BodyDef();
			ground.position.Set(250/world_scale, 400/world_scale);
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsBox(5000/world_scale, 15/world_scale);
			var ground_fixture:b2FixtureDef = new b2FixtureDef();
			ground_fixture.shape=my_box;
			ground_fixture.friction=0.9;
			ground_fixture.restitution=0.1;
			var the_ground_itself:b2Body=world.CreateBody(ground);
			the_ground_itself.CreateFixture(ground_fixture);
		}
		public function key_up(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					right_key_pressed=false;
					break;
				case 37 :
					left_key_pressed=false;
					break;
			}
		}
		public function key_down(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					right_key_pressed=true;
					left_key_pressed=false;
					break;
				case 37 :
					left_key_pressed=true;
					right_key_pressed=false;
					break;
				case 32 :
					arm_revolute_joint.SetMaxMotorTorque(10000);
					following_catapult=false;
					break;
			}
		}
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit|b2DebugDraw.e_jointBit);
			debug_draw.SetFillAlpha(0.5);
			world.SetDebugDraw(debug_draw);
		}
		public function set_motor_speed():void {
			var current_speed:Number;
			if (right_key_pressed) {
				current_speed=1;
			}
			if (left_key_pressed) {
				current_speed=-1;
			}
			if (! right_key_pressed&&! left_key_pressed) {
				current_speed=rear_wheel_revolute_joint.GetMotorSpeed()*0.9;
				if (Math.abs(current_speed)<0.1) {
					current_speed=0;
				}
			}
			rear_wheel_revolute_joint.SetMotorSpeed(current_speed);
			front_wheel_revolute_joint.SetMotorSpeed(current_speed);
		}
		public function update(e:Event):void {
			var pos_x:Number;
			var pos_y:Number;
			set_motor_speed();
			world.Step(1/30,10,10);
			if (following_catapult) {
				pos_x=catapult_chassis_body.GetWorldCenter().x*world_scale;
				pos_y=catapult_chassis_body.GetWorldCenter().y*world_scale;
			} else {
				pos_x=the_cannonball_itself.GetWorldCenter().x*world_scale;
				pos_y=the_cannonball_itself.GetWorldCenter().y*world_scale;
			}
			x=stage.stageWidth/2-pos_x;
			y=stage.stageHeight/2-pos_y;
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

Download the source code. Next time, smarter camera movement and fully commented code.

]]> http://www.emanueleferonato.com/2010/04/29/following-a-body-with-the-camera-in-box2d/feed/ 8 Quoted on Adobe Edge: April 2010 edition http://www.emanueleferonato.com/2010/04/27/quoted-on-adobe-edge-april-2010-edition/ http://www.emanueleferonato.com/2010/04/27/quoted-on-adobe-edge-april-2010-edition/#comments Tue, 27 Apr 2010 02:40:20 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2806 If you want to read an interesting article about Flash games and physics, I suggest you to point your browser on Developing physics-based games with Adobe Flash Professional by Samuel Asher Rivello.

I was quoted in the article, but what makes it really great is the way it will guide you through the creation of a physics-based game called StackZ

Also, Samuel has an awesome way to comment the code, a must see for all coders.

Happy reading

]]> http://www.emanueleferonato.com/2010/04/27/quoted-on-adobe-edge-april-2010-edition/feed/ 3 Real world catapult prototype using Box2D – Cleaner code http://www.emanueleferonato.com/2010/04/14/real-world-catapult-prototype-using-box2d-%e2%80%93-cleaner-code/ http://www.emanueleferonato.com/2010/04/14/real-world-catapult-prototype-using-box2d-%e2%80%93-cleaner-code/#comments Wed, 14 Apr 2010 16:58:47 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2732 We got it.

After the first catapult prototype and the “slippery wheels” sequel, this is a version with realistic movement and a lot cleaner code.

To add realistic movement I defined friction and restitution, making useless the CreateFixture2 function and widely using the more appropriate CreateFixture one.

This way I have full control on fixtures, while in the old way I could only define their masses.

This is the result:

Left and right to move, spacebar to fire

And this is the code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.KeyboardEvent;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
	import Box2D.Dynamics.Joints.*;
	public class main extends Sprite {
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int=30;
		var catapult_chassis_body:b2Body;
		var catapult_arm_body:b2Body;
		var rear_wheel_body:b2Body;
		var front_wheel_body:b2Body;
		var arm_revolute_joint:b2RevoluteJoint;
		var front_wheel_revolute_joint:b2RevoluteJoint;
		var rear_wheel_revolute_joint:b2RevoluteJoint;
		var left_key_pressed:Boolean=false;
		var right_key_pressed:Boolean=false;
		public function main():void {
			debug_draw();
			the_ground();
			the_catapult_body();
			the_catapult_arm();
			the_catapult_motor();
			the_wheels();
			the_wheel_motors();
			the_cannonball();
			addEventListener(Event.ENTER_FRAME, update);
			stage.addEventListener(KeyboardEvent.KEY_DOWN, key_down);
			stage.addEventListener(KeyboardEvent.KEY_UP, key_up);
		}
		public function the_cannonball():void {
			var cannonball:b2BodyDef= new b2BodyDef();
			cannonball.position.Set(90/world_scale, 90/world_scale);
			cannonball.type=b2Body.b2_dynamicBody;
			var ball:b2CircleShape=new b2CircleShape(10/world_scale);
			var cannonball_fixture:b2FixtureDef = new b2FixtureDef();
			cannonball_fixture.shape=ball;
			cannonball_fixture.friction=0.9;
			cannonball_fixture.density=20;
			cannonball_fixture.restitution=0.5;
			var the_cannonball_itself:b2Body=world.CreateBody(cannonball);
			the_cannonball_itself.CreateFixture(cannonball_fixture);
		}
		public function the_wheel_motors():void {
			var front_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			front_wheel_joint.enableMotor=true;
			front_wheel_joint.Initialize(catapult_chassis_body, front_wheel_body,new b2Vec2(0,0));
			front_wheel_joint.localAnchorA=new b2Vec2(80/world_scale,0);
			front_wheel_joint.localAnchorB=new b2Vec2(0,0);
			front_wheel_revolute_joint=world.CreateJoint(front_wheel_joint) as b2RevoluteJoint;
			front_wheel_revolute_joint.SetMaxMotorTorque(1000000);
			//
			var rear_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			rear_wheel_joint.enableMotor=true;
			rear_wheel_joint.Initialize(catapult_chassis_body, rear_wheel_body,new b2Vec2(0,0));
			rear_wheel_joint.localAnchorA=new b2Vec2(-80/world_scale,0);
			rear_wheel_joint.localAnchorB=new b2Vec2(0,0);
			rear_wheel_revolute_joint=world.CreateJoint(rear_wheel_joint) as b2RevoluteJoint;
			rear_wheel_revolute_joint.SetMaxMotorTorque(1000000);
		}
		public function the_wheels():void {
			var rear_wheel:b2BodyDef= new b2BodyDef();
			rear_wheel.position.Set(250/world_scale, 200/world_scale);
			rear_wheel.type=b2Body.b2_dynamicBody;
			var rear_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var rear_wheel_fixture:b2FixtureDef = new b2FixtureDef();
			rear_wheel_fixture.shape=rear_wheel_shape;
			rear_wheel_fixture.friction=0.9;
			rear_wheel_fixture.density=30;
			rear_wheel_fixture.restitution=0.1;
			rear_wheel_body=world.CreateBody(rear_wheel);
			rear_wheel_body.CreateFixture(rear_wheel_fixture);
			//
			var front_wheel:b2BodyDef= new b2BodyDef();
			front_wheel.position.Set(450/world_scale, 200/world_scale);
			front_wheel.type=b2Body.b2_dynamicBody;
			var front_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var front_wheel_fixture:b2FixtureDef = new b2FixtureDef();
			front_wheel_fixture.shape=front_wheel_shape;
			front_wheel_fixture.friction=0.9;
			front_wheel_fixture.density=30;
			front_wheel_fixture.restitution=0.1;
			front_wheel_body=world.CreateBody(front_wheel);
			front_wheel_body.CreateFixture(front_wheel_fixture);
		}
		public function the_catapult_motor():void {
			var arm_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
			arm_joint.enableMotor=true;
			arm_joint.enableLimit=true;
			arm_joint.Initialize(catapult_chassis_body, catapult_arm_body,new b2Vec2(0,0));
			arm_joint.localAnchorA=new b2Vec2(-80/world_scale,-90/world_scale);
			arm_joint.localAnchorB=new b2Vec2(60/world_scale,0);
			arm_revolute_joint=world.CreateJoint(arm_joint) as b2RevoluteJoint;
			arm_revolute_joint.SetMotorSpeed(1000);
			arm_revolute_joint.SetLimits(-Math.PI,Math.PI/3);
			arm_revolute_joint.SetMaxMotorTorque(1);
		}
		public function the_catapult_arm():void {
			var catapult_arm:b2BodyDef = new b2BodyDef();
			catapult_arm.allowSleep=false;
			catapult_arm.position.Set(210/world_scale,110/world_scale);
			catapult_arm.type=b2Body.b2_dynamicBody;
			var arm_part:b2PolygonShape = new b2PolygonShape();
			arm_part.SetAsOrientedBox(150/world_scale, 10/world_scale, new b2Vec2(0,0),0);
			var arm_part_fixture:b2FixtureDef = new b2FixtureDef();
			arm_part_fixture.shape=arm_part;
			arm_part_fixture.friction=0.9;
			arm_part_fixture.density=5;
			arm_part_fixture.restitution=0.1;
			var stopper:b2PolygonShape = new b2PolygonShape();
			stopper.SetAsOrientedBox(10/world_scale, 20/world_scale, new b2Vec2(-140/world_scale,-30/world_scale),0);
			var stopper_fixture:b2FixtureDef = new b2FixtureDef();
			stopper_fixture.shape=stopper;
			stopper_fixture.friction=0.9;
			stopper_fixture.density=10;
			stopper_fixture.restitution=0.1;
			catapult_arm_body=world.CreateBody(catapult_arm);
			catapult_arm_body.CreateFixture(arm_part_fixture);
			catapult_arm_body.CreateFixture(stopper_fixture);
		}
		public function the_catapult_body():void {
			var catapult_body:b2BodyDef = new b2BodyDef();
			catapult_body.position.Set(350/world_scale,200/world_scale);
			catapult_body.type=b2Body.b2_dynamicBody;
			var main_part:b2PolygonShape = new b2PolygonShape();
			main_part.SetAsOrientedBox(125/world_scale, 20/world_scale, new b2Vec2(0,0),0);
			var chassis_fixture:b2FixtureDef = new b2FixtureDef();
			chassis_fixture.shape=main_part;
			chassis_fixture.friction=0.9;
			chassis_fixture.density=50;
			chassis_fixture.restitution=0.1;
			var fixed_arm:b2PolygonShape = new b2PolygonShape();
			fixed_arm.SetAsOrientedBox(20/world_scale, 60/world_scale, new b2Vec2(-80/world_scale,-40/world_scale),0);
			var fixed_arm_fixture:b2FixtureDef = new b2FixtureDef();
			fixed_arm_fixture.shape=fixed_arm;
			fixed_arm_fixture.friction=0.9;
			fixed_arm_fixture.density=1;
			fixed_arm_fixture.restitution=0.1;
			catapult_chassis_body=world.CreateBody(catapult_body);
			catapult_chassis_body.CreateFixture(chassis_fixture);
			catapult_chassis_body.CreateFixture(fixed_arm_fixture);
		}
		public function the_ground():void {
			var ground:b2BodyDef= new b2BodyDef();
			ground.position.Set(250/world_scale, 400/world_scale);
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsBox(1000/world_scale, 15/world_scale);
			var ground_fixture:b2FixtureDef = new b2FixtureDef();
			ground_fixture.shape=my_box;
			ground_fixture.friction=0.9;
			ground_fixture.restitution=0.1;
			var the_ground_itself:b2Body=world.CreateBody(ground);
			the_ground_itself.CreateFixture(ground_fixture);
		}
		public function key_up(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					right_key_pressed=false;
					break;
				case 37 :
					left_key_pressed=false;
					break;
			}
		}
		public function key_down(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					right_key_pressed=true;
					left_key_pressed=false;
					break;
				case 37 :
					left_key_pressed=true;
					right_key_pressed=false;
					break;
				case 32 :
					arm_revolute_joint.SetMaxMotorTorque(10000);
					break;
			}
		}
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit|b2DebugDraw.e_jointBit);
			debug_draw.SetFillAlpha(0.5);
			world.SetDebugDraw(debug_draw);
		}
		public function set_motor_speed():void {
			var current_speed:Number;
			if (right_key_pressed) {
				current_speed=1;
			}
			if (left_key_pressed) {
				current_speed=-1;
			}
			if (! right_key_pressed&&! left_key_pressed) {
				current_speed=rear_wheel_revolute_joint.GetMotorSpeed()*0.9;
				if (Math.abs(current_speed)<0.1) {
					current_speed=0;
				}
			}
			rear_wheel_revolute_joint.SetMotorSpeed(current_speed);
			front_wheel_revolute_joint.SetMotorSpeed(current_speed);
		}
		public function update(e:Event):void {
			set_motor_speed();
			world.Step(1/30,10,10);
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

No need to download, just cut and paste on the first catapult prototype.

Next time, full comments and some other interesting features…

]]> http://www.emanueleferonato.com/2010/04/14/real-world-catapult-prototype-using-box2d-%e2%80%93-cleaner-code/feed/ 5 Real world catapult prototype using Box2D – Adding wheels http://www.emanueleferonato.com/2010/04/09/real-world-catapult-prototype-using-box2d-adding-wheels/ http://www.emanueleferonato.com/2010/04/09/real-world-catapult-prototype-using-box2d-adding-wheels/#comments Fri, 09 Apr 2010 10:09:56 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2708 Did you enjoy the catapult prototype?

Here I am with the second part, adding wheels controlled by left and right arrows.

Have a look:

Now you can move the catapult with left and arrow keys, and shoot with a mouse click

If you feel the catapult is running on an icy surface, that’s because I did not set any friction. I’ll do it next time, when I’ll also come with a decent code, meanwhile check this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.events.KeyboardEvent;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
	import Box2D.Dynamics.Joints.*;
	public class main extends Sprite {
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int=30;
		var arm_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
		var front_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
		var rear_wheel_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
		var arm_revolute_joint_def:b2RevoluteJoint;
		var front_wheel_joint_def:b2RevoluteJoint;
		var rear_wheel_joint_def:b2RevoluteJoint;
		var catapult_body:b2BodyDef = new b2BodyDef();
		var catapult_itself:b2Body;
		public function main():void {
			debug_draw();
			draw_box(250,400,2000,30,false,"ground");
			catapult_body.position.Set(350/world_scale,200/world_scale);
			catapult_body.type=b2Body.b2_dynamicBody;
			var main_part:b2PolygonShape = new b2PolygonShape();
			main_part.SetAsOrientedBox(125/world_scale, 20/world_scale, new b2Vec2(0,0),0);
			var fixed_arm:b2PolygonShape = new b2PolygonShape();
			fixed_arm.SetAsOrientedBox(20/world_scale, 60/world_scale, new b2Vec2(-80/world_scale,-40/world_scale),0);
			catapult_itself=world.CreateBody(catapult_body);
			catapult_itself.CreateFixture2(main_part,200);
			catapult_itself.CreateFixture2(fixed_arm,200);
			var catapult_arm:b2BodyDef = new b2BodyDef();
			catapult_arm.allowSleep=false;
			catapult_arm.position.Set(210/world_scale,110/world_scale);
			catapult_arm.type=b2Body.b2_dynamicBody;
			var arm_part:b2PolygonShape = new b2PolygonShape();
			arm_part.SetAsOrientedBox(150/world_scale, 10/world_scale, new b2Vec2(0,0),0);
			var stopper:b2PolygonShape = new b2PolygonShape();
			stopper.SetAsOrientedBox(10/world_scale, 20/world_scale, new b2Vec2(-140/world_scale,-30/world_scale),0);
			var catapult_arm_itself:b2Body=world.CreateBody(catapult_arm);
			catapult_arm_itself.CreateFixture2(arm_part,1);
			catapult_arm_itself.CreateFixture2(stopper,1);
			//
			arm_joint.enableMotor=true;
			arm_joint.enableLimit=true;
			arm_joint.Initialize(catapult_itself, catapult_arm_itself,new b2Vec2(0,0));
			arm_joint.localAnchorA=new b2Vec2(-80/world_scale,-90/world_scale);
			arm_joint.localAnchorB=new b2Vec2(60/world_scale,0);
			arm_revolute_joint_def=world.CreateJoint(arm_joint) as b2RevoluteJoint;
			arm_revolute_joint_def.SetMotorSpeed(1000);
			arm_revolute_joint_def.SetLimits(-Math.PI,Math.PI/3);
			arm_revolute_joint_def.SetMaxMotorTorque(1);
			//
			var rear_wheel:b2BodyDef= new b2BodyDef();
			rear_wheel.position.Set(250/world_scale, 200/world_scale);
			rear_wheel.type=b2Body.b2_dynamicBody;
			var rear_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var the_rear_wheel_itself:b2Body=world.CreateBody(rear_wheel);
			the_rear_wheel_itself.CreateFixture2(rear_wheel_shape,20);
			var front_wheel:b2BodyDef= new b2BodyDef();
			front_wheel.position.Set(450/world_scale, 200/world_scale);
			front_wheel.type=b2Body.b2_dynamicBody;
			var front_wheel_shape:b2CircleShape=new b2CircleShape(40/world_scale);
			var the_front_wheel_itself:b2Body=world.CreateBody(front_wheel);
			the_front_wheel_itself.CreateFixture2(front_wheel_shape,20);
			//
			front_wheel_joint.enableMotor=true;
			front_wheel_joint.Initialize(catapult_itself, the_front_wheel_itself,new b2Vec2(0,0));
			front_wheel_joint.localAnchorA=new b2Vec2(80/world_scale,0);
			front_wheel_joint.localAnchorB=new b2Vec2(0,0);
			front_wheel_joint_def=world.CreateJoint(front_wheel_joint) as b2RevoluteJoint;
			front_wheel_joint_def.SetMaxMotorTorque(1000000);
			//
			rear_wheel_joint.enableMotor=true;
			rear_wheel_joint.Initialize(catapult_itself, the_rear_wheel_itself,new b2Vec2(0,0));
			rear_wheel_joint.localAnchorA=new b2Vec2(-80/world_scale,0);
			rear_wheel_joint.localAnchorB=new b2Vec2(0,0);
			rear_wheel_joint_def=world.CreateJoint(rear_wheel_joint) as b2RevoluteJoint;
			rear_wheel_joint_def.SetMaxMotorTorque(1000000);
			//
			var cannonball:b2BodyDef= new b2BodyDef();
			cannonball.position.Set(90/world_scale, 90/world_scale);
			cannonball.type=b2Body.b2_dynamicBody;
			var ball:b2CircleShape=new b2CircleShape(10/world_scale);
			var the_cannonball_itself:b2Body=world.CreateBody(cannonball);
			the_cannonball_itself.CreateFixture2(ball,20);
			addEventListener(Event.ENTER_FRAME, update);
			stage.addEventListener(MouseEvent.CLICK,fire);
			stage.addEventListener(KeyboardEvent.KEY_DOWN, key_down);
		}
		public function key_down(event:KeyboardEvent):void {
			switch (event.keyCode) {
				case 39 :
					rear_wheel_joint_def.SetMotorSpeed(10);
					front_wheel_joint_def.SetMotorSpeed(10);
					break;
				case 37 :
					rear_wheel_joint_def.SetMotorSpeed(-10);
					front_wheel_joint_def.SetMotorSpeed(-10);
					break;
			}
		}
 
		public function fire(e:MouseEvent):void {
			arm_revolute_joint_def.SetMaxMotorTorque(10000);
		}
		public function draw_box(px,py,w,h,d,ud):void {
			var ground:b2BodyDef= new b2BodyDef();
			ground.position.Set(px/world_scale, py/world_scale);
			if (d) {
				ground.type=b2Body.b2_dynamicBody;
			}
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsBox(w/2/world_scale, h/2/world_scale);
			var my_fixture:b2FixtureDef = new b2FixtureDef();
			my_fixture.shape=my_box;
			var the_ground_itself:b2Body=world.CreateBody(ground);
			the_ground_itself.SetUserData(ud);
			the_ground_itself.CreateFixture(my_fixture);
		}
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit|b2DebugDraw.e_jointBit);
			debug_draw.SetFillAlpha(0.5);
			world.SetDebugDraw(debug_draw);
		}
		public function update(e:Event):void {
			world.Step(1/30,10,10);
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

No need to download anything, just paste the new code in the catapult prototype file.

]]> http://www.emanueleferonato.com/2010/04/09/real-world-catapult-prototype-using-box2d-adding-wheels/feed/ 3 Real world catapult prototype using Box2D http://www.emanueleferonato.com/2010/04/07/real-world-catapult-prototype-using-box2d/ http://www.emanueleferonato.com/2010/04/07/real-world-catapult-prototype-using-box2d/#comments Wed, 07 Apr 2010 20:44:46 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2680 This is an early attempt to simulate a real world catapult using Box2D.

Raw and uncommented code, but a lot of useful information about compound objects, revolute joints and motors.

This is what you’ll get:

Click with the mouse to shoot the ball.

And this is the source code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import Box2D.Dynamics.*;
	import Box2D.Collision.*;
	import Box2D.Collision.Shapes.*;
	import Box2D.Common.Math.*;
	import Box2D.Dynamics.Joints.*;
	public class main extends Sprite {
		public var world:b2World=new b2World(new b2Vec2(0,10.0),true);
		public var world_scale:int=30;
		var arm_joint:b2RevoluteJointDef = new b2RevoluteJointDef();
		var the_joint_itself:b2RevoluteJoint;
		public function main():void {
			debug_draw();
			draw_box(250,400,500,30,false,"ground");
			var catapult_body:b2BodyDef = new b2BodyDef();
			catapult_body.position.Set(350/world_scale,200/world_scale);
			catapult_body.type=b2Body.b2_dynamicBody;
			var main_part:b2PolygonShape = new b2PolygonShape();
			main_part.SetAsOrientedBox(125/world_scale, 20/world_scale, new b2Vec2(0,0),0);
			var fixed_arm:b2PolygonShape = new b2PolygonShape();
			fixed_arm.SetAsOrientedBox(20/world_scale, 60/world_scale, new b2Vec2(-80/world_scale,-40/world_scale),0);
			var catapult_itself:b2Body=world.CreateBody(catapult_body);
			catapult_itself.CreateFixture2(main_part,200);
			catapult_itself.CreateFixture2(fixed_arm,200);
			var catapult_arm:b2BodyDef = new b2BodyDef();
			catapult_arm.allowSleep = false;
			catapult_arm.position.Set(210/world_scale,110/world_scale);
			catapult_arm.type=b2Body.b2_dynamicBody;
			var arm_part:b2PolygonShape = new b2PolygonShape();
			arm_part.SetAsOrientedBox(150/world_scale, 10/world_scale, new b2Vec2(0,0),0);
			var stopper:b2PolygonShape = new b2PolygonShape();
			stopper.SetAsOrientedBox(10/world_scale, 20/world_scale, new b2Vec2(-140/world_scale,-30/world_scale),0);
			var catapult_arm_itself:b2Body=world.CreateBody(catapult_arm);
			catapult_arm_itself.CreateFixture2(arm_part,1);
			catapult_arm_itself.CreateFixture2(stopper,1);
			arm_joint.enableMotor = true;
			arm_joint.enableLimit = true;
			arm_joint.Initialize(catapult_itself, catapult_arm_itself,new b2Vec2(0,0));
			arm_joint.localAnchorA=new b2Vec2(-80/world_scale,-90/world_scale);
			arm_joint.localAnchorB=new b2Vec2(60/world_scale,0);
			the_joint_itself=world.CreateJoint(arm_joint) as b2RevoluteJoint;
			the_joint_itself.SetMotorSpeed(1000);
			the_joint_itself.SetLimits(-Math.PI,Math.PI/3);
			the_joint_itself.SetMaxMotorTorque(1) 
			var cannonball:b2BodyDef= new b2BodyDef();
			cannonball.position.Set(90/world_scale, 90/world_scale);
			cannonball.type=b2Body.b2_dynamicBody;
			var ball:b2CircleShape=new b2CircleShape(10/world_scale);
			var the_cannonball_itself:b2Body=world.CreateBody(cannonball);
			the_cannonball_itself.CreateFixture2(ball,20);
			addEventListener(Event.ENTER_FRAME, update);
			stage.addEventListener(MouseEvent.CLICK,fire);
		}
		public function fire(e:MouseEvent):void {
			the_joint_itself.SetMaxMotorTorque(10000)
		}
		public function draw_box(px,py,w,h,d,ud):void {
			var ground:b2BodyDef= new b2BodyDef();
			ground.position.Set(px/world_scale, py/world_scale);
			if (d) {
				ground.type=b2Body.b2_dynamicBody;
			}
			var my_box:b2PolygonShape = new b2PolygonShape();
			my_box.SetAsBox(w/2/world_scale, h/2/world_scale);
			var my_fixture:b2FixtureDef = new b2FixtureDef();
			my_fixture.shape=my_box;
			var the_ground_itself:b2Body=world.CreateBody(ground);
			the_ground_itself.SetUserData(ud);
			the_ground_itself.CreateFixture(my_fixture);
		}
		public function debug_draw():void {
			var debug_draw:b2DebugDraw = new b2DebugDraw();
			var debug_sprite:Sprite = new Sprite();
			addChild(debug_sprite);
			debug_draw.SetSprite(debug_sprite);
			debug_draw.SetDrawScale(world_scale);
			debug_draw.SetFlags(b2DebugDraw.e_shapeBit|b2DebugDraw.e_jointBit);
			debug_draw.SetFillAlpha(0.5);
			world.SetDebugDraw(debug_draw);
		}
		public function update(e:Event):void {
			world.Step(1/30,10,10);
			world.ClearForces();
			world.DrawDebugData();
		}
	}
}

Download the source code.

]]> http://www.emanueleferonato.com/2010/04/07/real-world-catapult-prototype-using-box2d/feed/ 8 Case study: The Big Adventure – a Box2D RPG http://www.emanueleferonato.com/2010/04/01/case-study-the-big-adventure-a-box2d-rpg/ http://www.emanueleferonato.com/2010/04/01/case-study-the-big-adventure-a-box2d-rpg/#comments Wed, 31 Mar 2010 22:20:49 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2644 Ok, it’s not an april fool… the bulgarian freelancer Krasimir Tsonev really made a Box2D based RPG game called The Big Adventure.

And he also built the official game site with all features it needs to attract players: a community, a forum, a ladder, updated news… really a good job.

Now he wants to share with us his experience:

« Actually I wanted to create a RPG game since a long time ago.

I made a little research about what engine to use and now the game is based on Box2D. Your articles helped me a lot in the beginning. Now the game has more than 1200 registered users.

Here it is a short information about the game:

I spent the last two months working on it: the main idea was to use the Box2D engine to create a jump n’run game. But I also wanted to make an RPG so I decided to create towns between the levels.

So to travel between the towns you have to play the jump n’run game i.e. the Box2D game.

First I created the wrapper of the Box2D engine. You know it’s a little bit complicated to just start with it. Then created some of the major graphics like those of the heroes, some enemies, collisions among them etc.

One of the coolest features of RPG games is the inventory and the ability to wear something. I really love games like Diablo so I was inspired from them. I made possible to wear weapon, helmet, amulet, armour, gloves, belt, shoes and ring.

It was a little bit difficult to create the inventory actions. Like moving items there and placing them in the specific places. Of course some major things like checking if there is enough space in the inventory, if you are able to place some item in the specific place was also developed.

Invested some time in real time changing of the hero’s graphic. I.e. if you change your weapon the its graphic is also changed. The player also has some characteristics like strength, dexterity, luck, life, damage, defence.

The items that you are wearing give additional points of course. That wasn’t enough for me and I made a quest system. The quests can be taken from the taverns in the towns. You can speak with different people that of course have some problems to solve :)

After solving a quest you can get more gold, a new item or experience points. It was easy to create a shop for buying and selling items also. All the items and characteristics of the hero are auto saved every 7 seconds, which means that you can play again tomorrow and nothing of your progresses will be lost.

When I released the game more ideas just popped up in my mind. For example potions that can transform your hero in a mouse, rabbit or bear. The mouse potion is used to be able to go through really tiny places, the rabbit one to jump over a big hole and the bear potion to double your damage points.

Some of the ideas came from people that are playing the game. When I started the forum on the site some of them just suggested things that they would like. For example the marketplace. It’s a specific place in some of the towns where you can offer items to the other players for a price that you want. Then they can buy your items ;)

Some technical information:

- I used flex (AS3) and FlashDevelop to write the code
- Flash for the graphics
- LAMP as a backend solution
- Tons of AS3 libraries that I wrote during the last few years also take a part in the project
- the MochiAds, Kongregate, GamesChart and Facebook apis are also integrated »

I wish Krasimir the best luck with his project and obviously he is invited to update us in a couple of months with some fresh news about the community, the monetization and new projects.

]]> http://www.emanueleferonato.com/2010/04/01/case-study-the-big-adventure-a-box2d-rpg/feed/ 6 Creation of a game with Citrus Engine http://www.emanueleferonato.com/2010/03/23/creation-of-a-game-with-citrus-engine/ http://www.emanueleferonato.com/2010/03/23/creation-of-a-game-with-citrus-engine/#comments Tue, 23 Mar 2010 09:50:00 +0000 Emanuele Feronato http://www.emanueleferonato.com/?p=2593 As said, we’re going to create a little game with Citrus Engine.

Since the engine it’s ready, we can start with level design.

So let’s open the Citrus Engine Level Architect, included in the package, and let’s start playing with it.

The key of this little tool is the right mouse key. Pressing it will open a menu with all available assets.

Choose Platform and you will be able to create static Box2D boxes.

Now click anywhere with left mouse button and a black square will appear: that’s the platform. Drag and adjust it as you want.

Don’t worry about extreme precision: we’ll retouch it later. Once you placed some platforms, from the right click menu choose and place the hero, a coin and a couple of crates. Crates represent dynamic Box2D objects. This is what I’ve made:

Then select File->Save Level As and save your level. Don’t worry about the path: despite what suggesting in the official docs we won’t include external XML files. We are making a game to distribute it, so we need a single file.

Edit the created XML file removing this line

<?xml version="1.0" encoding="UTF-8"?>

and eventually rounding the x, y, width and height attributes of your assets.

This is my final XML:

<?xml version="1.0" encoding="UTF-8"?><world gameWidth="500" gameHeight="400">
	<Platform offsetX="0" source="" x="250" id="Platform1" width="500" y="385" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="30" mass="0" artType="" parallax="-1"/>
	<Platform offsetX="0" source="" x="485" id="Platform2" width="30" y="200" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="340" mass="0" artType="" parallax="-1"/>
	<Platform offsetX="0" source="" x="15" id="Platform3" width="30" y="200" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="340" mass="0" artType="" parallax="-1"/>
	<Platform offsetX="0" source="" x="250" id="Platform4" width="500" y="15" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="30" mass="0" artType="" parallax="-1"/>
	<Hero hurtMagnitudeX="150" maxHealth="10000000000" friction="0.6" acceleration="30" parallax="-1" jumpHeight="360" maxSpeedY="500" killBounceHeight="40" hurtMagnitudeY="350" boost="12" width="33" offsetX="0" source="" height="60" maxSpeedX="180" id="Hero1" rotation="0" dampY="1" boostDuration="26" y="350" restitution="0" movable="true" x="425" offsetY="0" hurtInvincibility="5000" mass="1.32" artType="" dampX="0.97"/>
	<Crate offsetX="0" source="" x="275" id="Crate1" width="100" y="325" restitution="0" movable="true" friction="0.6" offsetY="0" rotation="0" height="100" mass="1" artType="" parallax="-1"/>
	<Crate offsetX="0" source="" x="275" id="Crate2" width="100" y="225" restitution="0" movable="true" friction="0.6" offsetY="0" rotation="0" height="100" mass="1" artType="" parallax="-1"/>
	<Coin offsetX="0" source="" destroyDelay="500" parallax="-1" id="Coin1" width="15" mass="0" y="101" restitution="0" artType="" movable="false" rotation="0" height="15" friction="0.6" x="274" offsetY="0"/>
</world>

Then drop a few AS3 lines:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

package {
	import flash.display.MovieClip;
	import com.citrusengine.core.CitrusEngine;
	import com.blueflamedev.math.*;
	public class citrusdemo extends MovieClip {
		public function citrusdemo() {
			var level_xml:XML =
			<world gameWidth="500" gameHeight="400">
			  <Platform offsetX="0" source="" x="250" id="Platform1" width="500" y="385" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="30" mass="0" artType="" parallax="-1"/>
			  <Platform offsetX="0" source="" x="485" id="Platform2" width="30" y="200" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="340" mass="0" artType="" parallax="-1"/>
			  <Platform offsetX="0" source="" x="15" id="Platform3" width="30" y="200" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="340" mass="0" artType="" parallax="-1"/>
			  <Platform offsetX="0" source="" x="250" id="Platform4" width="500" y="15" restitution="0" movable="false" friction="0.6" offsetY="0" rotation="0" height="30" mass="0" artType="" parallax="-1"/>
			  <Hero hurtMagnitudeX="150" maxHealth="10000000000" friction="0.6" acceleration="30" parallax="-1" jumpHeight="360" maxSpeedY="500" killBounceHeight="40" hurtMagnitudeY="350" boost="12" width="33" offsetX="0" source="" height="60" maxSpeedX="180" id="Hero1" rotation="0" dampY="1" boostDuration="26" y="350" restitution="0" movable="true" x="425" offsetY="0" hurtInvincibility="5000" mass="1.32" artType="" dampX="0.97"/>
			  <Crate offsetX="0" source="" x="275" id="Crate1" width="100" y="325" restitution="0" movable="true" friction="0.6" offsetY="0" rotation="0" height="100" mass="1" artType="" parallax="-1"/>
			  <Crate offsetX="0" source="" x="275" id="Crate2" width="100" y="225" restitution="0" movable="true" friction="0.6" offsetY="0" rotation="0" height="100" mass="1" artType="" parallax="-1"/>
			  <Coin offsetX="0" source="" destroyDelay="500" parallax="-1" id="Coin1" width="15" mass="0" y="101" restitution="0" artType="" movable="false" rotation="0" height="15" friction="0.6" x="274" offsetY="0"/>
			</world>;
			var ce:CitrusEngine=CitrusEngine.getInstance();
			ce.initialize(this);
			ce.camera.debugDraw=true;
			ce.physics.gravity=new MathVector(0,900);
			ce.loop.run(this);
			ce.manager.createSet("Level 1",XML(level_xml));
		}
	}
}

Lines 7-17: Importing the XML

Lines 18-19: Initializing the engine

Line 20: Turning on debug draw

Line 21: Defining the gravity. I found MathVector(0,900) very similar to b2Vec(0,10)

Line 22: Starting the simulation

Line 23: Loading the XML level

And that’s it:

Move your hero with arrow keys and jump with spacebar. Try to get the coin.

Download the source code.

]]> http://www.emanueleferonato.com/2010/03/23/creation-of-a-game-with-citrus-engine/feed/ 7