PBE Series: clickable component

Prerequisites:

• Use a current version of PushButton Engine.
• A properly initialized scene (see PBE Series: initializing your scene via ActionScript on how to setup it up)

Today I will show you, how to create a component for PushButton Engine, that registers, if an entity got clicked on or not.

In general, you got two possibilities how to handle this:

1. per object level
2. on a global level

Per object level: since it’s flash, you can simply add an event listener to your graphics component, which listens to click events.

I personally don’t like that too much though, so let’s consider variant two: global level.

It’s a component which exists once in the scene, and not per entity. It listens to click events which happen on the main stage, and on each click, it uses the built in functions PBE.scene.getRenderersUnderPoint and/or PBE.spatialManager.getObjectsUnderPoint to determine, which objects got clicked on.

This version only uses the getRenderersUnderPoint, the main stuff is going on in the OnClick method:

package
{
   import com.pblabs.engine.PBE;
   import com.pblabs.engine.debug.Logger;
   import com.pblabs.engine.entity.EntityComponent;
   import com.pblabs.rendering2D.DisplayObjectRenderer;
 
   import flash.events.MouseEvent;
   import flash.geom.Point;
 
	public class ClickComponent extends EntityComponent
	{
		protected override function onAdd():void
		{
			PBE.mainStage.addEventListener(MouseEvent.CLICK, OnClick );
		}
 
		private function OnClick(e:MouseEvent):void
		{
			var results:Array = new Array();
			var point:Point = new Point( PBE.mainStage.mouseX, PBE.mainStage.mouseY );
			var foundRenderers:Boolean = PBE.scene.getRenderersUnderPoint( point, results );
 
			for each( var obj:DisplayObjectRenderer in  results )
			{
				Logger.print( this, obj.name );
			}
		}	  
 
		protected override function onRemove():void
		{
			PBE.mainStage.removeEventListener(MouseEvent.CLICK, OnClick );
		}
	}
}

Now if you want to get the spatial objects, simply use this:

var spatials:Array = new Array();
PBE.spatialManager.getObjectsUnderPoint( PBE.scene.transformScreenToWorld(point), spatials, new ObjectType("Renderable"));
 
for each( var spatialObj:ISpatialObject2D in spatials )
{
	Logger.print( this, spatialObj.position.toString() );
}

The main difference is that getRenderersUnderPoint results in DisplayObjectRenderers, and getObjectsUnderPoint results in ISpatialObject2Ds.

Also, see that you can supply an object mask. Leaving it null will take all objects into consideration.

All in all you can see, how easy this is (for such a complex sounding task)!

• Previous Entry: Merry Hack-mas :/
• Next Entry: Level Master 2000 goes Qt