Home > Advanced ActionScript 3 > Creating a small shooting game

Creating a small shooting game



In this tutorial you will learn how to create a small “shooting stars” game using Flash and ActionScript 3. Let’s get started!

1. Open a new Flash document and save it under “ShootingGame.fla”. Set its size to 500 x 300 pixels.

2. First of all we need to draw the sight of our weapon. So rename the first layer to “sight”. Take the Oval Tool and from the properties panel set its properties to Solid, Disabled Fill, Stroke height should be set to 3.
Then take the Selection tool, select a part of the circle and cut it like this:

The final step is to take the Line tool and to draw a cross. Just change the Stroke height value to 1.5. Select the whole sight and convert it to Movie Clip with instance name “sight” and registration point center.

3. Now our sight is ready and we need to draw a star. Take the PolyStar Tool and set it properties like this:

If your star is ready, select it and convert it to Movie Clip with registration point center. Linkage the star to class Star by going to the Library panel (Ctrl + L), right-clicking the Star movie clip and then setting the class name. Remove the star from the stage.

4. Take the text tool and first create a Static text field and type “Score:”. Then create a dynamic text field with instance name “points_txt” and position it next to the static text field. Embed the Numeral values for the font and for color choose #FF0000. Align the text fields to the bottom right part of the stage.

5. Create a new layer called “actions”, open Actions Panel and type this:


//importing tween classes
import fl.transitions.easing.*;
import fl.transitions.Tween;

//hiding the cursor
Mouse.hide();

//creating a new Star instance
var star:Star = new Star();
//creating the timer
var timer:Timer = new Timer(1000);
//we create variables for random X and Y positions
var randomX:Number;
var randomY:Number;
//variable for the alpha tween effect
var tween:Tween;
//we check if a star instance is already added to the stage
var starAdded:Boolean = false;
//we count the points
var points:int = 0;

//adding event handler on mouse move
stage.addEventListener(MouseEvent.MOUSE_MOVE, cursorMoveHandler);
//adding event handler to the timer
timer.addEventListener(TimerEvent.TIMER, timerHandler);
//starting the timer
timer.start();

function cursorMoveHandler(e:Event):void{
	//sight position matches the mouse position
	sight.x = mouseX;
	sight.y = mouseY;
}

function timerHandler(e:TimerEvent):void{
	//first we need to remove the star from the stage if already added
	if(starAdded){
		removeChild(star);
	}

	//positioning the star on a random position
	randomX = Math.random()*500;
	randomY = Math.random()*300;
	star.x = randomX;
	star.y = randomY;
	//adding the star to the stage
	addChild(star);
	//changing our boolean value to true
	starAdded = true;
	//adding a mouse click handler to the star
	star.addEventListener(MouseEvent.CLICK, clickHandler);
	//animating the star's appearance
	tween = new Tween(star, "alpha", Strong.easeOut, 0, 1, 3, true);
}

function clickHandler(e:Event):void{
	//when we click/shoot a star we increment the points
	points ++;
	//showing the result in the text field
	points_txt.text = points.toString();
}

Here is the final result:

Liked this tutorial? Share and Enjoy:

  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Reddit
  • blogmarks
  • StumbleUpon
  • Technorati
  • TwitThis
  • Yahoo! Buzz
  • NewsVine
  • Slashdot
  1. August 6th, 2009 at 18:57 | #1

    Just have to say that this is a fantastic tutorial, thanks!

  2. September 10th, 2009 at 12:18 | #2

    and a setChildIndex(star,0); would be nice after addChild(star); to put the stars under the target

  3. pathryll
    September 21st, 2009 at 06:20 | #3

    aw!
    i didnt get dis tut,, and i have AS 2 on my flash is dis means i cant do dis?

  4. aphexZero
    September 23rd, 2009 at 15:20 | #4

    @laur
    i tried that, but as soon as i setChildIndex to 0 no event is getting triggert on mouseclick?!

  5. pathryll
    September 23rd, 2009 at 17:58 | #5

    ahh ok dude ill try,,tyvm

  6. Anonymous
    September 23rd, 2009 at 23:34 | #6

    nice tutorial.
    simple and easy to understand.

  7. Anonymous
    September 27th, 2009 at 07:04 | #7

    Just wondering but how would you make the starts don’t disappear so quickly?

  8. admin
    September 27th, 2009 at 14:44 | #8

    @Anonymous

    Just change the Timer value to a bigger number. For example:

    var timer:Timer = new Timer(2000);

  9. Anonymous
    September 27th, 2009 at 15:29 | #9

    thank you very good tutorial

  10. Noobscripter
    September 27th, 2009 at 23:57 | #10

    I am just wondering.. How did you learn script? I mean so you can write in text without looking up tutorials? I am just 14 so i can’t go in any school where i can learn programming yet :(

  11. jantiha
    September 29th, 2009 at 10:50 | #11

    Noobscripter :
    I am just wondering.. How did you learn script? I mean so you can write in text without looking up tutorials? I am just 14 so i can’t go in any school where i can learn programming yet

    from the internet dude :P

  12. Anonymous
    September 29th, 2009 at 15:24 | #12

    how do you make it so the game ends after a certain amount of time like a timer example 60 seconds and then the score is logged into a highscores table allowing you to enter your name and display your score

  13. admin
    September 29th, 2009 at 22:29 | #13

    @Noobscripter
    Well, if you are developing a big project you will always need to check the language reference from time to time. Even if you were a big expert you would not know all of the ActionScript 3 classes, their methods and properties. Just practice every day and it would be much easier for you ;)

    @Anonymous

    This would be an advanced topic.
    The first thing to do is to set a timer with value 60000 ms (1 minute).
    Next, you need to pass the score to a PHP script via the AS3 URLVariables class. You have to insert the result into a database. The last step is to compare the scores (in your PHP script) and pass the best results back to your flash movie.

  14. Noobscripter
    October 1st, 2009 at 17:00 | #14

    Ok thank you :D

  15. Joe
    October 3rd, 2009 at 21:51 | #15

    But if you change the timer the star will stay long enough to be clicked multiple times and increasing the score, how could the code be changed to remove the star after each click? and also how would you make an animated background?

  16. PatrikTG
    October 4th, 2009 at 14:35 | #16

    Has anyone a solution for the setChildIndex problem?

  17. Anonymous
    October 5th, 2009 at 15:30 | #17

    @admin how would i do this like what codes would i need to edit/add into the script to create this because i would really appreciate it if you could teach me how to do this and i would be very greatful

  18. Anonymous
    October 5th, 2009 at 15:32 | #18

    admin :@Noobscripter Well, if you are developing a big project you will always need to check the language reference from time to time. Even if you were a big expert you would not know all of the ActionScript 3 classes, their methods and properties. Just practice every day and it would be much easier for you
    @Anonymous
    This would be an advanced topic.The first thing to do is to set a timer with value 60000 ms (1 minute).Next, you need to pass the score to a PHP script via the AS3 URLVariables class. You have to insert the result into a database. The last step is to compare the scores (in your PHP script) and pass the best results back to your flash movie.

    poat above

  19. October 8th, 2009 at 12:19 | #19

    Hi,

    Is there a way where you could have more than one object? (instead of the star).

    So say, for example, I was to do a game like this for my band website and wanted to have our various faces flashing up instead of the star… how could I do that?

    Thanks
    Dan

  20. Jack
    October 9th, 2009 at 10:39 | #20

    Is Actionscript a freeware? any freeware that can make flash?

Comment pages
1 2 3 4 371
  1. November 17th, 2009 at 00:31 | #1