Flash prototype: walking on disappearing tiles

November 26, 2006 by Emanuele Feronato
Filed Under Flash • 19 Comments 

I remember an old c64 game (and some flash and javascript remakes) where you had to walk over all tiles in a stage, never walking on the same tile twice, because as you leave a tile, it disappears.

In this far-from-being-finished prototype, I took some pieces of code I found in a tutorial published on gotoandplay and coded this prototype.

Try to walk over all tiles, without falling down.

Cursor keys to move.

The whole actionscript is on the 1st frame

PLAIN TEXT
ACTIONSCRIPT:
  1. map = new Array();
  2. generateMap();
  3. drawIt(map);
  4. _root.attachMovie("item", "sprite", 10000);
  5. sprite._x = 40;
  6. sprite._y = 40;
  7. sprite.px = 2;
  8. sprite.py = 2;
  9. sprite.speed = 2;
  10. sprite.steps = (20/sprite.speed);
  11. sprite.moving = false;
  12. sprite.count = 0;
  13. sprite.dead = 0;
  14. sprite.onEnterFrame = function() {
  15.     if (!this.dead) {
  16.         if (!this.moving) {
  17.             actual_tile = this.px+(this.py*7);
  18.         }
  19.         if ((Key.isDown(Key.LEFT)) && (!this.moving)) {
  20.             this.px--;
  21.             dir = "left";
  22.             this.moving = true;
  23.         }
  24.         if ((Key.isDown(Key.RIGHT)) && (!this.moving)) {
  25.             this.px++;
  26.             dir = "right";
  27.             this.moving = true;
  28.         } else if ((Key.isDown(Key.UP)) && (!this.moving)) {
  29.             this.py--;
  30.             dir = "up";
  31.             this.moving = true;
  32.         } else if ((Key.isDown(Key.DOWN)) && (!this.moving)) {
  33.             this.py++;
  34.             dir = "down";
  35.             this.moving = true;
  36.         }
  37.         if (this.moving) {
  38.             _root["tile_"+actual_tile]._alpha -= (100/sprite.steps);
  39.             trace(actual_tile+"-"+actual_tile%7+"-"+int(actual_tile/7));
  40.             map[actual_tile%7][int(actual_tile/7)] = 0;
  41.             if (this.count>=this.steps) {
  42.                 this.moving = false;
  43.                 this.count = 0;
  44.             } else {
  45.                 switch (dir) {
  46.                 case "left" :
  47.                     this._x -= this.speed;
  48.                     break;
  49.                 case "right" :
  50.                     this._x += this.speed;
  51.                     break;
  52.                 case "up" :
  53.                     this._y -= this.speed;
  54.                     break;
  55.                 case "down" :
  56.                     this._y += this.speed;
  57.                     break;
  58.                 }
  59.                 this.count++;
  60.             }
  61.         }
  62.         if (!this.moving) {
  63.             valore = map[this.px][this.py];
  64.             if (valore == 0) {
  65.                 this.dead = 1;
  66.             }
  67.         }
  68.     }
  69.     if (this.dead) {
  70.         this._alpha--;
  71.         if (this._alpha<0) {
  72.             this.dead = 0;
  73.             this._x = 40;
  74.             this._y = 40;
  75.             this.px = 2;
  76.             this.py = 2;
  77.             this._alpha = 100;
  78.             generateMap();
  79.             drawIt(map);
  80.         }
  81.     }
  82. };
  83. function drawIt(theMap) {
  84.     for (var y = 0; y<7; y++) {
  85.         for (var x = 0; x<7; x++) {
  86.             pos = x+(y*7);
  87.             if (theMap[x][y] == 1) {
  88.                 _root.attachMovie("myTile", "tile_"+pos, pos);
  89.                 _root["tile_"+pos]._x = x*20;
  90.                 _root["tile_"+pos]._y = y*20;
  91.             }
  92.         }
  93.     }
  94. }
  95. function generateMap() {
  96.     map[0] = new Array(0, 0, 0, 0, 0, 0, 0);
  97.     map[1] = new Array(0, 1, 1, 1, 1, 1, 0);
  98.     map[2] = new Array(0, 1, 1, 1, 1, 1, 0);
  99.     map[3] = new Array(0, 1, 1, 1, 1, 1, 0);
  100.     map[4] = new Array(0, 1, 1, 1, 1, 1, 0);
  101.     map[5] = new Array(0, 1, 1, 1, 1, 1, 0);
  102.     map[6] = new Array(0, 0, 0, 0, 0, 0, 0);
  103. }

Some comments to the code:

Lines 95-103 (yes, it's better to begin from the end): I define the map, in this case a 7*7 array. "1" means there is a tile on the floor, "0" means there is no floor, and you will fall down if you step over it.

Lines 83-94: Time to draw the map, attaching the same movieclip (a 20*20 red square) when I find a "1" in the map array.

Lines 1-13: Initializing the game and creating some variables, most of all about the main sprite (the 20*20 green square, the sprite you control)

Lines 15-36: Checking if an arrow key is pressed and if the sprite was already moving, then calculating new sprite's position according to the key pressed.

Lines 37-61: Routine that moves the main sprite and makes the floor disappear behind it

Lines 62-67: Checking if the sprite is on a tile or not

Lines 69-80: If the sprite is dead, because he has not floor under its feet, re-initialize the game and start again.

That's all at the moment, download the source code and give me feedback while I unleash some more ideas...

Rate this post: 1 Star2 Stars3 Stars4 Stars5 Stars (2 votes, average: 4.5 out of 5)
Loading ... Loading ...
If you found this post useful, please consider a small donation.
» 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.

19 Responses to “Flash prototype: walking on disappearing tiles”

  1. Joe on December 17th, 2006 9:50 pm

    This is great and all.
    But, I was wondering, would there be a way to make more levels with like bigger maps and such?

  2. Krut @ Joe on December 18th, 2006 3:29 am

    Joe, one way could be to make some squares black, being impassable, getting more and more. You’d have to be creative to make them successful and/or hard.

  3. Mousey on December 18th, 2006 3:24 pm

    Will there be another tutorial on how to add more levels as i’m new to action script?

    and i think the tutorial i fab !

    thanks Mousey

  4. Emanuele Feronato on December 18th, 2006 5:10 pm

    Sure it will!!!!

  5. eblup on December 23rd, 2006 10:44 am

    ??????????????????????????

    do you put this in a flash file or no is it a move clip do you need to draw anything explain it geesis christ u moreon

  6. chris on December 29th, 2006 12:37 pm

    i don’t get what you have to do.
    i put the code in actions for the first frame and when i test movie nothing happens.

  7. Mousey on January 3rd, 2007 6:18 pm

    Its simple to make although i noticed its not all said it the tutorial,

    First create a new document in flash with the dimentions:
    140 by 140 and frame rate set to 40fps

    Second you need 2 create 2 movie clips

    one called my tile, make this a red square approx 19px by 19px. then in the library right click it and press export for action script, with the identifer set to my tile.

    The next movie clip is called item make this the same as before but make it another colour (e.g. green) and when you set up the linkage set the identifer to item.

    Last add the action script to the frame and it should work!

  8. omgwdfbbq on January 5th, 2007 3:55 am

    “??????????????????????????

    do you put this in a flash file or no is it a move clip do you need to draw anything explain it geesis christ u moreon”

    How old are you? I thought this tutorial was fine for someone with an IQ above 60…

  9. Dan on January 12th, 2007 2:29 pm

    Pretty awesome, especially considering how small the code is! I’m new to flash but not to programming, and this is already giving me some rad ideas to work on…

    Was the C64 game reckless rufus by any chance?

  10. Emanuele Feronato on January 12th, 2007 7:47 pm

    Yeah, it was a good game, long live commodore64

  11. Florian on January 29th, 2007 4:24 am

    Hi,
    I found your blog via google by accident and have to admit that youve a really interesting blog :-)
    Just saved your feed in my reader, have a nice day :)

  12. andrew on February 18th, 2007 7:42 pm

    Yea i’ll haft to try it. It’s sad thet im only 8 years old and i’m prity good at it.A’ll try that today. Ok

  13. Chazz on February 21st, 2007 3:23 am

    Dude I put the code in my first frame but nothing happens..

  14. Justice on April 28th, 2007 3:03 pm

    Also you could add holes already there, or powerups such as a bomb that destroys a 3×3 square. Perhaps you have to be a certain colour when touching certain tiles in later levels so you have to go to the tile that has the next colour first before you can destroy tiles of that colour

  15. robert on May 22nd, 2007 12:37 am

    Hey im following the security tutorial how would i make a health pack dissipere
    I was guessing that it would be like this code

  16. Des on September 1st, 2007 6:30 pm

    Hi, excuse me for the dump question, but what code do you write when you want to remove the map – I mean, go to an end frame for the game or something like this. Just how to get rid of it, if you want to load something else.
    I am newbie with Action Script and I will appreciate your help.

  17. Ruiqi on January 7th, 2008 7:58 am

    For an end frame, in the first frame or the frame the game is on, put stop(); to go to the next level or to the end page, put gotoAndStop(whatever frame the next level or end page is); somewhere but i don’t really know where.

  18. danny on February 6th, 2008 1:50 am

    how would i make it go to the next frame once the green square is on the last red square?

  19. Jamis on April 8th, 2009 4:11 am

    Hey, did you know your site is serving out malicious JS code?

    Your site is on
    http://www.malwaredomainlist.com/mdl.php?inactive=&sort=Date&search=&colsearch=All&ascordesc=DESC&quantity=100&page=0

    2009/04/07_00:00 http://www.emanueleferonato.com/2006/11/26/flash-prototype-walking-on-disappearing-tiles/ 62.149.140.41 webx31.aruba.it compromised site/redirects to Mebroot itpuntoit snc, Emanuele info@itpuntoit.it

Leave a Reply




Posts