Create a Flash ball game with visual from above tutorial part 3

January 16th update: 4th part released

In the third part of this tutorial I am going to fix a minor bug and introduce three new tiles:

info tile (displays a message when the ball rolls over it)
reverse control tile (reverses the controls of the ball)
checkpoint tile (makes you respawn at the checkpoint tile if you die)

Before continuing, I suggest you to read tutorials 1 and 2.

The actionscript of the last example has changed to:

Let’s comment the new lines:

Line 3: Attaching the info_panel object (the panel that will show the messages when the ball rolls over it) and making it invisible

Line 7: Creating a new variable to know if the player passed a checkpoint or not, and setting it to false by default

Line 11: Making the info panel object invisible. This may seems redundant since I alredy set it as invisible at line 3, but consider that this line is inserted into a routine to be executed at every time (so it’s redundant line 3…)

Lines 17-20: To understand this code, you must know how did I manage message tiles. Message tiles are tiles at number 12, but in the level array I assign a value of 12000+x where x is the id of the message. As an example, if a value in the level array is 12045, it meas that it’s a tile of type 12 (info tile) with the message 45. That’s what is done with this set of lines: if a value is greater than 12000, then assign 12 to type_of_tile value and type_of_tile%12000 (even if type_of_tile-12000 would be better) to the message_to_show variable

Lines 73-76: Code for the reverse controls tile (tile 11): simply multiplies power by -1

Lines 77-81: Code for the info panel tile (tile 12). Setting the info panel to visibile and assigning the dynamic text

Lines 82-87: Code for the checkpoint tile (tile 13): setting the checkpoint_passed variable to true and saving the current x and y tile position in save_x and save_y variables.

Lines 140-141: Reset the speed when a level is initialized. This will prevent the ball to mantain its speed when the player passes the level

Lines 157-159: Messages to display

Lines 225-227: If the tile number is greater than 12000, then setting the frame to stop in the tiles movieclip to 12

And that’s it: the first level has the new features while the others are the same of part 2

I am about to publish a complete game with a lot of more tiles, obviously I am releasing a full tutorial.

Meanwhile, download the source of this one

Read 4th part released

  • Frederik J

    Really, really nice Emanuele. You’re monetizing it as well, right?
    Love it!

  • The ball is really looking perfect!
    As a suggestion for some more levels, how about sprinkling some other balls on the tracks, which should also not fall from the track, so you shouldn’t bump too hard against them.
    Cheers!

  • maciek

    yay Cool, but I must say there is something about that game I dont like…

  • chaew

    yeh thats really good! but when are you actually going to post the code to circle chain? we’re all eagerly waiting in anticipation…

  • The circle chain source was already posted.

  • Yeah gr8 as usual.
    Emanuele, pls release the circle chain tutorial as you have only published the source code.
    We would appreciate it

  • Where did you learn actionscripting, Emanuele?

  • Awesome! :D

  • David

    are we able to create arrays or any size as long as we change the number 4 on lines 219 and 220?

    great tutorials keep it up!

  • Xodus

    Hey, Emanuele,

    I’m a big fan of your site, and on one of the previous posts, you said that if we got here from a tut link not created by you, we should notify you. So, go to this site:

    http://www.tutorialized.com/tutorial/Make-a-Flash-game-like-Flash-Element-Tower-Defense/30804

    I HATE copycats!

  • Matt

    I think that was posted by Emanuele. The person who posted it, username is triqui which is the same as his newgrounds username:
    http://triqui.newgrounds.com/

  • Tom

    Hello i have a problem

    so the maps are currently:

    case 7 :
    _root.ball_start_x = 2;
    _root.ball_start_y = 2;
    level[0] = new Array(0, 0, 0, 0, 0);
    level[1] = new Array(0, 0, 0, 0, 0);
    level[2] = new Array(0, 0, 12001, 0, 0);
    level[3] = new Array(0, 0, 0, 0, 0);
    level[4] = new Array(0, 0, 0, 0, 0);

    Something like that but i wanted to add more levels so i did –

    case 2 :
    _root.ball_start_x = 0;
    _root.ball_start_y = 0;
    level[0] = new Array(12001, 7, 1, 1, 1);
    level[1] = new Array(0, 0, 0, 0, 1);
    level[2] = new Array(1, 1, 1, 1, 1);
    level[3] = new Array(1, 0, 0, 0, 0);
    level[4] = new Array(1, 2, 3, 0, 1);
    level[5] = new Array(0, 1, 2, 1, 1);
    level[6] = new Array(0, 0, 0, 0, 10);
    level[7] = new Array(0, 0, 0, 0, 10);
    messages[1] = “What will it do?”;
    break;

    but it osnt work any clues?

  • lewis

    Use invisible tiles there great. You can make them by creating a new tile in the tile movie clip and changing it’s alpha to 0.
    Also how do you make it so that when you finish a certain level you go to the next slide.

  • ben

    hey! guys if any one can give me the flash code for the game boulder dash, i want a max of 3 levels! i will b willing to pay for it! i really need it so if any one knws anything bout it please contact me my email address is alishag229@hotmail.com thank you

  • How do I know what level I’m on?
    Right Now the game on this page has 5 flashing Green tiles, 2nd tile is yellow etc o.o

  • phore_eyes

    how do u make it so that it can be more than 5 tiles wide???

  • Emanuele Feronato

    just make you array bigger

  • justin

    Hey i tried expanding the map. It works but how do i make the additional tiles show up????

  • justin

    nvm. i asked a stupid question. and i figured it out after reading over everything again. BUT how do i add sounds after certain actions such as dying, entering a certain level and just about any other point?

  • RJ

    if(something happens){
    music = new Sound(this);
    music.attachSound(“yoursoundlinkage”);
    music.setVolume(100);
    music.start(0,1);
    }

    And you only have to check that your sound is linked correctly.

  • Pingback: Create a Flash ball game with visual from above tutorial part 2 : Emanuele Feronato - italian geek and PROgrammer()

  • Laxaria

    Just a question. Is there a way to make it such that instead of going to the next class of the frame, could you make it go to another frame instead? Thanks.

  • nachoman

    great tutorial

    I just have 2 question. i need a code to be able to make a tile in the last level that sends the player to the next frame where is says something like
    “Congrats! You win!!—— Replay?”
    I just don’t know how?
    and the other one is how to add a score so when you pass a level you get points

  • @phore_eyes: On lines 219 and 220, change the “4”s to the amount of tiles you want going across and going up.

    @Emanuele: This is a great tutorial. Your site has taught me loads, thanks. I am developing a game with this engine, do I need to put credit to you in it?

  • Matt Saunders

    If you want to make your levels bigger than 5×5..

    }
    _root.createEmptyMovieClip(“bricks”, 2);
    bricks._x = 240-(80*ball_start_x);
    bricks._y = 220-(80*ball_start_y);
    for (y=0; y<=4; y++) {
    for (x=0; x0) {
    depth = y*12+x;
    place_brick = bricks.attachMovie(“brick”, “brick_”+depth, bricks.getNextHighestDepth(), {_x:x*80, _y:y*80});
    place_brick.gotoAndStop(level[y][x]);
    }
    }
    }
    }

    localte this and then change the 4s is this bit..
    for (y=0; y<=4; y++) {
    for (x=0; x<=4; x++) {

    to whatever you want :) if you make it 1000 you dont have to use all the squares.

    GREAT tutorial btw.

  • lucky

    its awesome! Emanuele…
    i really enjoyed playing it. kindly send me more tutorials on games.
    hav a nice day

  • Randylin26

    Mat Saunders….. Your right…….

  • heyy,
    very good tutorial but i have a question.
    If i want to create m own level,then when the new level should came the next ones come and not the ones that i have made.

    i finish level 1.
    i created level 2…
    but then level 3 comes and not level 2 that i made.

    help me pls?
    :(

  • SG

    Thanks for the great tutorials! Here’s a way to get a smoother death when the ball hits an empty tile (obviously my ball is bigger than yours):

    default :
    //empty space
    friction = .7;
    power = 0;
    this._width = this._width-15;
    this._height = this._height-15;
    if(this._width <= 10){
    this._height = 280;
    this._width = 280;
    ball_die();
    }
    break;

    I've also gave it a teleport sequence when it hits the exit tile and explode when it hits an active lava tile :D

  • make this and the ball falling ;-)

    function ball_die() {
    xspeed = 0;
    yspeed = 0;
    ball._xscale -= 5;
    ball._yscale = ball._xscale;
    if (ball._yscale <= 0) {
    bricks._x = 240-(80*_root.ball_start_x);
    bricks._y = 220-(80*_root.ball_start_y);
    ball._xscale = 100;
    ball._yscale = 100;
    draw_level(lev);
    }
    }

  • sorry
    so is better ;-)

    function ball_die() {
    xspeed = 0;
    yspeed = 0;
    power = 0;
    ball._xscale -= 5;
    ball._yscale = ball._xscale;
    if (ball._yscale <= 0) {
    bricks._x = 240-(80*_root.ball_start_x);
    bricks._y = 220-(80*_root.ball_start_y);
    ball._xscale = 100;
    ball._yscale = 100;
    draw_level(lev);
    }
    }