Step by step wck quick start guide

Create 4 Walls and a Box in Flash CS4

Setting up the Project: Creating the files

• Open Flash CS4.
• File→ New → Flash File (Actionscript 3.0)
• File → Save As
• Create new folder for project
• Save .fla file
• (In Windows Explorer)
  Create a new folder in project folder called wck-lib
• copy the following WCK folders into wck-lib: Box2D, Box2DAS, extras, gravity, misc, shapes, wck

Setting up the Project: Project Settings

• Switch back to Flash IDE
• File → Publish Settings → Flash
• Check Export SWC
• Actionscript 3.0 Settings
• Add ./wck-lib to the Source path
• Document class: wck.WCK
• Check definition found for the wck.WCK class
• Add ./wck-lib/Box2DAS/Box2D.swc to Library path.
• Click OK to close AS3 Settings dialog
• Click OK Publish Settings dialog

Creating our World: Creating a Physics-Affected Box

• Select Rectangle Tool
• Draw a rectangle on the stage (approx. 100px by 100px)
• Select the rectangle we just drew
• Convert to symbol (F8)
• Change Symbol name to MyRectangle
• Change registration to centre (Important for physics to be generated correctly)
• Check Export for ActionScript
• Change Base class to shapes.Box
• Check definition found for the shapes.Box class (Success!)
• Click Ok to close Convert to Symbol dialog
• Close warning for no class found on MyRectangle
• Right Click on MyRectangle in the library and select ‘Component Definition’
• Change class to wck.BodyShape
• Click OK to close Component Definition dialog

Creating our World: Creating the World Instance

• Select the MyRectangle instance on the stage (the one we drew)
• Convert to symbol (F8)
• Change Symbol name to MyWorld
• Ensure Registration is centered
• Check Export for ActionScript
• Change Base class to wck.World
• Check definition found for the wck.World class (Success!)
• Click Ok to close Convert to Symbol dialog

Creating our World: Creating 4 Walls and a Box

• Edit our new MyWorld instance by double clicking on it.
• We’re going to make the world boundary now. Resize the MyRectangle to act as a floor, eg it’s as wide as the stage, and 40px tall & move to the bottom of the stage.
• Open Component Inspector (Shift-F7)
• Change ‘Type’ to ‘Static’ (right down the bottom of the list)
• Copy your floor to create walls and a ceiling now, doesn’t matter if they overlap.
• Drag a new ‘MyRectangle’ from the Library to the stage

Experiencing our World:

• Save
• Test Movie

And if everything went AOK, you should have a draggable, physics-affected box inside 4 walls!