Archive for November, 2010

Well i would start by saying that Box2D Flash made my life so easy 😀 and Physics Is FUN 🙂

I have been making physics based 2D platform games in Flash ActionScript 3.0 for just one past one month. yes i am newbie in Flash world. For Physics based game i chose Box2D Flash 2.1 and why did i chose Box2D Flash ?? cuz it had a good reviews from other developers and it was the first library that i stumble into via google haha 😀
But at the end it gets my job done much easier that i thought. Its very powerful library and meets my needs till now.

So i was playing around with the library by going through many tutorials, you’l get many on the net. Many of them were very very useful to me and got me started at instant.

Well now lets come back to the subject of this post: Using Movieclip with Box2D !! Please don’t get confused with the name of the post 🙂 This post is about how i used movieclip from fla library or images with Box2D flash, at start i used to play with shapes like polygons and circles, collision between shapes and all that. But when i learned those things and wanted to make basic game simulation demo then i didn’t know how to use real Images with the library. I searched many tutorials but i didn’t get the way to use real images with the library. Then i stumbled into a forum where this topic has been discussed. So now here i am goint to tell how to use movieclip with library i.e instead of showing circle and polygons moving around and interacting, you’l be using movieclips ot bitmaps.

I’l assume that u know basic setup and use of Box2D Flash 2.1 because i won’t be explaining those things, i’l just explain how movieclip will be used. And maybe someone have better way to use it so please share it in comment.

First of all, for newbies like me, please go to this tutorial. It has good explanation of using Box2D and its concept. The Movielclip from fla that i am using here has been downloaded from here Adobe Article

1) Create the Shape definition for MovieClip that will be used (literally), its shape definition for the box2d shape.

var bodyDef:b2BodyDef=new b2BodyDef();

2) Create the body. And we are assigning the instance of Movieclip to body using SetUserData function. you could say we are associating Movieclip data to body. I don’t have other way to explain it. 🙂 here texture is the instance of my movieclip that i created in fla file. Image is shown below

Moviclip from fla

var body:b2Body=world.CreateBody(bodyDef);

3) Now we create our shape.

var dynamicBox:b2PolygonShape=new b2PolygonShape();

4) We can set various properties when we create the fixture.

var fixtureDef:b2FixtureDef=new b2FixtureDef();

5) Set the position of movieclip relative to the position of shape body that movieclip will represent

body.GetUserData().x = body.GetPosition().x*PIXELS_TO_METER;
body.GetUserData().y = body.GetPosition().y*PIXELS_TO_METER;

6) Add the moviclip


7) I am calling update function on ENTER_FRAME


8] update function where physics world will update and object will interact

private function update(event:Event):void{
    var timeStep:Number=1/30;
    var velocityIterations:int=6;
    var positionIterations:int=2;



for(var worldbody:b2Body = world.GetBodyList(); worldbody; worldbody = worldbody.GetNext()){


             worldbody.GetUserData().x = worldbody.GetPosition().x*PIXELS_TO_METER;
             worldbody.GetUserData().y = worldbody.GetPosition().y*PIXELS_TO_METER;

In above update function, inside for loop, i am iterating through world list for bodies and in each iteration i am checking if each body in world has movieclip/userdata associated. If userdata is not null then i am updating movieclip in this case so we are setting the position values of body shape to our movieclip in general and it will behave as shapes do. I hope i haven’t made u confused . I tried my best to explain this. It works.
Download Source Files


Yesterday i was writing a 3d Carousel Gallery of videos and Photos. All functions were coded and working properly, only interaction with items was yet to be coded. So i started writing codes for interaction with items on my 3d gallery. So interaction handling wasn’t very big deal. i got it working in few minutes. My interaction function was when i click item which is at the face of camera then new bigger version of that image appears from back to the front and back gallery shifts back a little and fades a little (some nice animation). I did use Planes and BitmapFileMaterial to map texture to plane.
So that was working fine but i noticed that when i move mouse over items then buttonmode icon wasn’t coming. So i did write item.buttonMode=true; and “viola” there isn’t any such property called buttonMode for 3D primitives and materials in papervision. So i opened the papervision documentation and went through the methods and property but no success. Then after exploring docs for some more time i stumbled into viewport object and found something very gold :D.

There was a property for viewport:


so i put it in my scene initialization routine and got it running. and Bingo i got my buttonMode when moving mouse over my items.

Well that satisfied my application need and i am happy :D.


I am Flash

Its been almost One month that i have been learning and writing Flash application with ActionScript 3.0. After getting familiar with ActionScript 3 and writing lots of program, i tried to venture into 3D. After googling some on doing 3D with ActionScript, i came across PaperVision3D. Its an awesome 3D engine. I enjoyed writing papervision app codes like 3d Carousel and Games. You can download the papervision library from here. There are lots of good papervision tutorials there out. They’l get you start with writing basic papervision programs quickly. I’l also post my work that i have been doing 😀

There is another library that i loved very much and made my life easy :D. Its a physics engine Box2D Flash. Its a port of c++ Box 2D. This is my first time attempt on Box2D library. When i started writing physics based flash game using Box2D Flash, i was very satisfied with the outcome. You can download the library from here.

Links to papervision tutorials that you would like to check out:
Basic starting tutorials: http://www.emanueleferonato.com/2009/05/08/papervision3d-for-the-absolute-beginners/
All good tutorial: http://papervision2.com/
Simple 3D carousel: http://papervision2.com/a-simple-papervision-carousel/
Loading 3d model using papervision: http://papervision2.com/loading-complex-models-v2/
Handling Basic 3D interaction events: http://papervision2.com/basic-interactivity/
Lighting and Shading: http://blog.tartiflop.com/2008/08/first-steps-in-papervision3d-part-4-lighting-and-shading/
Texture Mapping: http://blog.tartiflop.com/2008/08/first-steps-in-papervision3d-part-6-texture-mapping/
Basic Shapes and Texture Mapping: http://www.rozengain.com/blog/2007/04/05/papervision3d-tutorial-part-2-basic-shapes-movement-and-segments/

Links to Box2d flash 2.1 you would like to check out:
Getting Started: http://blog.allanbishop.com/box2d-2-1a-tutorial-part-1/
Beginners: http://www.emanueleferonato.com/2010/02/01/box2d-tutorial-for-the-absolute-beginners-revamped/
Complete Walkthrough of HelloWorld Code Example: http://plasticsturgeon.com/?p=295
Physics Based Game Tutorial: http://www.adobe.com/newsletters/edge/april2010/articles/article7/