How to Make a Vertical Shooter in AS3 – Part 1

Part 1: Programming the Character

Today, we’re going to make a classic vertical shooter game in ActionScript 3. I hope you learn from it! Let us begin.

The first thing that I’m going to do is make the background of my game black, so it looks more retro. Then, we’re going to have to make the frame rate faster, mine will be 24 fps. Also, this will be a vertical shooter, so we probably should make the playing screen less wide. My new dimensions are at 300×400 pixels.

Next, we’re going to draw a character. Mine will be simple, just a triangle pointing upwards.
My character
The dimensions for it are 30×35 pixels.

Then, we’re going to turn it into a symbol. After that, we’re going to call it mcMain for main character. We will need this so we can reference the guy later. Now we’re ready to code this sucker. Make a new layer called “actions” and add the following code:

//these booleans will check which keys are down
var leftDown:Boolean = false;
var upDown:Boolean = false;
var rightDown:Boolean = false;
var downDown:Boolean = false;
//how fast the character will be able to go
var mainSpeed:int = 5;
 
//adding a listener to mcMain that will move the character
mcMain.addEventListener(Event.ENTER_FRAME, moveChar);
function moveChar(event:Event):void{
	//checking if the key booleans are true then moving
	//the character based on the keys
	if(leftDown){
		mcMain.x -= mainSpeed;
	}
	if(upDown){
		mcMain.y -= mainSpeed;
	}
	if(rightDown){
		mcMain.x += mainSpeed;
	}
	if(downDown){
		mcMain.y += mainSpeed;
	}
	//keeping the main character within bounds
	if(mcMain.x <= 0){
		mcMain.x += mainSpeed;
	}
	if(mcMain.y <= 0){
		mcMain.y += mainSpeed;
	}
	if(mcMain.x >= stage.stageWidth - mcMain.width){
		mcMain.x -= mainSpeed;
	}
	if(mcMain.y >= stage.stageHeight - mcMain.height){
		mcMain.y -= mainSpeed;
	}
}
//this listener will listen for down keystrokes
stage.addEventListener(KeyboardEvent.KEY_DOWN, checkKeysDown);
function checkKeysDown(event:KeyboardEvent):void{
	//making the booleans true based on the keycode
	//WASD Keys or arrow keys
	if(event.keyCode == 37 || event.keyCode == 65){
		leftDown = true;
	}
	if(event.keyCode == 38 || event.keyCode == 87){
		upDown = true;
	}
	if(event.keyCode == 39 || event.keyCode == 68){
		rightDown = true;
	}
	if(event.keyCode == 40 || event.keyCode == 83){
		downDown = true;
	}
}
//this listener will listen for keys being released
stage.addEventListener(KeyboardEvent.KEY_UP, checkKeysUp);
function checkKeysUp(event:KeyboardEvent):void{
	//making the booleans false based on the keycode
	if(event.keyCode == 37 || event.keyCode == 65){
		leftDown = false;
	}
	if(event.keyCode == 38 || event.keyCode == 87){
		upDown = false;
	}
	if(event.keyCode == 39 || event.keyCode == 68){
		rightDown = false;
	}
	if(event.keyCode == 40 || event.keyCode == 83){
		downDown = false;
	}
}

Yes, sometimes with arrow keys, the code does get very repetitive.

Actually, this is all that this part of the tutorial actually requires. Next time, we’ll make the main character shoot!

Spread the Knowledge

  • Print
  • Digg
  • del.icio.us
  • Facebook
  • StumbleUpon
  • Twitter
  • Google Bookmarks
  • Design Float
  • DZone
  • Yahoo! Buzz
  • PDF
  • Reddit
  • RSS
  • Technorati

Preview

Download Source
(Requires Flash CS3 or above)

Subscribe!

Subscribe!
Enter your email address:  

Awesome Tutorials