Written by: Jonas Jonsson, , www.dife.se
Difficulty Level: beginner
Requirements: Flash version 5
Assumed Knowledge: You will learn a simple movement and a simple hittest function Download FLA

This is what your goal is to learn in this tutorial: To move an object with the keyboard and see if that object is hitting something.

Try on the file under here and move the ball:

So how did I do that? Well thats why you are here.

Create a new flash file and draw a ball, square or whatever you want. When you have done that you make the object to a movieclip(Go up to the menu and select "insert" and press the "Convert to symbol" and select movieclip). You could also draw a wall or something similiar and make that a movieclip to. But you got to name this movieclip to "wall".

This is how it should look now(if you drawn the same things as me).
But this ball wont move yet so lets do it. Select the ball and right click on it and select "actions". It´s here you program the movement. Here is the code I´ve been written. Just copy it into your "action window" or write it yourself. So what is this?

onClipEvent (enterFrame) {
        if (Key.isDown(37)) {
                _x=_x-2;
        }
        if (Key.isDown(38)) {
                _y=_y-2;
        }
        if (Key.isDown(39)) {
                _x=_x+2;
        }
        if (Key.isDown(40)) {
                _y=_y+2;
        }
}

onClipEvent (enterFrame) = This is the first row and because it is "enterFrame" it will do the code around and around like a loop.

if(Key.isDown(37) = This is an "if function". I´m not going in on that, you could read it on help section. Well the row means that if you press the left button the movieclip will move to the left. how do we know that it is the left button? Well, all the buttons on the keyboard has a number, and the number for the Left-button is 37. 38 is the up button and so on. The row under if(Key.isDown(37) is _x=_x-2;. This row will move the movieclip(the ball) to the left if you press button 37(Left). And this row will only happen if button 37(Left) is pressed.

And you see that the other rows are almost the same, the different is the number and the action it will do.

Now play the movie and try to move the ball.Wohooo, our ball can finally move around when you press the buttons(Up,Down,Left and Right). But when we move towards the wall we can go through it and we dont want that. How should we solve this little problem? We can insert one row in the "action-window" on the ball. So rigth click on the ball and select actions again. Now insert this code under the "steering code":

if (hitTest(_level0.wall)==true) {
        _x=_x-2;
}

Well you can see that this is an "if function" again but with another condition.
This "hitTest(_level0.wall)" checks if the ball is hitting the wall. The "_level0.wall" tells the code that it only should check if the ball is hitting a movieclip that is named "wall". The returned value on "hitTest(_level0.wall)" is either "true" or "false" and that is why we have "==true" at the end. Well if the condition("(hitTest(_level0.wall)==true") is true it will do the action under and that is of course "_x=_x-2;". This will move the ball to the left so you can only have the wall to the right side of the ball. A more advance hitTest() function will come from me but not now. Well you code on the ball shoul look like this:

onClipEvent (enterFrame) {
        if (Key.isDown(37)) {
                _x=_x-2;
        }
        if (Key.isDown(38)) {
                _y=_y-2;
        }
        if (Key.isDown(39)) {
                _x=_x+2;
        }
        if (Key.isDown(40)) {
                _y=_y+2;
        }
        if (hitTest(_level0.wall)==true) {
                _x=_x-2;
        }
}

You can know play your movie and see that the ball cannot move through the wall.

Written by Jonas Jonsson