Saturday, 19 March 2011

Simple shooting game in AS3

In this tutorial you will learn how to create a simple shooting game in Actionscript 3. The objective of the game is to shoot the moving target on the screen. You have three tries to shoot the targets. If you manage to shot three targets without missing them, you win the game. Otherwise you lose the game. I have a used a free stock image of a bottle for the moving targets, but an image will work.


Simple shooting game in AS3


Step 1

Open a new AS3 file with the stage dimensions 500 x 120 and import an image on the stage by pressing File > Import > Import to stage. I have used an image of a beer bottle, but you can use any image. Convert the image into a movie clip (F8) and check the ‘Export for Actionscript’ button and give the identifier: Bottle. Once you have created the movie clip delete it from the stage.


Step 2

On the menu bar select Insert > New symbol select the type movie clip and give the name: shots and check the Export for Actionscript and give the identifier: Shots then click ok. In this movie clip you will create the bullets for the game, so in the first frame create three bullets. You can either create the bullets using the shape tools or import an image of a bullet. Then in the second frame remove one of the bullets. Again in the third frame remove another bullet. And finally in the fourth frame remove the last bullet. Insert a new layer on timeline call Actions and then open the Actions panel and add a stop() method. Now return to the main timeline.



Step 3

Again on the menu bar select Insert > New symbol select the type movie clip and give the name: endBox and check the Export for Actionscript and give the identifier: EndBox. This movie clip will display a message if you have won or lost the game. In the first frame create a rectangle shape with the text ‘You win’. And in the second frame create a rectangle shape with text ‘You lose’. Insert a new layer call Actions and then open the Actions panel and add a stop() method. Now return to the main timeline.


Step 4

Open a new Actionscript 3 class file and save it with the name: Shoot. Then add the following code below. Make sure you add ‘Shoot’ to the document class.
package{
 
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.events.Event;

public class Shoot extends MovieClip {

private var bottleArray:Array = new Array();
private var numOfBottle:uint = 9;
private var bottleHit:uint = 0;
private var hits:uint = 6;
private var bottle:Bottle;
private var shots:Shots;
private var endBox:EndBox;
private var bg:Sprite;

 
public function Shoot() {
   
   stage.addEventListener(Event.ENTER_FRAME, enterHandler);
   
   //Adds the bottles onto the stage.
   for (var i:int = 0; i < numOfBottle; i++) {
    bottle = new Bottle();
    bottle.x = 0 + (i * 60);
    bottle.y = 14.35;
    bottle.addEventListener(MouseEvent.CLICK, clickHandler);
    addChild(bottle);
    bottleArray.push(bottle);
   }
   
   //Adds a invisibe background to detect when the targets have been missed.
   bg = new Sprite();
   bg.graphics.beginFill(0x000000,0);
   bg.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
   bg.graphics.endFill();
   addChildAt(bg,0);
   bg.addEventListener(MouseEvent.CLICK, checkShots);
   
   //Adds the number shot left to stage. 
   shots = new Shots();
   shots.x = 434.85;
   shots.y = 95.75;
   addChild(shots);
   
   endBox = new EndBox();
   addChild(endBox);
   endBox.x = 148;
   endBox.y = 32;
   endBox.visible = false;
   
  }
  
  
  //This function moves the all the bottles in the array four pixels to the 
  //right at the current frame rate. If a bottle goes passed the stage 
  //width, it will get re-added a bottle width before the start of the stage.
  private function enterHandler(e:Event):void{
   for (var j:uint = 0; j <  bottleArray.length; j++) {
    bottleArray[j].x +=  1;

    if (bottleArray[j].x > stage.stageWidth + bottleArray[j].width) {
     bottleArray[j].x = 0 - bottleArray[j].width;
    }
   }
  }
  
  
  //This removes the bottle from the stage, the event listener and 
  //removes it from the array if it has been clicked. 
  private function clickHandler(e:MouseEvent):void {
   var index:uint = bottleArray.indexOf(e.currentTarget);
   var target:MovieClip = e.currentTarget as MovieClip;

   target.removeEventListener(MouseEvent.CLICK, clickHandler);
   removeChild(target);
   bottleArray.splice(index, 1);

   checkShots();
  }
  
  
  private function checkShots(e:MouseEvent = null):void{
   //This increments the bottleHit counter by one and goes to 
   //the next frame in shots movie clip.
   bottleHit++;
   shots.gotoAndStop(shots.currentFrame + 1);

  
   //If there are no more shot available and array length is six then you win. 
   if (shots.currentFrame == shots.totalFrames && bottleArray.length == hits) {
    removeObject();
    endBox.visible = true;
    endBox.gotoAndStop(1);
   }
   //If there are no more shot available you lose.
   else if (shots.currentFrame == shots.totalFrames) {
    removeObject();
    endBox.visible = true;
    endBox.gotoAndStop(2);
   }
  }
  
  //This removes the event listeners
  private function removeObject():void{
   stage.removeEventListener(Event.ENTER_FRAME, enterHandler);
   bg.removeEventListener(MouseEvent.CLICK, checkShots);

   for (var i:int = 0; i < bottleArray.length; i++){
    bottleArray[i].removeEventListener(MouseEvent.CLICK, clickHandler);
   }
  }
 }
}



Step 5

Test your movie Ctrl + Enter



You can download the source files here.

0 comments:

  COPYRIGHT © 2011 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP