Creation of a platform game with Flash - step 2

Posted by Emanuele Feronato on 11/3/07 in Flash, Game design

This is a quick update to the tutorial/engine started with Creation of a platform game with Flash - step 1.

I fixed some bugs and added a ladder object (the one defined in the array with "2" and painted in light purple).

Use arrows to move and space to jump.

I won't explain the script line by line at the moment because I want to add more features before writing a complete tutorial.

But the source code is someway commented

PLAIN TEXT
ACTIONSCRIPT:
  1. // player default speeds
  2. xspeed = 0;
  3. yspeed = 0;
  4. max_yspeed = 10;
  5. walk_speed = 4;
  6. climb_speed = 2;
  7. // am I climbing?
  8. climbing = false;
  9. // am I jumping?
  10. jumping = false;
  11. // can I jump?
  12. can_jump = true;
  13. // gravity & jump settings
  14. gravity = 1;
  15. jump_power = 10;
  16. walking_while_jumping = true;
  17. // level creation
  18. level = new Array();
  19. _root.createEmptyMovieClip("lev",_root.getNextHighestDepth());
  20. _root.createEmptyMovieClip("lad",_root.getNextHighestDepth());
  21. level[0] = new Array(1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1);
  22. level[1] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1);
  23. level[2] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1);
  24. level[3] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1);
  25. level[4] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1);
  26. level[5] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 0, 0, 1);
  27. level[6] = new Array(1, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 1, 1, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  28. level[7] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  29. level[8] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  30. level[9] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  31. level[10] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  32. level[11] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 2, 1, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  33. level[12] = new Array(1, 0, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 2, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1);
  34. level[13] = new Array(1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1);
  35. level[14] = new Array(1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1);
  36. for (y=0; y<=14; y++) {
  37.     for (x=0; x<=24; x++) {
  38.         if (level[y][x] == 1) {
  39.             place_brick = lev.attachMovie("block", "block_"+lev.getNextHighestDepth(), lev.getNextHighestDepth(), {_x:x*20+10, _y:y*20+10});
  40.             place_brick.gotoAndStop(level[y][x]);
  41.         }
  42.         if (level[y][x] == 2) {
  43.             place_brick = lad.attachMovie("block", "block_"+lad.getNextHighestDepth(), lad.getNextHighestDepth(), {_x:x*20+10, _y:y*20+10});
  44.             place_brick.gotoAndStop(level[y][x]);
  45.         }
  46.     }
  47. }
  48. _root.attachMovie("player","player",_root.getNextHighestDepth(),{_x:40, _y:40});
  49. // end of level creation
  50. player.onEnterFrame = function() {
  51.     if (Key.isDown(Key.LEFT)) {
  52.         if (climbing) {
  53.             xspeed = -climb_speed;
  54.         }
  55.         else {
  56.             if (walking_while_jumping or can_jump) {
  57.                 xspeed = -walk_speed;
  58.             }
  59.         }
  60.     }
  61.     if (Key.isDown(Key.RIGHT)) {
  62.         if (climbing) {
  63.             xspeed = climb_speed;
  64.         }
  65.         else {
  66.             if (walking_while_jumping or can_jump) {
  67.                 xspeed = walk_speed;
  68.             }
  69.         }
  70.     }
  71.     if (!feet_on_ladder()) {
  72.         climbing = false;
  73.     }
  74.     if (Key.isDown(Key.UP)) {
  75.         if (feet_on_ladder()) {
  76.             yspeed = -climb_speed;
  77.             climbing = true;
  78.             jumping = false;
  79.         }
  80.     }
  81.     if (Key.isDown(Key.DOWN)) {
  82.         if (feet_on_ladder() or ladder_under_my_feet()) {
  83.             yspeed = climb_speed;
  84.             climbing = true;
  85.             jumping = false;
  86.         }
  87.     }
  88.     if ((Key.isDown(Key.SPACE)) and can_jump and !jumping and !climbing) {
  89.         yspeed -= jump_power;
  90.         jumping = true;
  91.     }
  92.     // adjusting y speed           
  93.     if (!climbing) {
  94.         yspeed += gravity;
  95.     }
  96.     if (yspeed>max_yspeed) {
  97.         yspeed = max_yspeed;
  98.     }
  99.     if (level_under_my_feet() and !jumping and !climbing) {
  100.         yspeed = 0;
  101.     }
  102.     if (ladder_under_my_feet() and !jumping and !climbing) {
  103.         yspeed = 0;
  104.     }
  105.     forecast_x = this._x+xspeed;
  106.     forecast_y = this._y+yspeed;
  107.     // floor control
  108.     while (_root.lev.hitTest(forecast_x, forecast_y+this._height/2-1, true)) {
  109.         forecast_y--;
  110.         xspeed = 0;
  111.         yspeed = 0;
  112.         jumping = false;
  113.     }
  114.     // ceiling control
  115.     while (_root.lev.hitTest(forecast_x, forecast_y-this._height/2, true)) {
  116.         forecast_y++;
  117.         yspeed = 0;
  118.     }
  119.     // left wall control
  120.     while (_root.lev.hitTest(forecast_x-this._width/2+1, forecast_y, true)) {
  121.         forecast_x++;
  122.         xspeed = 0;
  123.     }
  124.     // right wall control
  125.     while (_root.lev.hitTest(forecast_x+this._width/2, forecast_y, true)) {
  126.         forecast_x--;
  127.         xspeed = 0;
  128.     }
  129.     this._x = forecast_x;
  130.     this._y = forecast_y;
  131.     // adjusting speeds for next frame
  132.     xspeed = 0;
  133.     if (climbing) {
  134.         yspeed = 0;
  135.     }
  136.  
  137. };
  138. function feet_on_ladder() {
  139.     return _root.lad.hitTest(player._x, player._y+player._height/2-1, true);
  140. }
  141. function level_under_my_feet() {
  142.     return _root.lev.hitTest(player._x, player._y+player._height/2, true);
  143. }
  144. function ladder_under_my_feet() {
  145.     return _root.lad.hitTest(player._x, player._y+player._height/2, true);
  146. }

This is the result you will get:

And this is the source code to download.

If you liked this post buy me a beer (or two)

» Flash Templates provided by Template Monster are pre-made web design products developed using Flash technology.
They can be easily customized to meet the unique requirements of your project.

del.icio.us tag this | permalink | trackback url

24 Comment(s)

  1. lewis | Nov 3, 2007 | Reply

    cool man…i dont understand how to make side scrolling games please help!

  2. Kevin | Nov 3, 2007 | Reply

    Your tutorials are so awesome! thanks

    I’m also hoping that you do a side scrolling tutorial.

  3. Marcus Andersson | Nov 3, 2007 | Reply

    Wow!
    I gave up on making games in Flash a couple of years ago. Too bad this tutorial wasn’t around then (maybe it was and I didn’t see it?).
    Great job!

  4. LaRue | Nov 3, 2007 | Reply

    Instead of moving the man on the x-axis, only let him move on the y-axis(to jump). And make the background move. So if you press the left arrow key, make the background move right.

  5. chaew | Nov 3, 2007 | Reply

    this is great - with the ladders and everything but do you think you could do a similar tutorial but for an art-based scroller? Im currently developing a platform game (actually with the intention of publishing it on mochiads ;p) cheers

  6. RJ | Nov 3, 2007 | Reply

    Simply fantastic

  7. Tony | Nov 3, 2007 | Reply

    How’s the monetizing experiment going?
    I’m impatient to know it

    Keep up with this great work!

  8. Emanuele Feronato | Nov 3, 2007 | Reply

    Marcus: you couldn’t see it a couple of years ago because I posted it today :)
    But you can resume your skills and start programming again :)))

    Tony: I’ll write about it on Sunday (Italy time GMT+1), a week after I released the game

    About side scrolling: it’s an option I will inclue in future tutorials.

  9. sam | Nov 4, 2007 | Reply

    side scrolling would be easy. You can just make him move by 5 when you hit right AND make the whole scene move right. making boundaries and such too.i think new grounds has a tutorial thread full of lots of things about this. its called as: main i think. nice tuts Eman. Keep it up…

  10. Alejandro | Nov 5, 2007 | Reply

    Is there any reason about to fill the array in the explicit way?
    Why don’t you use just

    level = [[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 1, 1, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 2, 1, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 1, 1, 1, 0, 0, 0, 2, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 1],[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]]

    In this way is easy to create a simple code to create levels and add a trace ouput to replace the level. I hope it helps with something
    Great tutorials!

  11. Sam | Nov 11, 2007 | Reply

    Will there be a third part to this tutorial? Perhaps one showing how to change the character from a block to better image…

  12. LonestarComics | Nov 13, 2007 | Reply

    Is there a way to use XML data to load the level instead of arrays?

    This is the best Platformer tutorial I’ve found for Flash, keep up the great work and I can’t wait for part three!

  13. Emanuele Feronato | Nov 14, 2007 | Reply

    Sure, I wrote a tutorial about it on this blog.
    Search for “XML”

  14. Teal | Nov 14, 2007 | Reply

    This s great stuff. I’ve already started working on a new platform game using these tutorials, and it’s looking good.

  15. Strid | Nov 16, 2007 | Reply

    Really nice

    would like to see a tutorial on angular collision and “loops” though

  16. Michael | Nov 17, 2007 | Reply

    Hey, I am having trouble getting the ladder to work, I have copied the tutorial exactly, I just made the stage bigger. The thing that is wrong is that when I go to climb the ladder it just doesn’t let me pass through it and is treating it like it is part of the ground rather than the ladder. Any ideas on what is wrong?

  17. Randomguy | Dec 20, 2007 | Reply

    I got a way to avoid jumping in mid-air if you walked off a platform. just make sure that when space is down the guy is touching the floor. otherwise, he can jump in midair because his jumping is not set to true. this also removes the need for the can_jump and jumping variables.

  18. Pandz | Feb 16, 2008 | Reply

    How do we add enemys? I’ve tried myself but its no t going that great… I’d really appreciate some help with this.

  19. Zenn | Mar 4, 2008 | Reply

    I would love to see this tutorial continued on to adding enemies, coins, getting you character to animate, and more!

  20. kylian | Apr 2, 2008 | Reply

    oh great tutorial but now i dnont now how to create a finnish plz help me

  21. Dan | Apr 28, 2008 | Reply

    this is using actionscript 3.0 right?

  22. stevie | May 8, 2008 | Reply

    no dan u mug

  23. Gecko | Jun 14, 2008 | Reply

    If you jump on the ladder, you will fall through it… Neat platform engine though!

  24. fraser | Jun 29, 2008 | Reply

    how would i make a door to go to the next area ive already made a block for it and added it to the level i just need the code to send me to the next level

1 Trackback(s)

  1. May 13, 2008: Creación de un juego de plataformas (tipo Mario) en Flash « Shift F12

Post a Comment