Beginning Programming in Box2DFlash 2.1a in AS3

A new version of Box2DFlash has been out for a while now, with some pretty major changes that mean your old projects won’t compile without a mass of errors. This tutorial aims to create a similar demo to my previous Box2DFlash tutorial, which was a beginners step into Box2DFlash 2.0.2.

The biggest difference you will notice to begin with is the introduction of a new variable type that sits between the shape and body: the fixtureDef. This variable now holds the material properties such as friction, density and restitution that were previously in the shape definition variable.

Setting up your project to include the Box2D classes is the same process as in the last tutorial, although with the new source files, so I will gloss over that and assume you have set it all up yourself and are ready to code in your main document class.

The demo I have created will simply create a world and a ground body to begin with. Boxes will be added every few ticks until a maximum number of bodies in the world has been reached. Debug draw will be used in order to get quicker visual results rather than having to draw all sprites myself.

By the end of this tutorial, you should have something similar to this:

So without further ado, lets get started. Open up your chosen flash programming tool (I favour the features of FlashDevelop personally, and still compile into Adobe Flash CS4 to get the best of both worlds, but you are free to just use FlashDevelop with Flex or the Adobe Flash IDE if you wish)

Create a new AS3 project, and add a document class which will contain all of your code. Make sure to add the Box2DFlash source as a classpath in order to utilise the variable types before you begin.

Our demo is going to be split up into a few simple steps:

  1. Create the world function
  2. Create the ground function
  3. Create the box adding function
  4. Set up debug draw
  5. Add an updating event listener

Before we start the world setup function, we are going to declare some global variables and constants that we will use throughout the functions:

?View Code ACTIONSCRIPT
1
2
3
4
5
private var world:b2World; //our world object
private var debugSprite:Sprite; //our sprite that will hold all of the debug draw data
private var debugDraw:b2DebugDraw; //the actual debugDraw object
public static const PTM:Number = 30; //our pixels to metre ration that will be used throughout the demo
private var nextBlock:Number = 10; //the update rate for the block adding function we will create later

Now we are ready to create our world, in our setupWorld() function:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
private function setupWorld():void
{
	world = new b2World(new b2Vec2(0, 9.81), true);
	setupDebugDraw();
	world.SetDebugDraw(debugDraw);
}

All of this should be relatively recognisable if you followed the similar tutorial in the older version of box2d. The first line declares the new world object, and passes in its gravity vector, which is a b2Vec2 variable, and a boolean which controls whether none-moving objects will be put to sleep. You should set this to true for performance purposes.

Now seems like a good time to set up the debug draw function, as it is called in the setupWorld() function, so we will go ahead and do that now:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
private function setupDebugDraw():void
{
	debugSprite = new Sprite();
	stage.addChild(debugSprite);
	debugDraw = new b2DebugDraw();
	debugDraw.SetDrawScale(PTM);
	debugDraw.SetFillAlpha(0.4);
	debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
	debugDraw.SetLineThickness(1.0);
	debugDraw.SetSprite(debugSprite);
}

Here we are setting up the stage to show the debug data from Box2DFlash. For that we will need a sprite, debugSprite, and it will need to be added to the stage. Don’t forget this step, as without it your stage will look completely blank but with no errors, and you may wonder why the hell nothing is showing on the screen (speaking from personal experience)

Once the sprite is added to the stage we can set up our b2DebugDraw object: debugDraw.
Firstly, we set the scale at which it draws all objects (remember that Box2D reads all positional values as metres rather than pixels, so this set to the same pixels to metres ratio we set up as a constant in our document class)

Secondly, we set the transparency of the filled shapes. Remember 0.0 is completely transparent, 1 is completely opaque. I’ve gone for a relatively middle ground option, which is usually best.

Next we set what type of objects will actually be drawn. Here we want the shapes drawn, so we use the flag b2DebugDraw.e_shapeBit.

Afterwards we set the line thickness, which is pretty self explanatory, and then finally we attach our debug sprite to the debugDraw object. Then we’re done! Much quicker than drawing all our objects ourselves.

Our next step is to create our ground shape, which is done in our addGround() function:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
private function addGround():void
{
	var groundBodyDef:b2BodyDef;
	var groundBody:b2Body;
	var groundFixture:b2FixtureDef;
	var groundShape:b2PolygonShape;
 
	groundShape = new b2PolygonShape();
	groundShape.SetAsBox(stage.stageWidth / 2 / PTM, 15 / PTM);
 
	groundBodyDef = new b2BodyDef();
	groundBodyDef.position.Set(stage.stageWidth / 2 / PTM, 380 / PTM);
	groundBodyDef.type = b2Body.b2_staticBody;
 
	groundFixture = new b2FixtureDef()
	groundFixture.shape = groundShape;
	groundFixture.friction = 0.8;
	groundFixture.density = 1.0;
	groundFixture.restitution = 0.3;
 
	groundBody = world.CreateBody(groundBodyDef);
	groundBody.CreateFixture(groundFixture);
}

Here we need 4 variables to store all of our data we need. These are:

  1. Our body definition (b2BodyDef)
  2. Our body (b2Body)
  3. Our fixture definition (b2FixtureDef)
  4. Our shape (b2PolygonShape)

First of all we’ll tackle the shape. We use the SetAsBox method to tell Box2D that we are using a simple, 4 sided box. The properties of this method are half the width and half the height. Don’t forget to divide by your pixel to metres constant. Here the box is going to be the full length of the stage, so half the width is stage.stageWidth / 2 / PTM, and the height will be about 30 pixels, so the half height is 15 / PTM.

Now that the shape has been created, we can move on to our body definition. This is used to set the position and type of the body. The position is passed using position.Set(x, y) method of the b2BodyDef. Our ground will be in the middle of the screen, at the bottom, so our passed in values are (stage.stageWidth / 2 / PTM, 380 / PTM)

New in this version of Box2DFlash is the type method, which must be used to tell the world what type of body this is going to be. In this case, our body is a static body, as we never want it to move. Previously this was set using the density value, but this is no longer the case. Later on we will be making our boxes, which must move, hence they will be dynamic bodies.

After our body definition is complete, we can move on to our fixture definition. Here we are setting the material properties of the body: the friction, density and restitution. We are also linking the fixture definition and the shape object we created earlier.

Once that is done we can move onto the main object: the body. To create the body, we must call the world.CreateBody method, and pass in the body definition we set up earlier. We then link the body and the fixture definition using the CreateFixture method, and we’re done. Your world now has a fully functioning ground body.

Next I think we should tackle our update function, which will be called once every tick from the flash movie. The speed of which will be controlled by the fps setting in our movie, which I have set to 30.

In the class main function, underneath all other calls to the functions we have created, we create an event listener:

?View Code ACTIONSCRIPT
1
addEventListener(Event.ENTER_FRAME, Update);

Our Update() then looks like this:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
private function Update(e:Event):void 
{
	world.Step(1 / 30, 10, 10);
	world.ClearForces();
	world.DrawDebugData();
 
	if (nextBlock -- <= 0 && world.GetBodyCount() < maxBodies)
	{
		addBlock(Math.random() * stage.stageWidth, -10);
		nextBlock = 10;
	}
 
}

First, we set the updating time for the world. The first property is the time step, which should be 1/your fps, which is why mine is 1/30. The second property is the velocity iterations and then the position iterations third. Try to leave these at around 10 on normal projects as extreme values will cause your world to function strangely, though feel free to experiment!

Next we call the ClearForces() method of the world. This is new in Box2DFlash 2.1a, which must be called after each step now. We then tell the world to draw all of the debug data each step too. No b2DebugDraw object is passed into the method as we already handled that when we set up our world.

Next we have our if statement, which is used to add a new box every few ticks. It works by decrementing the nextBlock variable until it is less than or equal to zero, and also as long as the total number of bodies in the world is less than our maximum value we set in our constructor.

Inside the if statement, we call our addBlock() function we will create next and reset the counter back to its default value. In the call to addBlock() we pass in two variables: the x position and y position. The x position will be a random number between 0 and the stage width, and the y value will always be -10, just above the stage. Don’t worry about the pixel to metres ratio, as this will be calculated inside the function itself, which we will tackle now:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
private function addBlock(posX:Number, posY:Number):void
{
	var blockBodyDef:b2BodyDef = new b2BodyDef();
	blockBodyDef.position.Set(posX / PTM, posY / PTM);
	blockBodyDef.type = b2Body.b2_dynamicBody;
	blockBodyDef.angle = (Math.random() * 360) * Math.PI / 180;
 
	var blockShape:b2PolygonShape = new b2PolygonShape();
	blockShape.SetAsBox(20 / PTM, 20 / PTM);
 
	var blockFixture:b2FixtureDef = new b2FixtureDef();
	blockFixture.shape = blockShape;
	blockFixture.density = 1.0;
	blockFixture.friction = 0.4;
	blockFixture.restitution = 0.3;
 
	var blockBody:b2Body = world.CreateBody(blockBodyDef);
	blockBody.CreateFixture(blockFixture);
	trace("block added at " + posX + " " + posY);
}

I won’t bother explaining all of this function as its core is essentially the same as our addGround() function we tackled earlier. However, there are a couple of differences to note: firstly, the position is set using the posX and posY values that are passed into the function (don’t forget to divide by your ratio again!) and the angle of the body definition is randomly set from a number between 0 and 2pi (0 and 360 degrees – don’t forget, angles are calculated using radians instead of degrees)

The only other difference is that type, which instead of being static is now dynamic. This means the world object will apply world physics to this object, so it will move. Very important not to forget this one!

Now you’re done! Here is the complete code listing for reference:

?View Code 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
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
package  
{
	import Box2D.Collision.Shapes.b2PolygonShape;
	import Box2D.Common.Math.b2Vec2;
	import Box2D.Dynamics.b2Body;
	import Box2D.Dynamics.b2BodyDef;
	import Box2D.Dynamics.b2DebugDraw;
	import Box2D.Dynamics.b2FixtureDef;
	import Box2D.Dynamics.b2World;
	import flash.display.Sprite;
	import flash.events.Event;
	/**
	 * ...
	 * @author Matthew Hurst
	 */
	public class Main extends Sprite
	{
		private var world:b2World;
		private var debugSprite:Sprite;
		private var debugDraw:b2DebugDraw;
		public static const PTM:Number = 30;
		private var nextBlock:Number = 10;
		public static const maxBodies:Number = 50;
		public function Main() 
		{
			setupWorld();
			addGround();
			addEventListener(Event.ENTER_FRAME, Update);
		}
 
		private function addGround():void
		{
			var groundBodyDef:b2BodyDef;
			var groundBody:b2Body;
			var groundFixture:b2FixtureDef;
			var groundShape:b2PolygonShape;
 
			groundShape = new b2PolygonShape();
			groundShape.SetAsBox(stage.stageWidth / 2 / PTM, 15 / PTM);
 
			groundBodyDef = new b2BodyDef();
			groundBodyDef.position.Set(stage.stageWidth / 2 / PTM, 380 / PTM);
			groundBodyDef.type = b2Body.b2_staticBody;
 
			groundFixture = new b2FixtureDef()
			groundFixture.shape = groundShape;
			groundFixture.friction = 0.8;
			groundFixture.density = 1.0;
			groundFixture.restitution = 0.3;
 
			groundBody = world.CreateBody(groundBodyDef);
			groundBody.CreateFixture(groundFixture);
		}
 
		private function Update(e:Event):void 
		{
			world.Step(1 / 30, 10, 10);
			world.ClearForces();
			world.DrawDebugData();
 
			if (nextBlock -- <= 0 && world.GetBodyCount() < maxBodies)
			{
				addBlock(Math.random() * stage.stageWidth, -10);
				nextBlock = 10;
			}
 
		}
 
		private function addBlock(posX:Number, posY:Number):void
		{
			var blockBodyDef:b2BodyDef = new b2BodyDef();
			blockBodyDef.position.Set(posX / PTM, posY / PTM);
			blockBodyDef.type = b2Body.b2_dynamicBody;
			blockBodyDef.angle = (Math.random() * 360) * Math.PI / 180;
 
			var blockShape:b2PolygonShape = new b2PolygonShape();
			blockShape.SetAsBox(20 / PTM, 20 / PTM);
 
			var blockFixture:b2FixtureDef = new b2FixtureDef();
			blockFixture.shape = blockShape;
			blockFixture.density = 1.0;
			blockFixture.friction = 0.4;
			blockFixture.restitution = 0.3;
 
			var blockBody:b2Body = world.CreateBody(blockBodyDef);
			blockBody.CreateFixture(blockFixture);
		}
 
		private function setupWorld():void
		{
			world = new b2World(new b2Vec2(0, 9.81), true);
			setupDebugDraw();
			world.SetDebugDraw(debugDraw);
		}
 
		private function setupDebugDraw():void
		{
			debugSprite = new Sprite();
			stage.addChild(debugSprite);
			debugDraw = new b2DebugDraw();
			debugDraw.SetDrawScale(PTM);
			debugDraw.SetFillAlpha(0.4);
			debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
			debugDraw.SetLineThickness(1.0);
			debugDraw.SetSprite(debugSprite);
		}
 
	}
 
}

Your first steps into the new version of Box2DFlash should now be complete! Test your (and my) coding skills by compiling your flash document and your world should randomly place small boxes that are added every few ticks until there are a grand total of 50 bodies in the world.

Try changing a few things around to see what happens. Why not make all the boxes material properties random values, so some boxes will bounce high off the ground and others will drop like they’re made of lead. You could also adjust the size of the boxes in a similar fashion. Also, try testing your knowledge by adding two walls to the sides of the stage to create a giant container for our boxes, ensuring none will fall out and off the stage.

Filed under: Adobe Flash, Game Programming, Tutorials | Posted on April 16th, 2011 by Matthew | 2 Comments »

Rock Band and Guitar Hero: Get With The Times

With more sequels to both the Guitar Hero and Rock Band franchise that we can shake a rusty spoon at, its time to take a long, hard look at these games and see where they are lacking. Both franchises are prone to releasing sequels which don’t introduce enough new features in them, but Guitar Hero in particular seems to churn out new games more often than most. Music games are becoming more and more like the FIFA music game, with a new iteration having to be released every year for seemingly little reason. At least EA have an excuse with FIFA, as the teams change every year, but music games have no such excuse to lean back on.

Rock Band 3, Harmonix’s latest music game release, brought a few new features to the table that did justify a new sequel rather than DLC. A new instrument was introduced: the Keyboard. A mini keyboard that can be used in Keys, Pro Keys and even Guitar and Bass modes. A pro guitar feature was also added for people who are willing to fork out hundreds of pounds for a new instrument. This one having actual strings and more buttons than a particularly long duffel coat.

The problem with this new pro guitar instrument is that players of these games aren’t looking for complete realism. Remember how fun it was jamming away to Free Bird on Guitar Hero 2, despite that fact it was only a 5 button plastic guitar (which is incidentally released as the actual Lynyrd Skynyrd version on Rock Band 3) This proves that gamers are happy enough with the normal controllers. We are certainly not willing to put the number of hours in to learn a video game instrument that would be anywhere near the hours needed to learn the real instrument and play some of the easier songs (Intro to Smoke On The Water, anyone?)

I found myself purchasing Rock Band 3 when it came out, after having read the setlist and deemed it to have enough amazing songs I wanted to play that it was worth the £35 I spent. I also forked out for the Keyboard controller, which as far as I can tell seems to be by far the hardest instrument to learn properly on this game (on Pro Keys, anyway) Either that or I have just lost patience after trawling through the Rock Band and Rock Band 2 setlists to desperately become proficient at the guitar and drum controllers.

Getting back to the point of this article though: how these games should move forward. Rock Band in particular seems to have reached some form of critical mass with this release of their game. Surely they aren’t going to release any new instruments for the franchise now? (Though I remember saying that when the drums were introduced) This being the likely case, it seems important in this digital download age that Harmonix should ditch the idea of releasing a disk version of the game each time they purchase some more music licences and release the game only as DLC. Expansion pack type DLC is prominent enough on the marketplace at the moment that this sort of release would fit right at home. They could even make it cheaper by only introducing the new features in the normal download without any new songs, and the player was given a certain number of tickets to download whichever songs they wanted from the Rock Band store. This would mean we didn’t have to sit through godawful songs like Maps and Rehab (Why is this even in a game called ‘Rock Band’?) and were only given the songs we wanted. Obviously the idea with the on disk setlists for these games is to appeal to as wider audience as possible, but by doing that they add some truly terrible songs. Conversely, there will be someone out there whose favourite songs are songs such as Maps, Rehab and Rock Lobster, and they are physically repulsed by the likes of Bohemian Rhapsody, Free Bird and Break on Through (freaks)

Seriously Harmonix and Activision, take note: We are not saying you are bringing out bad games, but there will come a time when gamers unanimously say no to your new iterations if you continue to churn them out as full price disk releases. Enough of your audience are connected to the internet (be it Xbox Live or PSN) that it makes sense to release new versions are paid DLC. People would be much more willing to pay 800 or even 1200MSP than £35 for a game which has 5 or 6 decent songs on they’re interested in playing. Rock Band in particular has been ready for this type of feature since the release of Rock Band 2 and their ever growing collection of downloadable songs on the Rock Band Store. Just let us pick the handful of songs we like from there when we purchase the new game online. The alternative? £35 for Rock Band 4 with Cheryl Cole’s Fight For This Love as an on disk song. And no one wants that. The sheer embarrassment as you scrolled through all of your songs and found that would be too much to bear, and you would kill yourself through shame (even quicker if you were playing the vocals career and it appeared on a random setlist). There you go, Harmonix, you’ve just lost a customer that is physically unable to purchase more of your games.

(Also, as a footnote, please stop releasing games dedicated to one specific band. Only hardcore fans of said band will buy the game and many will be disappointed that their favourite song seems to have been left out from the game)

Filed under: Gaming | Posted on January 11th, 2011 by Matthew | 2 Comments »

Review: Call of Duty: Black Ops (Multi)

cod-black-ops_x360-fob

Well, its that time of the video game calender again. This time, its the turn of Treyarch to create a convincing first person shooter with an addictive multiplayer component. Immediately this game had been marked down in gamer’s estimations because it was an odd numbered sequel to the Call of Duty franchise, made by Treyarch rather than the geniuses at Infinity Ward and therefore not worthy of our attention. I even admit that this was my view for a time. When purchasing another game I was asked if I wanted to preorder the new Call of Duty, and immediately turned it down for the very reasons explained above. The manager at the shop gave a disappointed but ultimately non-surprised look and explained that many people have said the same.

However, after playing through Black Ops, I have completely changed my mind. This game is definitely no World at War. Treyarch have genuinely managed to pack some original concepts to the franchise in this game, rather than just tacking on some new guns and maps and selling us a full price expansion pack. Black Ops is without a doubt the best Treyarch Call of Duty title, and is up there with both Modern Warfare games.

The story takes an interesting direction in this game. You play mainly as Alex Mason, an American member of the CIA, who has been captured and interrogated by an unknown authority. This is such an integral feature, the main menu of the game is Alex’s view while sitting in the chair, with the options for games on a TV in the centre of his gaze. The single player missions play out through a series of retrospective looks at Mason’s past missions on the field while the interrogators try desperately to discover the information they so desperately seem to need. I’m purposefully trying to not give too much away, as the story is genuinely good. The desperation of the interrogator at the introduction of missions is immediately apparent, and you find yourself playing through not just for achievements, but because you actually want answers to the questions they’re asking.

However, after a few missions more questions seem to pop up, supposedly without answers. This is intended to be the case, but the campaign veers just close enough to cliché that you manage to get a pretty good idea of the ending before the game wants you to, which is slightly disappointing.

Graphically, nothing much has changed since Modern Warfare 2. You won’t notice a significant upgrade to the main game play, but I did think Treyarch managed to do a pretty good job at lip syncing in the FMVs of the game, which does add a lot to the ultimate realism that the story is trying to convey. Sound wise the game is pretty solid, too. You won’t hear any complaints from the quality of the weapon sounds, or explosions. I also found ally dialogue in games to be less repetitive than other iterations which is a plus. Unfortunately the Rolling Stone’s Gimme Shelter, whilst appearing in the advert for the game, doesn’t appear in the final version which is a slight shame.

Gameplay wise this game is merely a Call of Duty game. If you’ve played any of the other recent iterations of the franchise you will feel at home here. That’s not to say Treyarch haven’t tried to implement their own unique features, though. A new feature makes an appearance whereby you sprint along, hold the crouch button and your character does an action-y dive to the floor. While I didn’t find this particularly useful to get out of firefights in my veteran playthrough, certain styles of play may find some use in it, and it is refreshing to see Treyarch wanting to cram new features into the game.

While on the subject of Veteran, the hardest difficulty of the Call of Duty games, I found this game to be less challenging on the whole on the single player campaign on maximum difficulty. Enemies seemed to be less prone to throw masses of grenades at the player, which was nice, but I very rarely found myself at points in the game where I was repeatedly trying to get past a certain point but kept getting killed. There is also no ‘Mile High Club’-esque epilogue mission here that will frustrate you to death and make you want to add your controller as a permanent feature of your television. That’s not to say the game is without its challenges. You can still get surprised by an enemy you thought your team mate had killed (more likely a problem with ally AI than a difficulty feature) as he ploughs his shotgun into your back and you lie on the floor confused as to how he could have been left there. As far as difficulty goes, your allies will do very little to help you in terms of their ability to kill enemies for you. They, however, have their uses. When facing a group of enemies with an ally or two and you’re pinned down, as you slowly whittle your way through the enemy, your team mates will advance only when it is safe. This is helpful as it gives you a good idea for when you can move forward without being flanked by an enemy, providing your ally hasn’t accidentally forgotten an enemy hidden in a corner.

Zombie game modes make a welcome return in this iteration. The zombie sections seem to be Treyarch’s biggest feature to the franchise, and have improved quite a bit from World at War. The zombie game mode can be played both single player and cooperatively with a friend, either through split screen or online. The idea is essentially a survival game, whereby you must kill zombies to earn money which you spend on opening doors to other places in the map, purchasing better weaponry or repairing barricades. You can also purchase a handful of unique powerups which can make your fight against the zombie horde easier. Examples of this include Quick Revive, which allows you to return to the fight quicker when a zombie attacks you, Pack-a-Punch, which upgrades your weapons, and Speed Cola, which grants you the ability to reload much faster (essentially a sleight of hand-esque perk.)

A new zombie mode exists in this game, known as Dead Ops Arcade. If you have ever played games such as Smash TV years ago on the Sega Mega Drive, you’ll be right at home here. The game shifts to a top down view as you open fire on hordes of zombies in each level to try and make it to the new round. It is a fun distraction from the normal campaign if you feel bored of it or the normal muliplayer component, but otherwise it isn’t something that you will spend hours playing.

As for multiplayer, which is the main component of the game for many, Treyarch seem to have delivered pretty well here. Normal matches are essentially the same as they always were, with both normal and hardcore variants. Treyarch have done some tweaking though. Gone are perks such as Stopping Power, which affects the overall damage of weapons significantly. No longer will sniper rifles always kill in one shot unless you score a headshot. As someone who mainly focused as a sniper on other games, I am slightly disappointed by this, but over time this will become second nature to players who are aiming to achieve all 15 levels of prestige. Also on the subject of sniper rifles, Treyarch have eliminated the ability to quickscope players by removing the ADS bonus to sleight of hand. Shotguns and SMGs are no longer classed as secondary weapons in this game, which means the player is stuck either with a pistol, a launcher or a special weapon such as ballistic knives or the crossbow.

Killstreaks have also had to have a tweak, owing to the fact that Black Ops isn’t a modern warfare game. Gone are streaks such as Harriers, EMPs, AC-130s and Nukes. They are replaced with somewhat strange streaks such as the RC-XD, a remote control explosive car, remote control missiles, attack dogs and napalm strikes. Streaks have also been adjusted now so that the maximum streak needed is 11, and kills gained from killstreaks do not count towards your killstreak rewards.

New game modes have also appeared in this iteration. For players without an Online connection who feel like they’re missing out, there is the Combat Theater. This is essentially a multiplayer game with bots, which is fun in its own right, but ultimately not as fulfilling for players who are used to stabbing people online. Levelling in Combat Theater has been made completely independent from the normal online modes, which means players can’t level up just by killing bots before moving onto the proper multiplayer game when they have reached a high level.

By far the biggest addition to the multiplayer aspect of this game is a feature called COD Points. Think of these as pounds (or dollars) collected from performing well in multiplayer games. You earn 10% of your match XP in COD Points. These points are spent on unlocking new items in the game for your custom classes. These can range from new guns, new attachments and new perks, to new features such as more layers to design your emblem (think Halo 3 and you’ve hit the nail on the head) and camo. You must also purchase both the normal and pro sets of perks (once you complete the challenges for them). If you feel like you’re not earning enough COD Points through normal play, you can enter into Wager Matches, where you bet amounts of COD Points in specific multiplayer modes and compete to win. The top three players at the end of their game receive a net win on their wager, which gives everyone the ability to make a win in these games. There are four different game modes in wager matches, and all are unique and fun in their own right. These are:

  • One in The Chamber – Each player has a pistol with one bullet and their knife. Points are awarded for kills and each kill earns the player a bullet if they’ve ran out. Instant kills are also activated with this mode, which makes your one bullet lethal. A very fun game mode, but watch out for campers near the end of matches
  • Sharpshooter - Players are given random weapons to kill each other with. These guns change around every 45 seconds, which keeps the game fresh. Perks are earned for killstreaks and eventually turn into score multipliers, which can net you a win even if you have less kills than another player
  • Gun Game – Players all start out with the same weapon. Every time you kill an enemy, you replace your weapon with a better one. The first person to get a kill with each weapon (of which there are 20) is the winner. Knife kills demote the victim to their previous weapon.
  • Sticks and Stones – Players are armed with an explosive crossbow, ballistic knives and a trusty tomahawk. Different amounts of points are earned depending on the weapon used to kill the enemy (Crossbow kills net 100 points, which normal knife stabs only earn you 25). Tomahawk kills reset the victims score to zero. Careful not to become a victim of this with only 30 seconds to spare, as you will be completely out of the money by then. This can lead to very frustrating matches.

Contracts can also be taken out in the multiplayer mode. These are challenges such as “I will get 5 headshots with a sniper rifle” for example. The difficulty judges how many COD points you spend on the contract and how many you earn if you achieve it, though you only have a certain time limit to do so. The types of contract that can be taken are changed every day, which really mixes things up. Though these can be a fun little goal for yourself to achieve, they aren’t an effective way of earning large amounts of XP and COD Points unless you take the hardest contracts.

All in all I have to say Call of Duty: Black Ops has come as a surprise for me. After writing the game off before it had even reached the shelves (as many others have also) I cannot believe how wrong I was. Treyarch have managed to add their own original ideas to the franchise with this iteration, which makes this game feel a lot more than an expansion pack (which is what World at War felt to Modern Warfare) which can only be a good thing. Not only that, but Treyarch have worked to try and correct the imbalance from certain aspects of the multiplayer (stopping power and quick scoping are two examples) which is a major bonus. However, because of the retrospective nature of this game, the assault rifles in particular feel very inaccurate. Whether this is more down to historical accuracy or bad coding is up to you to decide.

Pros:

+An involving storyline makes you care about the characters and want to play it through to the end
+Zombie modes make a welcome return
+Some imbalance has been corrected in the multiplayer

Cons:

-Storyline becomes clichéd enough that you can guess the twist
-Ally AI could have been better
-Assault rifles seem too inaccurate in multiplayer modes at times

Filed under: Game Reviews | Posted on January 10th, 2011 by Matthew | No Comments »

Beginning Programming in Box2D 2.0.2 in AS3

This tutorial assumes that you already have Box2DFlash set up in your chosen IDE. If not, please refer to my previous post, How to set up Box2DFlash

This tutorial aims to give a brief beginners lesson on how to code using the Box2D syntax using a simple experiment. I will assume that you have a basic understanding how AS3 works without Box2D. If you get confused, the full code listing will be at the end of the post.

By the end of the tutorial, this is what we will have made:

For reference, the full code of the document class is at the end of this post. If you encounter any errors in your code or don’t understand a part of the tutorial, have a look at the full code at the end. But please, don’t just copy and paste the full code without reading the tutorial. Doing so will create the simulation as above, but you will not understand how it is created, and that is the important part of the tutorial.

To begin, open up Flash and create an Actionscript 3 file. You will also need a document class, in my case called main.as

First of all, lets create a list of all the things we will need to do to achieve our goal:

1 – Create the world

2 – Create the floors and wall

3 – Make our bodies visible using DebugDraw

4 – Create our addBox function to add crates every so often

Before we can tackle step 1, we need to import our box2d and flash classes that are necessary to code this file. These are:

- Box2D.Collision.*

- Box2D.Common.Math.*

- Box2D.Dynamics.*

- flash.display.Sprite, or flash.display.MovieClip, depending on what your document class extends

- flash.events.Event

To create our world, add a function called createWorld to the constructor of our class

The world object will be used outside of the function in other parts of the code, so create the variable globally, just inside of the class using the code

?View Code ACTIONSCRIPT
1
Private var world:b2World;

Then we must create the function to set up our world. In this, we need variables to hold the boundary of the world object, which is of type b2AABB (Think of a b2AABB as a rectangle) and the gravity, which is a b2Vec2, a 2 dimensional vector.

This is the code to create the world:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
private function createWorld():void
{
	var worldBoundary:b2AABB = new b2AABB();
	worldBoundary.lowerBound.Set( -3000 / ratio, -3000 / ratio);
	worldBoundary.upperBound.Set(3000 / ratio, 3000 / ratio);
 
	var gravity:b2Vec2 = new b2Vec2(0, 9.81);
 
	world = new b2World(worldBoundary, gravity, true);
}

Notice how the upper and lower bounds are set much higher than the stage’s width and height properties. This is because we may want to continue to simulate bodies when they are outside of the stage area, as they may come back. Objects that reach outside of the upper or lower bounds are not simulated, which is a form of garbage collection in Box2D to save memory.

Also worth noting at this point is the variable ‘ratio’ which I have used. Box2D does not rely on pixels for its positions of objects. Box2D uses all positions, vectors, forces etc in their standard units. Distances, positions etc are measures in metres rather than pixels, and forces are measured in Newtons, or kilogram metres per second squared.

Box2D is also built to only simulate effectively objects that are between around 1 and 10 metres in size. The ratio variable, which is in fact a constant, is used to convert pixels to metres. Most people go for a ratio of around 30-40 pixels per metre, so make your ratio constant something along those lines. This means that you do not have to convert all your measurements into metres yourself, you can give them in pixels and divide by your ratio to get them in metres. In the create world example, this means the bounds are set at -3000, -3000 and 3000, 3000 pixels, and are appropriately converted to metres for the box2D world.

Notice that the variable used to store the gravity is a two dimensional vector. This means that you can have gravity in any direction. In my example I am using the gravitational constant on Earth, 9.81. As an idea of quickly creating new experiments, you can make the y parameter of the vector negative, which will cause the objects to float upwards. You can also have gravity coming in from the horizontal direction by changing the first parameter of the gravity variable, or diagonal gravity using both the x and y values. Feel free to have a play around and change the values of variables here and anywhere in this tutorial, so you can improve your understanding of how the variables affect the world.

The final property when creating the world is a boolean, which tells the world whether you want to save memory by not simulating sleeping objects (objects that are not moving/have no force acting on them). Setting this to true should improve performance when handling lots of bodies in the world at the same time.

Now that we have created our world, it is time to create some bodies. First we will create the floor, so make a function call under your createWorld function called addFloor().

When creating a body there are three variables that are needed. A shape definition, which defines the size and shape of the body, as well as its material properties such as density and friction, a body definition sets the body’s angle (in radians) and position (in metres) in the world, and a body which creates the body in the world from the body definition and the shape definition, and sets the mass of the object.

Here is the code to create the floor in the world object:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
private function addFloor():void
{
	var floorShapeDef:b2PolygonDef = new b2PolygonDef();
	floorShapeDef.density = 0.0;
	floorShapeDef.friction = 0.5;
	floorShapeDef.restitution = 0.3;
	floorShapeDef.SetAsBox((stage.stageWidth - 100) / 2 / ratio, 20 / ratio);
 
	var floorBodyDef:b2BodyDef = new b2BodyDef();
	floorBodyDef.position.Set(stage.stageWidth / 2 / ratio, 350 / ratio);
 
	var floorBody:b2Body = world.CreateBody(floorBodyDef);
	floorBody.CreateShape(floorShapeDef);
	floorBody.SetMassFromShapes();
}

The density of the object is its mass per unit volume. In this case the density is set to 0.0 as the object will be static, it will not move.

The friction of the shape sets the force at which the objects slow down as they move across it. A value closer to 0 will simulate conditions similar to ice, and a value near 1.0 will simulate a much rougher material.

The restitution of the shape measures how much energy a body loses (if any) when they collide. A value of 1.0 will be a perfectly elastic collision, where the object will bounce as high as it was originally. A value closer to 0 will make an inelastic collision, which is more realistic, whereby objects lose part of their energy when colliding.

If the measurements for the size of the box are confusing, take a look at the movie at the top of the post again to get an idea of the position the floor is set to. Note that the parameters of the SetAsBox function are hx, and hy. Or the boxes half width and half height. Again these are divided by the ratio constant to convert them into a sensible unit in metres. The position is set in a similar way, also in metres. Note how the line of code looks completely unlike normal Actionscript as you are using .position.Set(x, y). This is because Box2D was originally designed for use in C++, and ported over to Actionscript with Box2DFlash, so some of the code syntax may look confusing.

The final line of code in the function, SetMassFromShapes(), is a function that does exactly what it says. You can set the mass yourself using SetMass() but it is far easier to get Box2D to do it itself using the size of the shape you created as a reference. Sometimes though you may want two objects that are the same size, but completely different masses. For example, if you are using a rubber ball and a lead ball, their masses will need to reflect their material.

Now we will create the left and right walls. Again add a call to a function called addWalls() underneath the other functions you have called in the constructor. Much of the code is the same as the floor function’s code, so I won’t explain in as much detail. Here is the code for the addWalls() function:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
private function addWalls():void
{
	var wallShapeDef:b2PolygonDef = new b2PolygonDef();
	wallShapeDef.friction = 0.5;
	wallShapeDef.density = 0.0;
	wallShapeDef.restitution = 0.3;
	wallShapeDef.SetAsBox(25 / ratio, 40 / ratio);
 
	var wallBodyDef:b2BodyDef = new b2BodyDef();
	wallBodyDef.position.Set(80 / ratio, 300 / ratio);
 
	var leftWall:b2Body = world.CreateBody(wallBodyDef);
	leftWall.CreateShape(wallShapeDef);
	leftWall.SetMassFromShapes();
 
	wallBodyDef.position.Set(470 / ratio, 300 / ratio);
	var rightWall:b2Body = world.CreateBody(wallBodyDef);
	rightWall.CreateShape(wallShapeDef);
	rightWall.SetMassFromShapes();
}

Notice here that we are creating two bodies using the same shape definition. The left wall body is created first, then the body definition’s position is altered to reflect the position of the right wall, and the right wall body is created using the new position. You could also have created two separate b2BodyDef variables to hold this data but I thought it was unnecessary as you can just do it using one variable by changing its position, thereby saving a little bit of memory. Though in a small simulation such as this, it may make little to no difference in performance, in a full game code optimisation such as this may make your game run that little bit faster.

Now that you have created your walls and floor, go ahead and try and run your file now using Ctrl+Enter. If all goes well and there are no errors, you will be faced with what looks like a completely empty world. Don’t worry, though. You just need to set up the world to draw the bodies in debug mode, which is a way of simulating the Box2D world without having to design your own movieclips and sprites.

To do this I have created a function called setupDebugDraw() and called it underneath the other functions we have made. The setupDebugDraw function looks like this:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
private function setupDebugDraw():void
{
	var debugSprite:Sprite = new Sprite();
 
	var debugDraw:b2DebugDraw = new b2DebugDraw();
	debugDraw.m_sprite = debugSprite;
	debugDraw.m_fillAlpha = 0.6;
	debugDraw.m_drawScale = ratio;
			debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
	debugDraw.m_lineThickness = 2;
	addChild(debugSprite);
	world.SetDebugDraw(debugDraw);
}

First of all we must create a sprite that will hold all of the world’s data in it, as well as a b2DebugDraw object to hold the parameters of the debug draw. Line 6 in the function, m_sprite sets the sprite object that the world will be drawn on for the debug draw

m_fillAlpha is the transparency of the fill colour of the bodies you will draw. It is a good idea to set this to be semi-transparent so you can see where objects are even when they intersect

m_drawScale is the scale in pixels to metres that the world will be drawn. This is the same as the ratio you have just used

SetFlags tells the debug object what to draw. This line makes sure that it is the shapes that are drawn

m_lineThickness sets the thickness of the outline of the objects. You can set this to whatever you feel is necessary

One thing to make sure of is that you actually add the sprite you created to the stage using addChild(). Many a time I have wondered why my world hasn’t drawn, only to realise I forgot this important line. The last line sets up the debug draw settings in your world object.

Now we must set our world to update as objects move. To do this, add an event listener to the constructor for the Event.ENTER_FRAME event, and call the function Update.

For now you only need one line of code in this function:

?View Code ACTIONSCRIPT
1
2
3
4
private function Update(e:Event):void
{
	world.Step(1 / 30, 10);
}

This line sets the world to update so that the simulation will run. The first parameter is dt, or the time step for updating. Set this to 1/30 with your frames per second on your fla set to 30 too, to make the simulation run at an acceptable speed. The second parameter is the iteration count per step. This means how many times the code will check things like collisions, forces etc and respond appropriately. A value too small will means the objects may collide and intersect if you have too many objects, but a value that is too high will cause your performance to degrade. It is generally accepted that 10 is the preferred compromise to get the most realistic simulation at the right speed.

Now try running your project again using Ctrl+Enter. Now you should see 3 green objects in the world: the floor and the two walls. These objects are green as they are static, because of their density values.

Before we create our addBox() function, we must set up a couple of things. For this demonstration, a new box is added every 10 ticks of the world. To do this, add a global variable called count, of type Number and set it to 10. Then add this code to your Update function, just under the world.Step() call:

?View Code ACTIONSCRIPT
1
2
3
4
5
if (counter -- &lt;= 0)
{
	counter = 10;
	addBox();
}

This code is set up so that every 10 ticks the value will be less than or equal to 0. At that point, the counter is reset and a new box is added to the world.

Now it is time to create our addBox() function, which will be similar to our other functions for creating the walls and floor except using some random variables to make it more interesting, and a non-zero value for the density so that objects are dynamic, and therefore move. Here is the code for the function:

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
private function addBox():void
{
	var boxShapeDef:b2PolygonDef = new b2PolygonDef();
	boxShapeDef.density = Math.random() * 0.5 + 0.3;
	boxShapeDef.friction = Math.random() * 0.3 + 0.3;
	boxShapeDef.restitution = 0.3;
	var cubeSize:Number = Math.random() * 15 + 10;
	boxShapeDef.SetAsBox(cubeSize / ratio, cubeSize / ratio);
 
	var boxBodyDef:b2BodyDef = new b2BodyDef();
	boxBodyDef.position.Set((Math.random() * 320 + 100) / ratio, (Math.random() * -50 - 50) / ratio);
	boxBodyDef.angle = Math.random() * 360 * Math.PI / 180;
 
	var boxBody:b2Body = world.CreateBody(boxBodyDef);
	boxBody.CreateShape(boxShapeDef);
	boxBody.SetMassFromShapes();
}

The random numbers may be slightly difficult to understand at some points. To generalise, the random variables are created using Math.random() * x + y. What this does is generate a random number between 0 and 1, multiply it by x and add on y. This means that the lower bound of the function is y (if the random function returned a zero) and the maximum is x + y (if the random function returned a 1)

Note with this example a variable is used so that the half width and half height of the body definitions are equal, thereby creating all cube shapes. If you wish to have rectangle shapes as well, delete the line that creates the cubeSize variable and make both the half width and half height random and independent of eachother for a random rectangular shape.

Now try running your code. If there are no errors, then the movie should run and random sized boxes should fall from above the stage onto the floor and side walls and start stacking up. It is interesting in and of itself to just watch this for a while and see how high the stack can get before it can’t support and more and most objects fall over the side.

If there are any errors, then please compare the significant section of your code to the full code listing here:

?View Code 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
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
package  
{
	import Box2D.Collision.b2AABB;
	import Box2D.Collision.Shapes.b2PolygonDef;
	import Box2D.Common.Math.b2Vec2;
	import Box2D.Dynamics.b2Body;
	import Box2D.Dynamics.b2BodyDef;
	import Box2D.Dynamics.b2DebugDraw;
	import Box2D.Dynamics.b2World;
	import flash.display.Sprite;
	import flash.events.Event;
	/**
	 * ...
	 * @author Matthew Hurst
	 */
 
	[SWF(backgroundColor=0x333333)]
	public class Main extends Sprite
	{
		private var world:b2World;
		private static const ratio = 40;
		private var counter:Number = 10;
 
		public function Main() 
		{
			createWorld();
			addFloor();
			addWalls();
			setupDebugDraw();
			addEventListener(Event.ENTER_FRAME, Update);
		}
 
		private function addWalls():void
		{
			var wallShapeDef:b2PolygonDef = new b2PolygonDef();
			wallShapeDef.friction = 0.5;
			wallShapeDef.density = 0.0;
			wallShapeDef.restitution = 0.3;
			wallShapeDef.SetAsBox(25 / ratio, 40 / ratio);
 
			var wallBodyDef:b2BodyDef = new b2BodyDef();
			wallBodyDef.position.Set(80 / ratio, 300 / ratio);
 
			var leftWall:b2Body = world.CreateBody(wallBodyDef);
			leftWall.CreateShape(wallShapeDef);
			leftWall.SetMassFromShapes();
 
			wallBodyDef.position.Set(470 / ratio, 300 / ratio);
			var rightWall:b2Body = world.CreateBody(wallBodyDef);
			rightWall.CreateShape(wallShapeDef);
			rightWall.SetMassFromShapes();
		}
 
		private function Update(e:Event):void 
		{
			world.Step(1 / 30, 10);
 
			if (counter -- <= 0)
			{
				counter = 10;
				addBox();
			}
		}
 
		private function addFloor():void
		{
			var floorShapeDef:b2PolygonDef = new b2PolygonDef();
			floorShapeDef.density = 0.0;
			floorShapeDef.friction = 0.5;
			floorShapeDef.restitution = 0.3;
			floorShapeDef.SetAsBox((stage.stageWidth - 100) / 2 / ratio, 20 / ratio);
 
			var floorBodyDef:b2BodyDef = new b2BodyDef();
			floorBodyDef.position.Set(stage.stageWidth / 2 / ratio, 350 / ratio);
 
			var floorBody:b2Body = world.CreateBody(floorBodyDef);
			floorBody.CreateShape(floorShapeDef);
			floorBody.SetMassFromShapes();
		}
 
		private function setupDebugDraw():void
		{
			var debugSprite:Sprite = new Sprite();
 
			var debugDraw:b2DebugDraw = new b2DebugDraw();
			debugDraw.m_sprite = debugSprite;
			debugDraw.m_fillAlpha = 0.6;
			debugDraw.m_drawScale = ratio;
			debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
			debugDraw.m_lineThickness = 2;
			addChild(debugSprite);
			world.SetDebugDraw(debugDraw);
		}
 
		private function addBox():void
		{
			var boxShapeDef:b2PolygonDef = new b2PolygonDef();
			boxShapeDef.density = Math.random() * 0.5 + 0.3;
			boxShapeDef.friction = Math.random() * 0.3 + 0.3;
			boxShapeDef.restitution = 0.3;
			var cubeSize:Number = Math.random() * 15 + 10;
			boxShapeDef.SetAsBox(cubeSize / ratio, cubeSize / ratio);
 
			var boxBodyDef:b2BodyDef = new b2BodyDef();
			boxBodyDef.position.Set((Math.random() * 320 + 100) / ratio, (Math.random() * -50 - 50) / ratio);
			boxBodyDef.angle = Math.random() * 360 * Math.PI / 180;
 
			var boxBody:b2Body = world.CreateBody(boxBodyDef);
			boxBody.CreateShape(boxShapeDef);
			boxBody.SetMassFromShapes();
		}
 
		private function createWorld():void
		{
			var worldBoundary:b2AABB = new b2AABB();
			worldBoundary.lowerBound.Set( -3000 / ratio, -3000 / ratio);
			worldBoundary.upperBound.Set(3000 / ratio, 3000 / ratio);
 
			var gravity:b2Vec2 = new b2Vec2(0, 9.81);
 
			world = new b2World(worldBoundary, gravity, true);
		}
 
	}
 
}

Congratulations, you have taken your first steps into making a game using Box2D. Try changing a few values of variables here and there in things such as the material properties of objects to have a play around. Try and understand what each line of code is doing so that after a while you can recreate this prototype without using this tutorial. I hope you found this brief introduction into what Box2D can do and how you can use it useful, and hopefully you’ll be creating your own physics based games soon!

If you have found any problem with the tutorial, the code, or wish to contact me regarding this post, my blog or flash, please either comment on this post, or email me at matthew@mshurst.co.uk

Filed under: Adobe Flash, Game Programming, Tutorials | Posted on July 14th, 2010 by Matthew | 6 Comments »

Tutorial: How to set up Box2DFlash v2.0.2

In the future I plan to write various blog posts on experiments, prototypes and game ideas using Box2DFlash in Actionscript 3. Before starting this I figured I would post how to get started with using Box2D in the Flash environment. Note that this tutorial will not go into the code itself, or any projects, but will offer an overview for how to get ready to code using the Box2D physics engine for Flash. When I use Flash, I code using both the Flash CS4 IDE, and the free FlashDevelop, for ease. As a result of this, I will show how to set up Box2D in both Flash and FlashDevelop. If you only use the Flash IDE when coding, skip the FlashDevelop section and head onto the Flash IDE section

Downloading Box2DFlash v2.0.2:

To download the version of Box2DFlash I will be using for my blog posts, visit http://www.box2dflash.org/download and click the Flash 9 version of v2.0.2

Once downloaded, extract the zip file to a directory that is easy to find. I copied mine into my general flash projects folder, in a new folder called ‘Included Classes’. This is what my folder looks like:

The contents of my Box2D Folder

Classes Folder

As you can see, the only folders from the original download you must keep for the included classes are the Box2D and General folders. In fact, even the General folder is optional. All of the other files included in the download serve as examples of utilising the Box2D engine. You should keep these for reference, but these do not have to be kept with the necessary Box2D folder, as they are not part of the included classes.

Once your Box2D (and optionally General) folder is in a convenient location, you are ready to set up the Flash IDE and Flash Develop to use Box2D

How to set up Box2D in FlashDevelop:

To set up Flash Develop, follow these steps:

1 – Run your current version of Flash Develop

2 - Once opened, navigate to the Tools -> Global Classpaths option (or alternatively, press Ctrl + F9)

3 – Change the listbox to AS3, and click ‘Add Classpath’

4 – Navigate to the folder that contains the Box2D folder. Note that this is not the folder called Box2D. In my case, the folder was called ‘Included Classes’

5 – Once added, click the ‘OK’ button to close the options box.

6 - Test the set up has worked by trying to create a variable of type “b2AABB”. This is a variable type included in the Box2D classes. If the type is recognised (i.e. it turns blue, or the variable type is shown as you begin to type in the autocomplete box) then you have successfully set up Box2DFlash in FlashDevelop.

    How to set up Box2D in Flash IDE:

    To set up the Flash IDE, follow these steps:

    1 - Run Flash CS3 or later

    2 - Go to Edit -> Preferences (Ctrl + U)

    3 – Click the ‘Actionscript’ category on the left

    4 - Click the ‘Actionscript 3.0 Settings’ button at the bottom of the window

    5 - Under the ‘Source Path’ section, click ‘Browse to Path’

    6 - Navigate to the folder that contains your Box2D folder

    7 - Click OK to close the Actionscript 3.0 Settings window

    8 - Click OK to close the Preferences window

    9 - You’re done! You are now able to include Box2D classes in the same way as Flash classes when coding in Actionscript 3.0.

      Congratulations! You are now ready to make games using Box2DFlash in both FlashDevelop and the Flash IDE. Stay tuned for a beginners tutorial on how to code in Box2DFlash. While waiting, while not take a look at the code in the examples given in the download of Box2DFlash.

      Filed under: Adobe Flash, Game Programming, Tutorials | Posted on July 8th, 2010 by Matthew | 1 Comment »

      Review: Assassin’s Creed 2 (Xbox 360)


      Assassin’s Creed 2, the sequel to the somewhat hit-and-miss Assassin’s Creed, is everything that the original wasn’t. If you were a particular fan of the original, then you will no doubt enjoy this game. However, AC2 has improved by so much that it should win gamers round who were disappointed with the original.

      The story continues from where Assassin’s Creed left off, pretty much to the exact second, with your present day character, Desmond Miles, staring at the strange red patterns on the wall of his room. Without wanting to give too much away, after a brief stint of playing Desmond, you return to the Animus. This time round, instead of Altair from the Crusades era, you experience the life of Ezio Auditore, another of Desmond’s ancestors.

      From the moment you step into the Animus, you’re thrown into Ezio’s world in Florence, where he picks fights with his enemies, runs across rooftops and meets the girls. These simple missions function as both a tutorial for the controls of the game (which are pretty much exactly the same as the original) and an introduction to the story. It succeeded in drawing the gamer into Ezio’s world and his character. As I am not a great fan of spoilers in these articles, I won’t give too much away story-wise, but rest assured you are soon thrown into the murdering world you expected.

      Gameplay is quite different from the linear world of the original Assassin’s Creed. Missions are a lot less repetitive than they were, and they actually seem to serve a purpose, unlike its predecessor. One mission could have you helping cull the guards in a city to prepare for an assassination, and in another you could help a female citizen to safety with a gondola boat.

      Combat is pretty much the same as the original, with the X button providing your main means of attack with weapons such as swords, daggers, hidden blades and spears. The combat features a timing system where the player can counter enemies attacks, also with the X button, and bring them down in a cinematic style, which depends on which weapon you have equipped and the position of the enemy. You can also disarm opponents to steal their weapons, or daze them by throwing sand in their face. Players can also dodge attacks using the A button, and grab enemies with the B button. The only gripe with this is that combat becomes relatively repetitive, and after a while outside of missions I found myself outrunning fights I found myself caught up in because I couldn’t be bothered to stay and fight.

      Stealth gameplay provides a major focus of the game. If you perform too many crimes, a meter fills up which turns you from ‘Incognito’ to ‘Notorious’. From then on, any guard that spots you will chase and fight you. Fortunately you can lower your Notoriety in one of three ways. You can tear down Wanted Posters (which seem to appear in the weirdest places, such as on a ledge high above anyone’s eye level), Bribing Heralds (after which you can pickpocket them for your money back, though this may result in an increased notoriety again), and you can assassinate officials, which is probably the most rewarding choice.

      There are also many side missions to divert from the main story, should you choose to do them. There are assassin tombs (which offer a gameplay experience not unlike the Prince of Persia games), races, contractual assassinations, beat ‘em up and courier missions. While some a more interesting than others, they all serve their purpose. Either for monetary gain (of which there is plenty to spend it on) or to expand the story.

      There is also a fair amount of collecting in AC2. Players can collect parts of several armour sets, and colour them with dye, weapons can be bought from smiths, and codex pages act as upgrades to your health and weapons. There are also 100 feathers to be found, which will cause a sigh of relief to players of the original who found themselves collection hundreds of flags. There is also a system included where you can upgrade certain parts of a small town, such as reopening the mine and upgrading the shops. This allows the town to generate more income, which Ezio can collect every so often. Money generated also increases from the amount of side missions you accomplish.

      A particular favourite is the introduction of “Glyphs”. These are small visual symbols that appear on various landmarks in the game, that task the user into solving either picture or logic puzzles in order to decode parts of a video that offers a fascinating insight into how the whole story began (I am purposefully trying to not give anything away, though after you have unlocked a few of the chunks of the video it isn’t too difficult to decipher it yourself). Some of these puzzle are easier than others, and some of them will have you sitting scratching your head for hours. Thankfully with the internet the way it is nowadays the solutions to these puzzles if you do not have to drive to do them yourself is only a few clicks away.

      Graphically Assassin’s Creed 2 is amazing. Ubisoft retained their concept of synchronising viewpoints from high ledges in order to reveal the map, which seems like a showcase of the draw distance and beauty of the world on the developer’s part. Throughout the game you will visit various different towns or cities, including Florence, Venice and Tuscanni. Each area has its own unique charm and beauty, especially Venice’s rivers.

      All in all Assassin’s Creed 2 is a mile above the original. While the combat remains relatively unchanged, it was the linearity of the original that caused problems for gamers and that has been improved and then some. Many side missions offer a refreshing step away from the story at times, and some even back the story up. One thing to note, however, is that because of the numerical sequence of the story from the Animus, the player can notice that some sequences are missing (Sequences 12 and 13). Though this does not take anything away from the story, it feels like either Ubisoft were rushed into releasing the game and thus could not finish all of it, or they aimed to purposefully leave some of the game out and release it as DLC. Their reasoning is open to discussion, but the sequences are due to be released soon as DLC. Aside from this minor problem, AC2 is a polished masterpiece that will hopefully lead to an equally amazing sequel.

      Pros:

      +Less linear feel
      +Amazing story and characters
      +Less repetitive gameplay than the original
      +Assassin Tombs offer an amazing exploration experience

      Cons:

      -Combat remains relatively unchanged
      -Parts of the game seem left out

      Overall Score : 9.3/10

      Filed under: Game Reviews | Posted on February 2nd, 2010 by Matthew | 2 Comments »

      AS3: Trigonometry and 2D Velocity Prototype/Tutorial

      As this tutorial is a tutorial on Actionscript 3, I will assume you know your way around the general Flash interface

      To start, open up Flash and create a new Flash CS3 Document. For the purpose of this tutorial, you will not be coding in the .fla as you will use a document class. However, you will create an object in the library for use in your document class. Firstly, draw a small circle of width and height 20. Also, draw a line from the centre of the circle to the outer circumference, as if the circle was pointing to the right. This is because as default when a Sprite or Movie Clip Object’s rotation property points to the right when it is set to 0.

      Once your shape is drawn, highlight all of it and press F8 to convert it to a MovieClip. Call the object Ball, and make sure the ‘Export for Actionscript’ box is checked. Call the class Ball as well, and change the base class from “flash.display.MovieClip” to “flash.display.Sprite” This is not mandatory, but Sprites are loaded faster than MovieClips as Sprites are objects with no frames (and therefore no timeline-based animation) Once done click the OK button, and delete the instance of your object that is on the stage, as we will add it from the library later using Actionscript.

      To create a Document Class click File -> New -> Actionscript File. Once created, save it in the same folder as your .fla file, then go back to your .fla file and change the Class box under the properties section to the name of your .as file, but without the .as extension. To check it works, click the pencil icon next to the box and it should open your newly created .as file. If you get an error, the names do not match.

      Once your document class is set up, we’ll start with the bread and butter of this tutorial: the Actionscript. I will first post all of the code, then explain each line afterwards so you can understand how the code works as well as seeing it all exactly as you would in your class

      ?View Code 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
      59
      60
      61
      
      package
      {
      	import flash.display.Sprite;
      	import flash.events.Event;
      	import flash.events.MouseEvent;
       
      	public class FollowMouseAngle extends Sprite
      	{
      		private var ball:Ball; //creates an instance of the Ball class named 'ball'
      		private var angle:Number; //holds the angle that will be used for the balls rotation
      		private var radians:Number; //holds the angle (in radians) that will be calculated using trigonometry
      		private var vX:Number = 0; //holds the horizontal velocity of the ball
      		private var vY:Number = 0; //holds the vertical velocity of the ball
      		private var dX:Number; //holds the distance between the ball and mouse horizontally
      		private var dY:Number; //holds the distance between the ball and mouse vertically
      		private var speed:Number = 15; //holds the constant speed that will be multiplied to give us our velocity components
       
      		public function FollowMouseAngle():void
      		{
      			init();
      		}
       
      		private function init():void
      		{
      			ball = new Ball();
      			addChild(ball);
      			ball.x = stage.stageWidth / 2;
      			ball.y = stage.stageHeight / 2;
       
      			addEventListener(Event.ENTER_FRAME, onEnterFrame);
      			stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
      		}
      		private function onEnterFrame(event:Event):void
      		{
      			dX = mouseX - ball.x;
      			dY = mouseY - ball.y;
      			radians = Math.atan2(dY, dX);
      			angle = radians * 180 / Math.PI;
      			ball.rotation = angle;
       
      			ball.x += vX;
      			ball.y += vY;
       
      			if  (ball.x - ball.width / 2 < 0 || ball.x + ball.width / 2 > stage.stageWidth)
      			{
      				vX *= -1;
      			}
       
      			if (ball.y - ball.height / 2 < 0 || ball.y + ball.height / 2 > stage.stageHeight)
      			{
      				vY *= -1;
      			}
      		}
       
      		private function onMouseDown(event:MouseEvent):void
      		{
      			vX = Math.cos(radians) * speed;
      			vY = Math.sin(radians) * speed;
      		}
      	}
      }

      Line 1: This package line creates a new package, in which is contained your whole class. All Actionscript that is not on the timeline must be preceded by the package line, with all other code in curly braces

      Lines 3-5: These lines control the internal Flash classes that are imported for your use. Here we are importing the flash.display.Sprite class, which lets you add Sprites onto the screen, the events.Event class, which contains the ENTER_FRAME event we will be using to execute once every frame, and the MouseEvents class that we will use to control what happens when the user click the mouse

      Line 7: This line initiates our class. The classname (in this case ‘FollowMouseAngle’ should be the same as the document class filename. The class must also extend another class (either Sprite or MovieClip) so that it can be given the properties of Sprites or MovieClips. In this case it does not matter which one you use, but whichever you use you must import the base class outside of your class

      Lines 9-16: These lines declare the variables we will be using in this tutorial. They are all private as there is no need in this case for them to be available outside of this class, as this is the only class that is being used. Each line is commented showing what the variable does, or will do later in the code.

      Lines 18-21: This is the base function of the class. Notice it has the same name as the class itself. This function will only be ran once, when the class is first loaded. Inside I am calling the init(); function that I have created myself

      Line 23: This is the function I called from the base function earlier. It is private as it does not need to be accessed from outside of the class, and it void as no variables are passed through the function itself

      Lines 25-28: These lines set up the ball and add it to the stage. Line 25 creates the new instance of the Ball class that is in the library. Line 26 adds the Sprite named ‘ball’ to the stage at point 0,0 (the top left of the screen) and lines 27 and 28 change the position of the ball so that it is in the middle of the stage, using the stage.stageWidth and stage.stageHeight properties and halving them to give the x and y coordinates of the centre of the stage. It is more productive to do it this way rather than typing in the numbers yourself in case you decide to change the dimensions of your stage, in which case the position of the centre of the screen would be affected

      Line 30: Here we are adding the event listener that will be called every frame, the speed of which is set on the .fla document as the frames per second. 30 or so will create a smooth enough motion in this case, though you can change the value to experiment and find the best yourself. The second property of the addEventListener command is the function name that will be called each time. In this case it is ‘onEnterFrame’, though you can name it what you want

      Line 31: This is the second event listener, this time for the mouse down event (which will be called when the user pressed the left mouse button) Notice that this time I have preceded the command with ‘stage’. This is because an event such as a MouseEvent requires a target. In this case I have let the user click anywhere on the stage, though you might prefer the function to only be called when the user clicks the ball, in which case change ‘stage’ to ‘ball’

      Lines 33-39: This is the code that will be executed once every frame. Notice that it is a function much like the others you have used so far, except with ‘(event:Event)’ to the right of the function name. This is a variable passed into the function that allows you to access properties of the type of event from inside the event by using the name left of the colon as the target. This can be useful in Keyboard and Mouse Events, though they are not used for this tutorial so you don’t need to worry about them now.

      Inside the function, we first calculate the distance between the mouse and the ball and assign it to the dX and dY variables. We then calculate the angle between the ball and mouse using the Math.atan2 command. The Math.atan2 is used over the Math.atan as the latter will not work properly in a full circle. You can test it yourself, as the ball won’t point towards your mouse when the angle is past a certain point. Using atan2, you can be sure that the angle will always be correct no matter where the mouse is in relation to the ball. Notice that the value this calculates for the angle is in radians. The next line converts the radians value into degrees, as the .rotation property has to be in degrees in Flash. To achieve this you simple multiply the radians by 180 divided by Pi, which is built into flash as Math.PI. The next line sets the angle you have calculated (now in degrees) to the rotation property of your ball.

      If you ran the code now as it is, you should be able to see that the ball will point towards your mouse. However, you might encounter an error that you haven’t made the function for the MouseEvent yet. If so, and you still want to try this, just comment out the second EventListener and it should run fine

      Lines 40 and 41: These two lines add the horizontal and vertical velocities to the ball’s x and y properties. At the moment these values would be 0, as they are only calculated when the mouse button is pressed, which will be covered in the next function

      Lines 44-52: This is the conditions we use to see if the ball is still on the stage. If the ball is about to cross the boundary and be outside of the stage, its x or y velocity is multiplied by -1, which inverses the direction that the ball is travelling in, but does not slow it down or speed it up. Effectively this is how the ball bounces off the side of the screen

      Lines 55-59: This is the function that controls what happens when the user clicks the left mouse button anywhere on the stage. Firstly, the horizontal component is calculated by taking the cosine of the radians value that was calculated earlier and multiplying it by the speed (which we set to 15) to give it a larger value. Secondly we calculate the vertical component using the same method except by taking the sine of the radians value instead of the cosine. By using both of these values the ball will travel in the direction of the mouse

      Once you have typed all the code, and made sure all functions, the class itself and the package is closed off with closing curly brackets (“}”) You can run your program by pressing the control and enter keys, or by using the Control -> Test Movie option on the toolbar at the top of the Flash IDE. You should notice that the ball will rotate so that it is pointing towards your mouse all the time, and when you click the left mouse button it should move towards the mouse button. While the ball is moving you can click again so that the balls direction is changed towards the mouse once more.

      This is what you should end up with:

      I will note that this tutorial is not specifically meant to be a games tutorial. It is more a tutorial of a prototype that I created to test various features such as events and trigonometry. This itself is not a game, but feel free to use the prototype and adapt it to create your own game. If you have any problems with the code or the tutorial itself, either post a comment here or email me at matthew@mshurst.co.uk

      Filed under: Adobe Flash, Game Programming, Tutorials | Posted on November 15th, 2009 by Matthew | 8 Comments »

      Important Blog Topics Change

      From today, this blog will no longer just cover Flash Tutorials. Now I will also cover Music Topics, General Gaming and hopefully a wider variety of Games Programming Topics, concentrating mostly on Microsoft’s XNA

      Stay tuned for upcoming posts in these catagories!

      Filed under: Blog-related | Posted on July 19th, 2009 by Matthew | 1 Comment »

      Top Tips for Beginner Game Programmers

      A lot of these tips may seem obvious to some people, but it is important to remember these things when learning how to program, especially for beginners who may get bogged down in wanting to create the next great game

      1. KISS (“Keep it Simple Stupid”)

      Perhaps the simplest rule to follow. Do not become one of the new programmers who immediately think they can make a full GTA Clone, FPS game or MMORPG. It takes years of work with a programming language to become that familiar with it, and even then, programming the game would only be the start of things. You would also need artistic skills for the textures and models, as well as sound samples to use. If you were not proficient in Art or Sound, you would need to organise a team to build the game. I admit that I am terrible at art, so when I make Flash Games I either have to make do with simple artwork, or hire an artist to do the imagery for me. With Flash games, the popularity should be estimated if you plan to hire someone to do artwork as there is not much point in doing it unless your game creates a load of ad revenue from a monetizing system such as Mochiads or sponsorship from a game portal.

      As a bit of a newbie to Flash myself, I am focusing at the moment creating simple games. My advice would be to come up with a simple arcade game idea, which would be fairly easy to code. Hell, you could even base your game off classics (Pac-Man, Breakout, Asteroids, Pong) but to make your game stand out (and thus earn more money), try and improve on them. Find out where these games became less enjoyable or boring and expand on them so they become something new.

      2. Inspiration

      It is not easy to find inspiration sometimes. Other times, several ideas can flood into your head at once. Don’t be discouraged if you can’t think of an idea while trying to come up with one on purpose. I’ve found that my inspiration has came when I’ve been doing seemingly random things, and an image of a game has entered my mind with an idea that until then I had nothing about. Try things such as watching TV, listening to music, or playing other games in the hope of being inspired to create the next amazing game.

      3. What to do with ideas

      Once you have your idea, you better be sure you don’t forget it. To make sure of this, write it down. Keep a notepad handy with your game ideas in. Titles, sketches and gameplay concepts are all key things to note down when you get an idea (though the final title of your game might come at the end) I try to eventually write a specification using a template where I outline the coding concepts I’ll need to create my game, so that I know what skills I need to go over and make sure I know before coding my game. It also helps to have a direction to go in with your game, as if your game takes a few hours to create, you could deviate from the original plan which could eventually cause you to move too far from your idea. This isn’t always a bad thing, however, as during the coding process you could get an idea for an improvement or a new feature you could implement to improve your game from your original plan, so it is important to stick to your plan as close as you can at first for the games concept, and so your game has a purpose, but if you come up with improvements don’t be afraid to add them in if they improve the gameplay.

      4. Don’t release your game too early

      I have definitely been guilty of this on more than one occasion. However, it is a nightmare if you release your game to several flash game portals having tested it a bit yourself to see if it works, only for someone to find a massive bug in the game that causes their rating of it to significantly drop. It is vital to fully test your game before you release it so that you don’t end up having to email portals asking them if they can update their website’s copy of your game. Also, once you think that it is done, try and step back and have a look at it from more of a Gamer’s point of view. These are some questions you should ask yourself:

      “Is it fun?”

      “Are there any bugs or spelling mistakes?”

      “How can this game be improved?”

      If you find you do not enjoy your game, try to think how it might be more enjoyable, and improve on it. Send it to a few of your friends to try and get their input as to whether or not they enjoy the game and where they think the problems might lie. Friends are also a great way to get some extra bug testers before officially releasing your game, so take advantage of this opportunity too. Remember to also thoroughly check for spelling mistakes and any other tiny bugs that may not cause any gameplay issues, but detract from the polish of your game.

      Only once you have done these steps should you release your game, as only then will you be absolutely sure it has no problems and it is made to the best of your ability. If the game is fairly successful and you have even more ideas on how it could be improved further down the line, why not try creating a sequel? Just be sure that you will make enough improvements to the enjoyment of the game so that it isn’t just a clone of your original.

      Filed under: Game Programming | Posted on March 20th, 2009 by Matthew | No Comments »

      Flash AS2 Tutorial: Using the keyboard arrows to move a movieclip

      Requirements:

      • Adobe or Macromedia Flash (Preferably 8 or above)
      • A keyboard

      This is a beginner tutorial for Flash Actionscript 2.0. I assume that you will have a vague understanding of navigating the menus, although I will not assume you have used actionscript before.

      Start by opening up your version of Flash (Personally I am using the newest version, Adobe Flash CS4)

      Once opened, draw any shape you wish using the any of the tools such as the brushes, rectangles, ovals etc and use any colour you want

      Once you have done that select the shape by clicking it. If your shape has a line border around then double click the object to select the object and the border at the same time. You can tell when your object is selected as it will be covered with a dotted pattern such as this:

      After that, hit the F8 Key to open the convert to movieclip menu. For the purposes of this tutorial, I have named my object “ball”. The name you choose does not matter, but you will need to use it when typing actionscript into the actions window.

      Now your movieclip is ready to move! To insert the necessary code select the object (Note: Now that the object is a movieclip, the shape will have a blue square around it rather than the grey dots) and hit the F9 key to open the actions window. This is the window you will use to type all of the code in your game.

      Type or paste this code into the actions window. I advise you to type it yourself so that you will remember it easier.

      [cc lang = "actionscript" tab_size = "4"]
      onClipEvent(load) //This code is only executed once, when the movie first runs
      {
      var speed:Number = 5
      }

      onClipEvent(enterFrame) //This code is executed every frame
      {
      if(Key.isDown(Key.UP))
      {
      this._y -= speed
      }
      if(Key.isDown(Key.DOWN))
      {
      this._y += speed
      }
      if(Key.isDown(Key.RIGHT))
      {
      this._x += speed
      }
      if(Key.isDown(Key.LEFT))
      {
      this._x -= speed
      }
      }
      [/cc]

      If your object does not appear to move fast enough, then feel free to adjust the speed variable. If the movement of your object appears to lag, then increase the Frames per Second of your movie by editing the movie properties. The higher the FPS the smoother the movement, but the maximum you should set it to should be around 50 FPS.

      Once you are ready, hit Ctrl+Enter to test your movie. Your movie should function similar to this:

      You’re done! Congratulations for taking the first steps towards making a flash game. In the next tutorial I will show you how to add gravity and acceleration to your movieclip. If you have any problems or suggestions then please feel free to comment below

      Filed under: Adobe Flash, Game Programming, Tutorials | Posted on March 2nd, 2009 by Matthew | 10 Comments »

      Categories

      Archive

      Links

      Meta

      Copyright © 2013 MSHurst.

      email marketing software