Making a ‘Copter’ style game – The Projects

Hello – April’s project is here at last!

Nice and simple this time around; we’re going to make a game like ‘Copter’. I’ve covered this in the video but I’ll mention it here too: Copying games can be a nice way to learn, just don’t make a habit of it. If you’re developing something for commercial purposes you’re not going to make any friends by ripping other people off. The people who made the original Copter can’t lay claim the genre, so feel free to do your own thing with it (as Halfbrick have done with ‘Jetpack Joyride’) but make sure it is unique enough to not be considered a clone.

With that out of the way, hop into the video to make something like this:

Video:

Source files:

The video doesn’t cover everything from the sample game above, so there are plenty of extra bits for you to look in to. As a rough guide, the clouds are basically the same as the blocks (without collision) and the steam at the back of the chopper is very similar to the explosion pieces. I used the random hills project as a background and various other little techniques from the Point, Click, Win! tutorial series to do the rest.

Your turn! Show me what you’ve got ;)

Ant

This entry was posted in Flash, Games and tagged , , . Bookmark the permalink.

42 Responses to Making a ‘Copter’ style game – The Projects

  1. avatar Naki says:

    just finished following your tutorial and here is my final result..
    http://naki.x10.mx/myCopter/copter.html

    not quite so good but I have learned a lot of things.. simple mouse x and y, math and simple animation, still waiting for the game menu tutorial just like the one above.
    Thanks! :)

  2. avatar Ant says:

    :) nice job

    You can find most, if not all, of the other bits of my version in my other tutorials. Check the ActionScript tutorials link up top

  3. avatar ico170 says:

    http://www.kongregate.com/games/ico170/super-b

    well here is my version i used most of your tutorials for this

  4. avatar Boopesh says:

    How to make the game replay after a certain amount of time.My result is here:
    http://www.pictogame.com/en/play/game/Yaxdj4BBGiHC_helicopter

    • avatar Ant says:

      You could use a timer (look at some of my other tutorials for that) or simply let the timeline play through a few frames before returning to the menu.

      I put menus and timers in the Point Click Win game, they’re all linked in the ActionScript tutorials page at the top

  5. avatar andrew says:

    great tut, learned a lot. quick question, where did the as go that moves the blocks to the left. Cant seem to find that layer of as in the source files. Just curious what is currently driving the blocks to the left.

    • avatar Ant says:

      Hi, it’s inside the Block object, on its timeline.

      The rest of the code is on the main timeline, which I guess is where you’re looking

      • avatar andrew says:

        Ahh I knew it had to be there, thanks for all the great tuts. I’m still tweeking my chopper game, I added a laser to the chopper and now trying to set up hit detection with the enemy planes. Do you think I need to use the same “getchildat” and the iterator or is there a simpler way? When I tried just hittesting blocks with the laser I got “cannot convert Block$ to flash.display.movieclip. I tried typecasting it but no luck. I hate to bug you but you have a great way of explaining things.

        • avatar Ant says:

          You could just store all your blocks in an Array instead of looping through everything (which gets a bit sluggish if you have a LOT of stuff on screen). Not quite sure why you are getting the casting error! Paste the code responsible and I’ll try to help

  6. avatar andrew says:

    Thanks Ant, your the best. Here’s how I tried to shoehorn it together so far..

    I’m not using the turret class, just the bullet and game classes. I added some as3 into the main game timeline to generate bullets. Here it is in full:

    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.display.MovieClip;
    import flash.display.MovieClip;
    import flash.events.Event;
    import flash.geom.Point;
    import flash.events.MouseEvent;
    import flash.ui.Keyboard;
    import flash.events.KeyboardEvent;

    var mouseIsDown = false;// mouse isn’t held at start
    var speed = 0;// no speed at the start
    var score = 0;// start with no score!

    // check for collisions every frame
    addEventListener(Event.ENTER_FRAME, mainLoop);

    var upPressed:Boolean = false;
    var downPressed:Boolean = false;
    var leftPressed:Boolean = false;
    var rightPressed:Boolean = false;

    player.addEventListener(Event.ENTER_FRAME, fl_MoveInDirectionOfKey);
    stage.addEventListener(KeyboardEvent.KEY_DOWN, fl_SetKeyPressed);
    stage.addEventListener(KeyboardEvent.KEY_UP, fl_UnsetKeyPressed);
    stage.addEventListener(MouseEvent.CLICK, fire);

    // explain the mouse functions
    function fire(event:Event)
    {
    var b = new Bullet();
    parent.addChild(b);
    //set the position and rotation of bullet;
    b.rotation = rotation;
    b.x = player.x + 50;
    b.y = player.y + 15;
    trace(“bullet fired”);

    }

    // explain the main game loop
    function mainLoop(e:Event)
    {
    // update the score!
    score = score + 10;
    // update the text field
    output.text = “Score: ” + score;

    // limit the speed
    if (speed > 10)
    {
    speed = 10;
    }
    if (speed < -10)
    {
    speed = -10;
    }// move the player based on the speed
    player.y += speed;
    // loop through everything on screen
    for (var i = 0; i<numChildren; i++)
    {
    // check to see if this object is a block
    if (getChildAt(i) is Block || getChildAt(i) is Boundary)
    {
    var c = getChildAt(i) as MovieClip;
    // this means the object is a block
    // check the block against the player object
    if (c.hitTestObject(player))
    {
    // make an explosion
    for (var counter = 0; counter<12; counter++)
    {
    // make a new Boom object
    var boom = new Boom();
    boom.x = player.x;
    boom.y = player.y;
    // randomly rotate boom
    boom.rotation = Math.random() * 360;
    // randomly scale it
    boom.scaleX = boom.scaleY = 0.5 + Math.random();
    // add the boom to the world
    addChild(boom);
    }
    // hide the player
    player.visible = false;
    removeEventListener(Event.ENTER_FRAME, mainLoop);
    }
    }
    }

    }

  7. avatar Ant says:

    Hey, after a 2nd read I think you are getting the type error because you’re using Block, the class name, instead of an instance of a Block when you check against your laser. I can’t see that particular part in the code you just pasted though! Drop me an email with it if you can’t fix it based on that

  8. avatar dairon says:

    Hey i try to made it but at the last part something has go’d wrong pleasee help me

    import flash.events.Event;
    import flash.events.MouseEvent;

    var mouseIsDown = false;// mouse isnt held at start
    var speed = 0;// no speed

    // check for collisions every frame
    addEventListener(Event.ENTER_FRAME, mainloop);
    // add 2 event listners for the mouse button
    stage.addEventListener(MouseEvent.MOUSE_DOWN, clicked);
    stage.addEventListener(MouseEvent.MOUSE_UP, unclicked);

    // explain the mouse function
    function clicked(m:MouseEvent)
    {
    mouseIsDown = true;
    }

    function unclicked(m:MouseEvent)
    {
    mouseIsDown = false;
    }

    // explain the main loop
    function mainloop(e:Event)
    {
    // move player based on mouse button
    if (mouseIsDown)
    {
    speed -= 2;// take sum of the speed
    }
    else
    {
    speed += 2;//move down
    }
    //li,it speed
    if (speed > 10)
    {
    speed = 10;
    }
    if (speed < -10)
    {
    speed = -10;
    }//move player based on speed
    player.y += speed;
    // loop trough everything on screen
    for (var i = 0; i<numChildren; i++)
    {
    // check to see if this object is a block
    if (getChildAt(i) is Block)
    {
    var b = getChildAt(i) as Block;
    //this means the object is a block
    // check the block against the player object
    if (b.hitTestObject(player))
    {

    //hide player when die
    player.visible = false;
    removeEventListener(Event.ENTER_FRAME, mainloop);
    }
    }
    }
    }

  9. avatar Ethan says:

    hey, thanks for this video it super helpful and after some minor changes i handed it in and got full marks in my yr10 multimedia class, anyway im looking to expand on it and was wondering if you could add a tutorial just focusing on menus or point me in the way of another tutorial which would help me create a great menu and game over screen.

    • avatar Ethan says:

      i would show you my game but have no idea how to do that (im really new to this)

      • avatar Ant says:

        :)

        You could try a site like fastswf.com for hosting basic SWF files. If it’s a game you want to release to the world you could look at Newgrounds or Kongregate too.

        As for the menu, there’s no real trick or set way to do it – but I have done some bits on it in the Point, Click, Win section of tutorials on this site

  10. avatar Edy says:

    great tut, learned a lot from all of your tutorial but, i seems to have a bit of problem when i tried to follow your instruction but using a different image and i keep getting this error

    1046: Type was not found or was not a compile-time constant: Event.
    and my code is

    import flash.events.Event;

    addEventListener(Event.ENTER_FRAME, loop);

    function loop(e:Event)
    {
    for (var i=0; i<numChildren; i++)
    {
    if (getChildAt (i) is Egg_mc)
    {
    var b = getChildAt as Egg_mc;
    if (b.hitTestPoint(mouseX,mouseY))
    {
    trace("hit");
    }
    }
    }
    }

    if there something that i got wrong

    thanks in advance.

  11. avatar Joke says:

    Here’s my version of the game. I made an Adventure Time fan game!
    Thanks for your awesome tutorials!

    http://www.kongregate.com/games/GRINX/gunters-escape

  12. avatar Surana says:

    Great tutorial! I have a question: When a player crashes either into a boundary or a Block the Blocks still keep on going. The player get’s taken off the screen (invisible) but the Blocks keep on going each frame as it is coded in its own MC class. I’m trying to transition to another screen which takes the user back to the main menu however I do not know how to stop the Blocks from going left to right across the screen and that is always giving me an error when I try and transition to another screen when the player dies. Can you please help! Thanks,

    Shrey

    • avatar Ant says:

      Hi,

      They’re not made in the most efficient way as it’s a newcomer tutorial. To work around it you’ll need to loop through the contents of the screen and remove any blocks. That alone won’t fix it though, as each block’s ENTER_FRAME listener will need to be removed.

      You could have the blocks handle their own listeners when they no longer have a parent object. The code would look a bit like:

      function update(e:Event) {
      	if (!parent) {
      		removeEventListener(Event.ENTER_FRAME, update);
      		return;
      	}
              ... rest of code
      
  13. avatar Gorange says:

    I seem to be getting this error when i go to my “Game Over” scene
    TypeError: Error #1009: Cannot access a property or method of a null object reference.at Block/update()
    the code i use to go to the game over screen is

    if (b.hitTestObject(player)) {
    gotoAndPlay(1,Death);
    }
    The Game still runs fine but i was just londering how i can get rid of the error

    • avatar Ant says:

      The error is because Blocks are still in memory and still have an ENTER_FRAME event listener. You need to make sure they are removed after game over or after the block is removed.

      See my reply to Surana above.

  14. avatar Ren says:

    Hello, sir!!! Thank you for this tutorial. It really helped me a lot.

    I managed to get the game working properly. Just that, I’m having these problems:

    - At the main menu, the blocks are already moving in the screen even if the game haven’t started yet.

    - When my player dies, the blocks still continues to move. I want to at least stop that.

    - When the game is over, it goes to the gameover screen where I made a button for “play again” but when the game plays again, my character becomes invisible.

    Apologies if I’m asking too much. I’m a newbie in Flash, but I learned a lot with the help of your tutorial. Thank you!!!

    • avatar Ant says:

      Hi :)

      You could use a different version of the blocks on your menu screen to avoid the movement.

      There’s no straight forward trick to stop the blocks when you die, it’s simply a logical step you’ll need to code in your blocks or main game code after the player dies.

      I’m not sure about the invisibility bug. Make sure that the layer with your helicopter on doesn’t have a frame/keyframe on your game over screen. That should force it to make a new one when you go back.

      Good luck!

      • avatar Ren says:

        Sir, I followed what you said and I I managed to fix it!!! Yey!!! I just need to improve it now! Thank you for the response!

        More power to you, sir!!! :D

  15. avatar izham says:

    Bro…
    I’ve done download your tutorial. But…, in this tutor, u don’t give trick how to create animation like your inro game and Game Over style like that….??

    How to create animation like that…,
    please tell me…….

    • avatar Ant says:

      Hi, there’s no trick to intro/game over animations, you just make them as you would any animation in Flash. My other tutorials (link at the top of the blog) will help you get started with all of that.

  16. avatar Debbie Coleman says:

    Scene 1, Layer ‘Script’, Frame 1, Line 14 1067: Implicit coercion of a value of type flash.display:MovieClip to an unrelated type Class.
    I tried to change the block to something else and got this error?

    • avatar Ant says:

      Hi, it sounds like you’ve used your new object’s class name (the name of it in the library) rather than the variable or instance name. So, for example, if you had a Plane object in the library:

      var plane:Plane = new Plane();
      plane.x = 10; // This line is ok
      Plane.x = 10; // This line is wrong
      
  17. avatar Charlie says:

    Hi,

    This is my version of the copter just thought you might want to take a look. Thank you very much for the tutorial it helped a lot.

    http://charlieisthebest9.wix.com/adventure-of-sushi

  18. avatar izham says:

    hi bro …
    where’s tutorial to create “TOP Score” and save score like your game….

    i wan’t to save best score, but i don’t know syntax of script…?

  19. avatar Pedro says:

    Ant, I was trying to create a start and game over frames, and use the gotoAndStop() function to take the player to them… However, when the player “arrives” the game frame it just won’t “play”… Just the animations work… how did you do it on your example game?

    I used a timer to wait 2 secs before it drives the player to the game over screen. That is working perfectly… but on the “click to play” screen , when the player clicks, it goes to a kind of “frozen” game frame where nothing works.

    if you want, i uploaded my .fla file:
    http://www.mediafire.com/download/qbd85mp1g6yg2v2/Copter.fla

    Thnx man, nice tutorials you got there xD

Leave a Reply

Your email address will not be published. Required fields are marked *

*


1 × = two

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>