Making a Space Invaders clone with PushButton - Main Menu

PLAY THE DEMO

DOWNLOAD THE SOURCE CODE

RETURN TO THE TUTORIAL INDEX

Although it might not be immediately obvious, state management, like switching from a menu screen to a game level and back again, is not provided by the PushButton XML level loading classes. While you can load a level, it will in fact load all the entities in addition to those that are currently loaded. Clearing currently loaded entities is not a function of the level loading, and so before a new level is loaded you need to manually destroy the existing entities for yourself.

The easiest way to do this is to create a component that listens for a global event to be trigger and destroy the entity to which it belongs in response. The DestroyOnLevelClearComponent does just that. It listens for the level clear event dispatched by the main stage object (a convenient and central object that all components can listen to).

DestroyOnLevelClearComponent.as

public class DestroyOnLevelClearComponent extends EntityComponent
{
 public static const LEVEL_CLEAR:String = "LevelClear";
 
 public function DestroyOnLevelClearComponent()
 {
  super();
 }
 
 protected override function onAdd():void
 {
  super.onAdd();
  Global.mainStage.addEventListener(LEVEL_CLEAR, levelClear);
 }
 
 protected override function onRemove():void
 {
  super.onRemove();
  Global.mainStage.removeEventListener(LEVEL_CLEAR, levelClear);
 }
 
 protected function levelClear(event:Event):void
 {
  owner.destroy();
 }
 
}

Now all entities created in the course of the level, either loaded directly from an XML declaration or created at runtime, get the new DestroyOnLevelClearComponent component.

Code

The SwitchLevelComponent is used to dispatch the level clear event, and then request that a new level be loaded by the LevelManager. We have used the keyboard events, as opposed to checking to see if a key has been pressed every frame, to ensure that the level clearing and loading  process is done once.

SwitchLevelComponent.as

public class SwitchLevelComponent extends EntityComponent
{
 public var level:int = -1;
 
 public function SwitchLevelComponent()
 {
  super();
 }
 
 protected override function onAdd():void
 {
  super.onAdd();
  Global.mainStage.addEventListener(KeyboardEvent.KEY_UP, keyUp);
 }
 
 protected override function onRemove():void
 {
  super.onRemove();
  Global.mainStage.removeEventListener(KeyboardEvent.KEY_UP, keyUp);
 }
 
 protected function keyUp(event:KeyboardEvent):void
 {
  if (event.keyCode == Keyboard.SPACE)
  {
   Global.mainStage.dispatchEvent(new Event(DestroyOnLevelClearComponent.LEVEL_CLEAR));
   LevelManager.instance.loadLevel(level);
  }
 } 
}

Two new templates are created that display an image on the screen. The first displays a “game over” message, while the second display a “start game” message. Both use the SwitchLevelComponent to switch between the main menu level (level 0) and the game level (level 1).

Code

The player entity gets a new DeathHandlerComponent that will display the game over message when it dies.

Code

The EnemyControllerComponent will also create the game over entity when the bottom enemy reaches the bottom of the screen.

EnemyControllerComponent.as

public override function onTick(tickRate:Number):void
{
 // ...
 
 if (this === bottomEnemy && 
  position.y > screenHeight - screenBuffer &&
  !gameOverTriggered)
 {
  TemplateManager.instance.instantiateEntity("GameOver");
  gameOverTriggered = true;
 }
}

The new main menu level is created in a file called level0.xml. This follows the same format as the level1.xml file, and it creates a single main menu entity that can be used to reload the game level (level 1).

Code