Posts Mentioning RSS Toggle Comment Threads | Keyboard Shortcuts

  • Shiki 9:40 pm on September 23, 2009 Permalink | Reply
    Tags: , box2d, , ,   

    Creating custom Box2D shape components in PushButton Engine 

    If you ever need to use other ways of creating Box2D shapes that are not currently available in PushButton Engine, you can simply make one yourself. You’ll just need to create a subclass of CollisionShape and use it just like the PBE shape classes.

    Here’s a sample class we use to create an oriented box shape:

    package cavalcade.box2D
    {
        import Box2D.Collision.Shapes.b2PolygonDef;
        import Box2D.Collision.Shapes.b2ShapeDef;
        import Box2D.Common.Math.b2Vec2;
       
        import com.pblabs.box2D.CollisionShape;
       
        import flash.geom.Point;

        public class OrientedBoxCollisionShape extends CollisionShape
        {
            public var halfWidth:Number = 0.5;
            public var halfHeight:Number = 0.5;
            public var center:Point = new Point();
            public var angle:Number = 0;
           
            public function OrientedBoxCollisionShape()
            {
                super();
            }
           
            override protected function doCreateShape():b2ShapeDef
            {
                var scale:Number = _parent.manager.inverseScale;            
               
                var shape:b2PolygonDef = new b2PolygonDef();
                shape.SetAsOrientedBox(halfWidth * scale * _parent.size.x, halfHeight * scale * _parent.size.y, b2Vec2.Make(center.x, center.y), angle);            
                return shape;
            }
        }
    }

    As you can see, the class inherits from CollisionShape and overrides the doCreateShape method in order to create the actual Box2D oriented box shape from there. Use it in the level files like this:

    <component type="com.pblabs.box2D.Box2DSpatialComponent" name="Cart">
        <collidesWithTypes childType="String">
            <_0>Platform</_0>
        </collidesWithTypes>

        <collisionShapes childType="com.pblabs.box2D.CollisionShape">
            <_0 type="cavalcade.box2D.OrientedBoxCollisionShape">
                <halfWidth>0.42</halfWidth>
                <halfHeight>0.12</halfHeight>
                <density>50</density> <!-- you can still use the same properties in CollisionShape -->
                <friction>2</friction>
                <restitution>0</restitution>
                <angle>3</angle> <!-- specify an angle of rotation -->
                <center> <!-- you can override the location of the box so it won't be positioned somewhere other than the center of the entity -->
                  <x>1</x>
            <y>-0.5</y>
          </center>
            </_0>                
        </collisionShapes>
        <collisionType childType="String">
            <_0>Renderable</_0>
        </collisionType>
        <manager componentReference="SpatialDB" />
            <position type="">
                <x>0</x>
                <y>110</y>
            </position>
            <size type="">
                <x>60</x>
                <y>45</y>
            </size>
    </component>
     
  • Shiki 1:11 am on September 16, 2009 Permalink | Reply
    Tags: , , , movieclip, , swf   

    Experiment: Using SWF MovieClips in PushButton Engine 

    Important: This tutorial is now deprecated due to the new and awesome, fully rewritten, rendering components. You can see some discussions about it here.

    I’ve been working with PushButton Engine for a short while now but last night was actually the first time I tried integrating/using a MovieClip from a SWF into PBE. Unfortunately, there are no documentations on how do this at the moment. The examples mostly use images (pngs). I won’t b*tch about it because that is totally understandable. The PBE team are working their a**es off to get to 1.0 and the documentation is the least of their worries. I could at least thank them for doing such a good job — PBE’s a well thought-out framework, everything I learned from it made a lot of sense.

    Anyway, what I wanted to do was simply to put my MovieClip in a SWF library into the stage. I am using FlexBuilder 3 + the latest PBE code from the SVN. I somehow got some ideas on how to do this when I was hanging out at the #pbengine IRC channel. And I did a lot of digging on the PBE code and did lots of experiments to try to understand how to use them. There are 2 different components we can use:

    • com.pblabs.rendering2D.SWFSpriteSheetComponent. This one actually had a class description: “A class that is similar to the SpriteSheetComponent except the frames are loaded by rasterizing a MovieClip rather than a single image”. Assuming you’ve gone through the PBE examples, I think this means that instead of creating the frames from a sprite sheet image and have it used by SpriteRenderComponent, you’ll be getting your frames from a loaded MovieClip instead. Nevertheless, this isn’t what I was aiming for.
    • com.pblabs.rendering2D.SWFRenderComponent. This component somehow works like SpriteRenderComponent, only it uses MovieClips. A little code investigation later, looks like this component will need to be subclassed in order for it to work. From that subclass, you can do what you want to do with your movieclip  using a protected _clip variable.

    Since I still wanted control over a movieclip, I used SWFRenderComponent. I’ll explain below how I did it. Please do note that I am still a novice with PBE (and Flex for that matter) so the method I used might not be good practice. (More …)

     
    • Ben Garney 10:43 am on September 17, 2009 Permalink

      Hey Shiki,

      Awesome post! I’d love to work with you to do a followup showing some improvements on how you did things here. Interested? Shoot me an e-mail or hit me up on IRC. :)

      Ben

    • Shiki 5:20 pm on September 18, 2009 Permalink

      Thanks! Sure thing Ben. I’ll talk to you soon on IRC.

    • Cubny 5:29 am on October 17, 2009 Permalink

      thanks :)

    • Dimid 6:00 am on November 15, 2009 Permalink

      Hi. Properties and with SWFRenderComponent don’t work. I too tried its. I think this component is not ready yet for using

    • Dimid 6:03 am on November 15, 2009 Permalink

      Properties…sizeReference and rotationReference….

    • Shiki 7:43 am on November 15, 2009 Permalink

      Hey Dimid, thanks for the comment. This tutorial however can no longer be used with the latest PBE code. They did a full rewrite of the rendering components and these properties should work now. See here: http://pushbuttonengine.com/forum/viewtopic.php?f=5&t=353

c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
l
go to login
h
show/hide help
esc
cancel