Flash game creation tutorial - part 3
Filed Under Flash •
March 14th update: part 5.3 released.
March 3rd update: part 5.2 released.
February 9th update: part 5.1 released.
December 31st update: 5th part released.
December 23rd update: 4th part released.
Here we go with the 3rd step.
Remember to read 1st and 2nd part if you are new to this tutorial, and let's go.
We left our hero colleting coins, so next step will be...
The score
Scoring system consist in a variable set to 0 (zero) when the game starts and some events that may increase/decrease the score.
In this case, you get 1 point when you collect a coin, and lose 2 points when you crash into a wall.
Hall I have to do is initializing a variable in the root with a single action
-
score = 0;
And then in the hero movieclip
-
onClipEvent (load) {
-
yspeed = 0;
-
xspeed = 0;
-
wind = 0.00;
-
power = 0.65;
-
gravity = 0.1;
-
upconstant = 0.75;
-
friction = 0.99;
-
}
-
onClipEvent (enterFrame) {
-
if (Key.isDown(Key.LEFT)) {
-
xspeed = xspeed-power;
-
}
-
if (Key.isDown(Key.RIGHT)) {
-
xspeed = xspeed+power;
-
}
-
if (Key.isDown(Key.UP)) {
-
yspeed = yspeed-power*upconstant;
-
}
-
if (Key.isDown(Key.DOWN)) {
-
yspeed = yspeed+power*upconstant;
-
}
-
xspeed = (xspeed+wind)*friction;
-
yspeed = yspeed+gravity;
-
_y = _y+yspeed;
-
_x = _x+xspeed;
-
_rotation = _rotation+xspeed;
-
if (_root.wall.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 120;
-
_y = 120;
-
_root.score -=2;
-
}
-
if (_root.coin.hitTest(this.hero_hit)) {
-
_root.coin._x = Math.random()*400+50;
-
_root.score ++;
-
}
-
}
Look at lines 33 and 37... as said, you get one point when you collect a coin and lose 2 points when you hit the wall.
A dynamic text in the main scene displays the score.
Sooooo easy... now let me introduce you the main event for this tutorial... the environment...
We can have different kinds of environment... let's start with the easiest.
The killing fixed environment
The killing fixed environment is a deadly part of the stage that does not move, such as a spike.
So I created a new movieclip called environment and instanced as environment and placed in the stage.
You choose how to detect the collision, with the center of the hero or with the hero_hit shape (time to read part 2 if you do not understand what I am talking about).
Just remember you game does not have to be too easy or too hard.
-
onClipEvent (load) {
-
yspeed = 0;
-
xspeed = 0;
-
wind = 0.00;
-
power = 0.65;
-
gravity = 0.1;
-
upconstant = 0.75;
-
friction = 0.99;
-
}
-
onClipEvent (enterFrame) {
-
if (Key.isDown(Key.LEFT)) {
-
xspeed = xspeed-power;
-
}
-
if (Key.isDown(Key.RIGHT)) {
-
xspeed = xspeed+power;
-
}
-
if (Key.isDown(Key.UP)) {
-
yspeed = yspeed-power*upconstant;
-
}
-
if (Key.isDown(Key.DOWN)) {
-
yspeed = yspeed+power*upconstant;
-
}
-
xspeed = (xspeed+wind)*friction;
-
yspeed = yspeed+gravity;
-
_y = _y+yspeed;
-
_x = _x+xspeed;
-
_rotation = _rotation+xspeed;
-
if (_root.wall.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 50;
-
_y = 50;
-
}
-
if (_root.environment.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 50;
-
_y = 50;
-
}
-
}
Lines 34-39 do the routine that checks collision between the hero and the environment
This is useful if you want to place objects on the stage that may kill the hero.
Sometimes, the environment should move.
The killing tweened environment
I am calling "tweened environment" an object that always moves along a path... such as a sliding wall or something similar.
The actionscript, obviously, is the same as above, the only change is to the environment object, that now has a tweening motion. You'll see it better when you will download the sources, at the end of this tutorial.
The only thing I want you to know is: for a better result, the number of pixels the environment moves at every frame should be an integer. I mean that if you want to move your environment by 150 pixels, be sure that dividing the pixels for the numbers of frames you have an integer number.
In my case, I move the environment by 150 pixels in 75 frames... 150/75 = 2 (integer) pixels/frame.
It's not a mandatory rule, and in most cases you will experience it is impossible to achieve such integer numbers, while you can do it, well, do it.
Sometimes we want the hero to interact with environment, so I will explain howo to get...
The triggered environment
Let's suppose to have a wall that moves very fast... making our life so hard... we should let the player decide to cross the wall, risking his life, or turn off the "engine" that moves the wall, for example pushing a button or pulling a lever.
In this new movie I created a new object named as trigger and instanced as trig, with the shape of a lever.
Then I added some actionscript to the environment, that is no longer tweened.
-
onClipEvent (load) {
-
dir = 4;
-
moving = 1;
-
}
-
onClipEvent (enterFrame) {
-
if (moving) {
-
_y += dir;
-
if (_y>300) {
-
dir = -4;
-
}
-
if (_y<50) {
-
dir = 4;
-
}
-
}
-
}
This is a very simple movement routine... I will explain more complex routines later in the tutorial, but at the moment I only want a wall to cross the stage up and down, and the hero to get the trigger to stop it.
The script is very simple, just take a look at the moving variable. You can see that the environment will move by 4 pixels (integer...) upwards or downwards as long as the moving variable is set to 1.
How can we stop it?
With lines 40-43 of the hero's actionscript
-
onClipEvent (load) {
-
yspeed = 0;
-
xspeed = 0;
-
wind = 0.00;
-
power = 0.65;
-
gravity = 0.1;
-
upconstant = 0.75;
-
friction = 0.99;
-
}
-
onClipEvent (enterFrame) {
-
if (Key.isDown(Key.LEFT)) {
-
xspeed = xspeed-power;
-
}
-
if (Key.isDown(Key.RIGHT)) {
-
xspeed = xspeed+power;
-
}
-
if (Key.isDown(Key.UP)) {
-
yspeed = yspeed-power*upconstant;
-
}
-
if (Key.isDown(Key.DOWN)) {
-
yspeed = yspeed+power*upconstant;
-
}
-
xspeed = (xspeed+wind)*friction;
-
yspeed = yspeed+gravity;
-
_y = _y+yspeed;
-
_x = _x+xspeed;
-
_rotation = _rotation+xspeed;
-
if (_root.wall.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 450;
-
_y = 50;
-
}
-
if (_root.environment.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 450;
-
_y = 50;
-
}
-
if (_root.trig.hitTest(_x, _y, true)) {
-
_root.trig.gotoAndStop(2);
-
_root.environment.moving = 0;
-
}
-
}
If the hero hits the trigger (as explained before, you will decide the type of collision checking later when you will test the entire game), the trigger frame is moved to 2 displaying a pulled lever and the moving variable is set to 0.
In this case, the actionscript of the environment won't enter in the if condition and the environment will stop.
Possibile applications of this routine are almost infinite: imagine buttons that stops dangerous object moving, levers that reveals hidden zones with treasures, and so on.
We will discover all those options when the game will be in progress... remember that at the moment I am just showing you the basics.
Talking about basics, let's see a type of environment that as far as I know is not included in ball:revamped (of course we always have to try to improve existing concepts).
The undeadly environment
I want an environment that does not kill the hero, but that changes some behaviours... imagine a stage that is partially flooded.
You have water in the stage, and your hero underwater movements will be more difficult.
-
onClipEvent (load) {
-
yspeed = 0;
-
xspeed = 0;
-
wind = 0.00;
-
power = 0.65;
-
gravity = 0.1;
-
upconstant = 0.75;
-
friction = 0.99;
-
sunken = 0;
-
}
-
onClipEvent (enterFrame) {
-
if (Key.isDown(Key.LEFT)) {
-
xspeed = xspeed-power;
-
}
-
if (Key.isDown(Key.RIGHT)) {
-
xspeed = xspeed+power;
-
}
-
if (Key.isDown(Key.UP)) {
-
yspeed = yspeed-power*upconstant;
-
}
-
if (Key.isDown(Key.DOWN)) {
-
yspeed = yspeed+power*upconstant;
-
}
-
xspeed = (xspeed+wind)*friction;
-
yspeed = yspeed+gravity;
-
if(sunken == 0){
-
_y = _y+yspeed;
-
_x = _x+xspeed;
-
}
-
else{
-
_y = _y+(yspeed/5);
-
_x = _x+(xspeed/3);
-
}
-
_rotation = _rotation+xspeed;
-
if (_root.wall.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 50;
-
_y = 50;
-
}
-
if (_root.environment.hitTest(_x, _y, true)) {
-
sunken = 1;
-
}
-
else{
-
sunken = 0;
-
}
-
}
Line 9 has a new variable that determines if the hero is underwater or not.
Then, when it's time to update hero's position according to gravity, speed, and so on...
Lines 26-33 checks if the hero is underwater or not. If it's underwater, movements are reduced by 5 vertically and by 3 horizontally.
Note: I said movements are reduced, not the speed! This means that when you will pop out of the water, you have to pay attention to your speed. I want the player to move carefully when underwater, not simply have slower (easier) movements.
Now let's imagine to have some special object on the stage. If the hero collects such object will raise the score, but the entire environment will get harder.
The playing environment
A little game covering some of the thems we discussed until now.
You have to score as much as you can. As seen before, you get 1 point when you collect a coin, you lose 2 points when you hit the walls and 1 point when you hit the environment.
Easy? Not at all... I forgot to tell you the environment moves, and the higher your score, the faster the movement.
The actionscript on the first frame is
-
score = 0;
You may ask: can't you put this line in the hero onCLipEvent(load)?
Yes, I could, but you will see why I put it there when we will learn how to move around levels.
Anyway, in the environment object we have the actionscript:
-
onClipEvent (enterFrame) {
-
_rotation=_rotation+0.25+_root.score*0.25;
-
}
Do you see? the environment rotation speed increases as long as your score increases. So bad!
Finally, the hero actionscript
-
onClipEvent (load) {
-
yspeed = 0;
-
xspeed = 0;
-
wind = 0.00;
-
power = 0.65;
-
gravity = 0.1;
-
upconstant = 0.75;
-
friction = 0.99;
-
_root.coin._x = Math.random()*400+50;
-
_root.coin._y = Math.random()*250+50;
-
}
-
onClipEvent (enterFrame) {
-
if (Key.isDown(Key.LEFT)) {
-
xspeed = xspeed-power;
-
}
-
if (Key.isDown(Key.RIGHT)) {
-
xspeed = xspeed+power;
-
}
-
if (Key.isDown(Key.UP)) {
-
yspeed = yspeed-power*upconstant;
-
}
-
if (Key.isDown(Key.DOWN)) {
-
yspeed = yspeed+power*upconstant;
-
}
-
xspeed = (xspeed+wind)*friction;
-
yspeed = yspeed+gravity;
-
_y = _y+yspeed;
-
_x = _x+xspeed;
-
_rotation = _rotation+xspeed;
-
if (_root.wall.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 50;
-
_y = 50;
-
_root.score -= 2;
-
if (_root.score<0) {
-
_root.score = 0;
-
}
-
}
-
if (_root.environment.hitTest(_x, _y, true)) {
-
xspeed = 0;
-
yspeed = 0;
-
_x = 50;
-
_y = 50;
-
_root.score -= 1;
-
if (_root.score<0) {
-
_root.score = 0;
-
}
-
}
-
if (_root.coin.hitTest(this.hero_hit)) {
-
_root.coin._x = Math.random()*400+50;
-
_root.coin._y = Math.random()*250+50;
-
_root.score++;
-
}
-
}
Nothing new, just a check to the score to prevent it to be less than zero.
If you want, drop a comment with the highest score you achieved. I bet you won't easily score more than 15.
Remember to give me feedback and suggestions.
Download the examples source code and move to the 4th part
Websites of Interest: casino game
Tell me what do you think about this post. I'll write better and better entries.
They can be easily customized to meet the unique requirements of your project.
125 Responses to “Flash game creation tutorial - part 3”

(13 votes, average: 4.77 out of 5)
Hmmm… I know this is a begginer’s question to ask, and I’ll admit to being one, but how do I get two instances to group together and stay together during the “game”? I’ve tried many different ways, but they never work, I always end up leaving the square behind.
This is a very good tutorial. I have one comment to make however. On your last tutorial (Part 2) you told somebody it would be hard to make a bounce effect. Its actually very easy. Start by making two separate movie clips/instances for the walls, wall1 (floor and ceiling) and wall2, the right and left walls.
if (_root.wall.hitTest(_x, _y, true)) {
yspeed = yspeed*-1;
}
if (_root.wall.hitTest(_x, _y, true)) {
xspeed = xspeed*-1;
}
Umm… woops. Redo.
if (_root.wall1.hitTest(_x, _y, true)) {
yspeed = yspeed*-1;
}
if (_root.wall2.hitTest(_x, _y, true)) {
xspeed = xspeed*-1;
}
Woho!
I scored 21 :D
i’m quite a newbie regarding flash, though i’d followed the tutorial quite easily (that’s a compliment) and managed to accomplish all the first steps but i can’t make a funcitonal score count. i’ve put the code correctly in the hero but i dont know what to do with the “score = 0;”, where to place it. (i mean, i don’t know how to initialaze a variable in the root) again, i’m new in this. sorry, hope to get ur answer
score done.
:)
I have the same problem Newbie had, i can’t get the score to function correctly…
I have “score = 0;” in the main frame, a dynamic text box in the main scene, and i have “_root.score ;” in the correct spot… still not sure why it isn’t responding.
great tutorial
couldnt get past 17 on that last 1
WOOHOO I SCORED 800 MILLION
hey can you make one with a guy gravity ground water and boxes to hop acros.
i beat ball revamped blblblblblblblblz
i am making lives in my game it works the same way as the score but it minus lives instead of score when it hits the walls. When the lives equals 0 i tried to make a code so that it takes it to a frame which says game over
but this code doesn’t work:
if (_root.lives=0) {
gotoAndStop(2);
}
can anyone help me???
im having the same problem with the ’score=0′ can anyone help me?? please where do i put it??? I cant use the scoring method! :(
in reply to sam:
your code:
if (_root.lives=0) {
gotoAndStop(2);
}
correct code:
if (_root.lives==0) {
gotoAndStop(2);
}
you should be checking if lives is equal to zero,
instead you had if, set lives set to zero.
honest mistake, every time you use an if statement with variables use 2 quals signs. it means “is equal to”
hope that cleared it up for you.
and as for the score newbies…
first frame, on the frame. put score=0;
then always refrence it with _root.score
it will work. full proof. if you can’t get it to work with that said, then go get a new hobbie.
Hi , how can i put the ”The killing tweened environment” , but also the ”Water” ?
Nice tutorial :) hope there will be more of thees, how to make a “mario style” platform game maybe? ^^
I’m not so good at this.. i could do everything exept for makeing the score board..
so if someone could tell me how to do(from the begining please) thanks!!
:)
Great tutorial!!!
woah, totally easy to learn, and you actually explain the action script, you are gifted at tutorials, and the root files for examples are a stroke of genius
i made a dynamic text block and gave it the instance name of score and gave put score = 0; in the actions menu of the main frame. i typed zero in it and tried the game and when i collide with the coin and walls the score does not increase or decrease what am i doing wrong can anyone help me
“gave put” is a typo woops i didnt put the word “put” in the script lol
wow been a while since hes replied to anyone
yus i scored 20
I got 16 on my first try!
where exactly do i put the score variable thing? (the first actionscript on the page)
i dont even get how to do the dynamic text box!?!? help!!!!!
I am having torouble with the score please help me by telling me exactly what i have to do with the score
This is to everyone who needs help with the score box.
Click the text tool in the tool panel and create a text box. In the properties area make sure the dropdown box is set to dynamic. In that same section you will see a text area labeled “var”. in there you type “score” because that is the name of the variable you want it to show. In the first frame of a layer (preferably the layer with the text box) enter the actionscript “score = 0;”.
If that doesn’t work, give me some slack. Post your problems and I’ll try to help. I am only 14. :-P
Oh yeah forgot.
Awesome tutorial!
Covers all actionscript problems.
Only thing is, I want to keep all my actionscript in the first frame of a layer called “action”.
How do I get the frame to recognize the onClipEvent (enterFrame) line for the hero MC?
im having a pronlem with the scoreing, i can make the text box and everything, but i cant find the var box =(, can any1 help?
This Tutorial is really great!!
Im 12 years old and I understand(most of) it!
But…
when I am Playing the game ive made, evrything goes in slomotion!!!
WHY MAAN WHYYYY!!!
To Mick. Mark your textbox and check the properties. Right under where you choose color and size of the letters, the “var” box is.
Help with inserting more “environments”
Been following this guide for a while. Been going well so far. Execpt one thing. How do i add more environments? If i copy the first one i had, it simply goes right through it.
;)
@confused pinguine
wat you have to do is increase the frames per second (fps) to 50
yeah i checked there but on my flash theres no var box there…maybe i’ll just upgrade to flash 8 ;).
i dont know if this was answered somewhere but alot of people were asking about the scoring. make a dynamic text box, give it a name then type this into action script.
_root.(text box name).text = “score: ” (variable name for score);
hope it helps
=\
– confused pengiun, just click on the stage, then open the properties bar at the bottom, there should be a box that says “FPS 12″, simply change the 12 to a higher number.
im using flash mx 6.0, so sry if you’re using a different version and this doesnt work
emanuele i mastered that spinning game i got 17!
Lol vasheeth you spelt beginner wrong
and mick flash 8, it rocks i suggest going for it
thx 4 ur help Helper monkey and trys everything!
I appriciate it man…
/\
(or however u spell it…)
Great tutorial, bad for beginner because you don’t explain very much.
how would i put in a variable showing the number of lives left and ‘game over’ -ing the game when the lives reach zero?
any help is appreciated
23 point!!!!!!!!
beat that!!!
In response to diamond drake:
your code:
if (_root.lives==0) {
gotoAndStop(2);
}
correct code:
if (_root.lives==0) {
_root.gotoAndStop(2);
}
im creating a trigger similer to the one used in the tutorial but i want to be able to stop and start the moving block the trigger affects effects I’m a complete begginner with flash but learning fast, any help you can give me is greatly apreciated.
Man, i can’t figure out the score thing either…i know im doin somethin wrong. if only i knew what… I put the score code in the frame, i make a dynamic text box with variable of score, and i put in the code in the hero. NOT WORKIN! When i veiw the movie, the score box doesn’t even start out with a zero in it!
oops, i meant instance! lol not variable
Hey i’m currently making a game (not like yours, but similar. and i was wondering, if theres a code, so that when the “hereo” touches a movie clip, it goes to the next scene?
Hi im all new to this actionscript stuff and so im confused. this is probably a really obvious answer but on the last game when i try to make the environment rotate, it doesn’t rotate from the middle, it always rotates from the left. can anyone help with this please?
Yay, after about an hour of mindlessly playing this game like a moron, I have finally achieved the coveted rank of 30, thus becoming the world class mindless game player
P.S. I can do the rubik’s cube in about 30 secs
So, I’ve read through the tutorials and I think they are pretty awesome. I’ve been tweaking numbers within the games, and I’ve noticed that I’m unable to make a solid object. I’ve been trying to make a solid ground or block that doesn’t kill the player, the player just can’t go through it. Mostly, I’ve been trying this with the ground. I’ve change the settings so that it doesn’t kill the player (commented out the change x and y positions) and I’ve changed the part where it changes the players speed, so rather than setting it to 0, it sets it to -(some number)*xspeed. Is there a specific number that I have to use that counters gravity and the player’s downward force? Like, for example, should I stop the players motion, than give them a gentle push upward?
im a little confused.
The score
Scoring system consist in a variable set to 0 (zero) when the game starts and some events that may increase/decrease the score.
In this case, you get 1 point when you collect a coin, and lose 2 points when you crash into a wall.
Hall I have to do is initializing a variable in the root with a single action
ACTIONSCRIPT:
1.
score = 0;
Where do i write the “score=0;” ?
im a little confused.
The score
Scoring system consist in a variable set to 0 (zero) when the game starts and some events that may increase/decrease the score.
In this case, you get 1 point when you collect a coin, and lose 2 points when you crash into a wall.
Hall I have to do is initializing a variable in the root with a single action
ACTIONSCRIPT:
1.
score = 0;
Where do i write the “score=0;” ?