Box2d Flash Alchemy Port + World Construction Kit

I already showed you two ways of editing Box2D environments with Bison Kick and simply using the Flash IDE.

Today I’ll show you the most advanced editor at the moment: World Construction Kit made with Box2D C++ 2D physics engine compiled with Adobe Alchemy.

The demos on the official site are really awesome and the creators say “World Construction Kit is is a toolset / framework for rapidly developing physics based games / websites within the Flash IDE. WCK allows you to layout your 2d worlds / game levels entirely within Flash and have them hook into the physics simulation without writing any code.”

Obviously you’ll have to write (more than) some code to mak a complete game, but at the moment let me show how to create a World Construction Kit (WCK from now on) “Hello World”.

The following project is almost the same you can create from the official step by step guide, just better explained with images.

1) Create a new Flash file, save it on your computer and in the same path create a folder called wck-lib which will contain Box2D, Box2DAS, extras, gravity, misc, shapes and wck folders of the package you can download fromthe official site.

2) In your Publish Settings select Flash and check Export SWC, then click Settings..., set wck.WCK as your Document class and in your Source Path include the wck-lib folder you created in step 1.

Then move to Library path label and include Box2DAS/Box2D.swc file from the folder you created in step 1.

Now draw a square on the stage and convert it to Symbol. Check Export for Actionscript and set its Base Class as shapes.Box

In your library window, locate the square Symbol, right click on it and select Component Definition... then set Class as wck.BodyShape.

Back to the stage, select the square and convert it again to Symbol. This time the Base Class will be wck.World.

Now with a double click on the square, you will be able to work with the Symbol. Select it and go to Component Inspector window. You will be able to set all its Box2D attributes.

Doing a couple of times this stuff, I managed to create a draggable dynamic little square over a large static square which acts as floor.

Download the source code with all required libraries.

Next time I’ll show you how to create a basic platform game.

  • Awesoooooooooooooooooome !!
    i love you ~
    Now I can easy make a physics World !

  • uint

    i am really impressed!

  • Jegolas

    Is there a way to export the elements to xml or is there a way to view the generated box2d code? I would love to use this if that would be possible. Thank you!

  • Awesome write up. I added a link to this from the WCK Wiki.

  • This is an awesome tool. Just curious how efficient it is when creating a level with many of the same objects. Does it recycle shape definitions at all? Or reuse anything for that matter? Or does each body have unique shapes in it that are not reused?

  • Pingback: Nouvelles pour Flexeurs ! | Adobe Flex / AIR : exemples, tutoriels, veille sur les Nouvelles Applications Internet()

  • neo

    Um… it said it is missing cmodule.box2D :(

  • does it have a little lag or its just me?

  • Fuck Yeah!!! Ema, you save many non-programmers life, I´m sure about that!!!

  • jones

    Your fla has a compile error. Even with no modifications it fires an error.I downloaded Jesse’s version instead which works fine.

  • Is there any hope for this working on iPhone? I try it, and doing a test movie in adl works fine, but on an iPhone it doesn’t do any movement.

  • Kowboy

    To neo and anyone else who had the cmodule missing problem, make sure you add the Box2D.swc file to the library.

    • It requires you to use Flash player 10. It resolves the index out of list and possibly the missing cmodule.

  • Aaron

    Adding the Box2D.swc does not fix the missing cmodule for me… any other ideas? Thanks!

    • Be sure you are adding the .SWC to the Library Path rather than the Source Path.

  • can’t worded on iphone!
    :(

  • it is great.

  • cot45

    Is it possible to speed up compile time for this project? When I make a game with Box2d I add Box2d.swc to build path to speed up the game creation time. And when using WCK, are there any ways to add some swcs for quick development?

  • Ivan

    It’s awesome, i try but i have a doubt someone know how move this object with keyboard

    • diego

      when you download the class, can you find on folder “demo”, the file: boxMan.as. This file show how to do for move an object with keyboard

      i need help, too. if someone want share info, can write an email…

  • diego

    ExcelenT… I did examples similar this, but…. could not use this method for shapes, line or polygons… how must do?

  • chris

    I wonder: what is the difference between the as port of box2d by adobe alchemy and the manual port?

  • this walk-through is very good but the source doesn’t work with Flash CS5 — just an FYI

    After you update the Component Definition, you should see the symbol in the library change from a movieclip to a component.

    http://www.box2d.org/forum/viewtopic.php?f=8&t=5002

  • mr mr

    github seems to be down as of 2/20/11. Is there another server to download the WCK files? I haven’t been able to find anything.

    Thanks

  • mr mr

    sigh… i feel dumb. wck was linked to on this page. thanks.

  • Johaannes

    If you get the cmodule.box2D error. Just copy the Box2D.swc to the same folder as your .fla and swc and then link the Box2d.swc in flash.

  • Pingback: WCK « AS3????()

  • Pingback: Brian Lachniet » Diving Into World Construction Kit()

  • Great tutorial, this save me a lot of research… Now its time to make experiments with this framework to do some physics games. Thank you!!

  • Wenamun

    So awesome! Thank you so much for the helpful tutorial! this will make my game creation go 200% faster!
    Merci!!!

  • I like it, very nice ,this is a new method for doing with box2d

  • jarray42

    This is fu**ing beyond legend man, thank you

  • Emanuele:

    How can I create HYPERLINKS from the objects in the World Construction Kit after creating base class of shapes.Box and after creating a “world” and after assigning all the required component definitions? I’ve created this: http://www.gerardgarcia.com/toys/. Now I want to add hyperlinks to the objects. How do I do it? Please let me know. Thank you.

    Gerard

  • Hi,
    LiquidFun CrossBridge port:
    https://github.com/vpmedia/liquidfun/tree/master/liquidfun/crossbridge

    Best Regards!

  • Thomas

    Hi, thanks for your tutorial, it’s super!

    Can you tell me if there’s a list with all the classes and their component parameters explained? It strange that it’s not on the WCK website.