Displaying an output message in flash is really useful when needing to display instructions to the user about the flash movie/game, or even credits and acknowledgements. It is extremely easy to do too.
Right click on frame 1, select actions and insert the following actionscript:
trace (“Use the arrow keys to navigate your way around”)
Once the flash movie starts an external message will be displayed to the user saying 'Use the arrow keys to navigate your way around'.
Learn how to use Adobe Flash with all the free tutorials. Game Making, Animating, Cartoon Design, Web Design and much more...
Making a crosshair cursor
A crosshair cursor would be ideal for a shooter/hunter game. And this one procedure can be used to make a standard cursor also.
In this tutorial the crosshair will be used as the cursor also, as it is being made for a shooting game. Using the oval tool draw out a circle on the stage, make sure it has no fill. This cirle only needs be small, with a width and height of about 35. Inside this circle using the line tool, you will need to draw a cross, the middle of the lines that form the cross should intersect directly in the middle of the circle.
Select the crosshair you have just drawn, right click on it and convert it in to a movieclip. In it properties panel, give it an instance name of crosshair_mc. (make sure you do not include the full stop 'mc').
Insert another layer and rename it actions. Right click on the first frame and select actions. Put in the following actionscript:
Mouse.hide();
crosshair_mc.onMouseMove = function() {this._x=_xmouse, this._y=_ymouse;}
This tells flash to hide the mouse cursor, and make the crosshair movieclip's x and y co-ordinates the same as the mouse'.
In this tutorial the crosshair will be used as the cursor also, as it is being made for a shooting game. Using the oval tool draw out a circle on the stage, make sure it has no fill. This cirle only needs be small, with a width and height of about 35. Inside this circle using the line tool, you will need to draw a cross, the middle of the lines that form the cross should intersect directly in the middle of the circle.
Select the crosshair you have just drawn, right click on it and convert it in to a movieclip. In it properties panel, give it an instance name of crosshair_mc. (make sure you do not include the full stop 'mc').
Insert another layer and rename it actions. Right click on the first frame and select actions. Put in the following actionscript:
Mouse.hide();
crosshair_mc.onMouseMove = function() {this._x=_xmouse, this._y=_ymouse;}
This tells flash to hide the mouse cursor, and make the crosshair movieclip's x and y co-ordinates the same as the mouse'.
Welcome to Adobe Flash
Thank you very much for visiting uncover flash, and welcome.
Here you can find lots of free tutorials teaching you about all the different aspects of Adobe Flash. From Web Design, Game Making, Animation, Actionscript 2.0, Interactive Forms and Flash Software.
Feel free providing other users with your comments and advice, and let us know whether you like the tutorials or not with the famous 'like' button.
Here you can find lots of free tutorials teaching you about all the different aspects of Adobe Flash. From Web Design, Game Making, Animation, Actionscript 2.0, Interactive Forms and Flash Software.
Feel free providing other users with your comments and advice, and let us know whether you like the tutorials or not with the famous 'like' button.
Checkbox in flash
Adobe Flash has an inbuilt function that allows you to insert a checkbox in flash easily and quickly.
From the main menu options select window>components. A window will appear with a few different catergories to choose from, you will need the user interface catergory, from the user interface catergories double click on checkbox. This will insert an instance of a checkbox on the stage.
Select the checkbox and open up it's properties panel, there are three tabs, properties, filters and parameters, select the parameters tab. A table will now appear in the parameters panel, locate label, in empty box next to label, insert the text yes, also check that the text on the table that reads selected, is set to false. There should now be a checkbox on the stage with the word yes on the right hand side of it. Select the yes checkbox, just above the properties tab, there is an actions tab, click it and insert the following actionscript:
onClipEvent (enterFrame) {
if (this.selected) {
_root.gotoAndStop(2);
}
}
This tells flash that when it enters the frame, it needs to wait until the checkbox is selected, before going to frame 2.
Checkboxes are really useful for things like collecting date and reviews, quizes, serveys, web forms etc.
From the main menu options select window>components. A window will appear with a few different catergories to choose from, you will need the user interface catergory, from the user interface catergories double click on checkbox. This will insert an instance of a checkbox on the stage.
Select the checkbox and open up it's properties panel, there are three tabs, properties, filters and parameters, select the parameters tab. A table will now appear in the parameters panel, locate label, in empty box next to label, insert the text yes, also check that the text on the table that reads selected, is set to false. There should now be a checkbox on the stage with the word yes on the right hand side of it. Select the yes checkbox, just above the properties tab, there is an actions tab, click it and insert the following actionscript:
onClipEvent (enterFrame) {
if (this.selected) {
_root.gotoAndStop(2);
}
}
This tells flash that when it enters the frame, it needs to wait until the checkbox is selected, before going to frame 2.
Checkboxes are really useful for things like collecting date and reviews, quizes, serveys, web forms etc.
Combo box in flash
Flash has an inbuilt function that allows you to insert combo box in flash easy and quick. From the top menu options select window>components.
A window will appear with a few different categories to choose from, click on the plus symbol next to user interface and double click on the combo box option. This will insert an instance of a combo box on the stage.
You will now need to set the parameters of the combo box.
Select the combo box, in it's properties panel, there are three tabs to choose from, properties, filters and parameters, select the parameters tab.
A table will now appear allowing you to change the parameters, double click in the empty box next to label. (The labels are the options that will appear in the combo box). Using the + symbol, insert the required labels.
Once you have inserted all the labels, test the flash movie.
Click on the combo box and all the labels you just created will appear in it.
A window will appear with a few different categories to choose from, click on the plus symbol next to user interface and double click on the combo box option. This will insert an instance of a combo box on the stage.
You will now need to set the parameters of the combo box.
Select the combo box, in it's properties panel, there are three tabs to choose from, properties, filters and parameters, select the parameters tab.
A table will now appear allowing you to change the parameters, double click in the empty box next to label. (The labels are the options that will appear in the combo box). Using the + symbol, insert the required labels.
Once you have inserted all the labels, test the flash movie.
Click on the combo box and all the labels you just created will appear in it.
Creating a game menu
Although this menu is designed for a shooting game, using the skills that you learn from this tutorial will help you when creating and making any menu for any flash game or flash movie.
Double click on layer 1, and rename it actions.
Insert another 4 layers, renaming them: ‘title’, ‘purchases’, ‘player name’ and ‘start button’.
More layers will need to be inserted shortly, for the shooting menu’s animation, which will be your creation (see animation tutorials if unsure). If this is the first menu you have ever made, perhaps try adding some animation once your comfortable with the concept of creating a menu. so far you should have the following layers
-Actions (For all the actions)
-Title (Contains the title of the game)
-Purchases (A layer which controls the purchasing funtions)
-Player name (Allows the player to enter their name)
-Start button (Allows the player to begin the game)
In this shooting game menu, the player will be required to enter their name, purchase bullets, and press the start button to begin.
You will need to think of a title for the game, which will be ‘Shoot to Kill’ for this tutorial. Using the text tool, insert a textbox somewhere on the stage, making sure it is on the title layer, and insert the title of the game in the textbox. Being a main heading the text should be made visible with colour, and made a moderate size. For this tutorial the headings original position is off the stage, and once the game has started it slides in from the side of the stage to the middle of the stage.
Let's make your title do this also. On frame 1 of the title layer move the text off the left hand side of stage, making sure none of the text is visible on the stage. Right click on frame 15 on the title layer and insert a keyframe. On frame 15 move the title text to where you want it to slide to. Once this is done, right click anywhere between the 1st and 15th frame and create motion tween. Test the movie to see the result.
Now that there is an animation at the start of the game, you don't want to
see all the other menu options until this animation is over.
So you will need to insert a keyframe on frame 15 of all the other layers, as this is where the animation ends.
Before going any further define the variables of the game. On the 15th frame of the actions layer, insert the following actionscript:
stop();
var ammo = 0;
var money = 100;
This tells Adobe Flash to set the players money to 100, and the players ammo to 0. Obviously the player will require some money to purchase ammo. But only a little bit, as this is only the beginning of the game.
Now for the player name layer:
Using the text tool, insert a textbox somewhere on the stage on the 15th frame. In the textbox properties, set it to input text, this allows the player to enter text in to the textbox. Select the textbox, and give it a var of ‘playerName’ without the quotation marks. Also, next to ‘Var:’ on the left side, there are three buttons, the one closest to ‘Var:’ puts a border around the text box, click on it, and make sure that there is a border around the text box. (If this isn' done, the user won’t be able to see where to enter their name).
Now next to this playerName input textbox, on the left hand side, insert a static textbox. In the textbox write ‘enter name:’
The shooting menu now has a place for the user to enter their name!
For the purchase layer:
You will now need to provide the player with some stats showing them how much ammo they have purchased.
Using the text tool insert a static textbox on the stage, and write in the textbox, ‘ammo:’ Now next to this, on the right hand side of this textbox, insert a dynamic textbox, give it a var of ammo. The shooting menu now has somewhere to display how much ammo the player has purchased.
Now you will need to design a button that allows the user to purchase the bullets.
Using the text tool, draw out a static textbox, and type in ‘Purchase Bullets’. You could also draw a little bullet to put next to the text just to make it more creative and interesting. Select the purchase bullets text, right click on it, and convert it in to a button.
Right click on the purchase bullets button, and give it the following actions:
on (release) {
if (_root.money>24) {
_root.ammo += 5;
_root.money -= 25;
} else {
_root.ammo += 0;
}
}
This tells Adobe Flash that when the button is released, if the money is larger than 24, the users ammo will go up by 5, however, if it’s below 24, the ammo won’t go up at all.
Meaning the cost of 5 bullets is, 25.
The user can now insert their name, and purchase bullets for the game menu.
You will also need to insert some money functions on this layer:
Using the text tool, insert some static text somewhere on the stage, and make the text '$', on the right hand side of this, insert a dynamic text box, with the var of money. And that's it for that!
Last but not least, the start button:
Simply draw the graphic that you want to be you start button, right click on it, and convert it in to a button.
Now give the start button the following actions by right clicking on it and selecting actions:
on (release) {
gotoAndStop("Scene 2", 1);
}
This tells flash that when the button is released, go to scene 2.
Scene 2, is where the start of the main game begins. To insert ‘Scene 2’, click on ‘insert’, from the top menu, and select scene.
On scene 2, insert three dynamic textboxes, and three static text boxes.
Give these var names to the dynamic text boxes:
One textbox needs to have a ‘var’ of: ammo
Another needs a var of: playerName
And the last needs a var of: money.
Now obviously for the static text boxes, they describe what the dynamic text boxes are for. So next to the ammo text box on the left hand side, insert the text ‘ammo’.
For the money text box, it needs a money symbol next to it ‘$’.
Being a shooting game, you may want to make a crosshair cursor. Take this tutorial to see how to make a crosshair cursor.
To go back to scene 1, click on ‘view’, from the top menu, hover the mouse over ‘go to’, and select scene 1.
This is a basic way of creating a menu, but it is fully funtional, and the skills learnt from this tutorial, can definately be used for other tasks. NOT JUST FOR A SHOOTING GAME!
Double click on layer 1, and rename it actions.
Insert another 4 layers, renaming them: ‘title’, ‘purchases’, ‘player name’ and ‘start button’.
More layers will need to be inserted shortly, for the shooting menu’s animation, which will be your creation (see animation tutorials if unsure). If this is the first menu you have ever made, perhaps try adding some animation once your comfortable with the concept of creating a menu. so far you should have the following layers
-Actions (For all the actions)
-Title (Contains the title of the game)
-Purchases (A layer which controls the purchasing funtions)
-Player name (Allows the player to enter their name)
-Start button (Allows the player to begin the game)
In this shooting game menu, the player will be required to enter their name, purchase bullets, and press the start button to begin.
You will need to think of a title for the game, which will be ‘Shoot to Kill’ for this tutorial. Using the text tool, insert a textbox somewhere on the stage, making sure it is on the title layer, and insert the title of the game in the textbox. Being a main heading the text should be made visible with colour, and made a moderate size. For this tutorial the headings original position is off the stage, and once the game has started it slides in from the side of the stage to the middle of the stage.
Let's make your title do this also. On frame 1 of the title layer move the text off the left hand side of stage, making sure none of the text is visible on the stage. Right click on frame 15 on the title layer and insert a keyframe. On frame 15 move the title text to where you want it to slide to. Once this is done, right click anywhere between the 1st and 15th frame and create motion tween. Test the movie to see the result.
Now that there is an animation at the start of the game, you don't want to
see all the other menu options until this animation is over.
So you will need to insert a keyframe on frame 15 of all the other layers, as this is where the animation ends.
Before going any further define the variables of the game. On the 15th frame of the actions layer, insert the following actionscript:
stop();
var ammo = 0;
var money = 100;
This tells Adobe Flash to set the players money to 100, and the players ammo to 0. Obviously the player will require some money to purchase ammo. But only a little bit, as this is only the beginning of the game.
Now for the player name layer:
Using the text tool, insert a textbox somewhere on the stage on the 15th frame. In the textbox properties, set it to input text, this allows the player to enter text in to the textbox. Select the textbox, and give it a var of ‘playerName’ without the quotation marks. Also, next to ‘Var:’ on the left side, there are three buttons, the one closest to ‘Var:’ puts a border around the text box, click on it, and make sure that there is a border around the text box. (If this isn' done, the user won’t be able to see where to enter their name).
Now next to this playerName input textbox, on the left hand side, insert a static textbox. In the textbox write ‘enter name:’
The shooting menu now has a place for the user to enter their name!
For the purchase layer:
You will now need to provide the player with some stats showing them how much ammo they have purchased.
Using the text tool insert a static textbox on the stage, and write in the textbox, ‘ammo:’ Now next to this, on the right hand side of this textbox, insert a dynamic textbox, give it a var of ammo. The shooting menu now has somewhere to display how much ammo the player has purchased.
Now you will need to design a button that allows the user to purchase the bullets.
Using the text tool, draw out a static textbox, and type in ‘Purchase Bullets’. You could also draw a little bullet to put next to the text just to make it more creative and interesting. Select the purchase bullets text, right click on it, and convert it in to a button.
Right click on the purchase bullets button, and give it the following actions:
on (release) {
if (_root.money>24) {
_root.ammo += 5;
_root.money -= 25;
} else {
_root.ammo += 0;
}
}
This tells Adobe Flash that when the button is released, if the money is larger than 24, the users ammo will go up by 5, however, if it’s below 24, the ammo won’t go up at all.
Meaning the cost of 5 bullets is, 25.
The user can now insert their name, and purchase bullets for the game menu.
You will also need to insert some money functions on this layer:
Using the text tool, insert some static text somewhere on the stage, and make the text '$', on the right hand side of this, insert a dynamic text box, with the var of money. And that's it for that!
Last but not least, the start button:
Simply draw the graphic that you want to be you start button, right click on it, and convert it in to a button.
Now give the start button the following actions by right clicking on it and selecting actions:
on (release) {
gotoAndStop("Scene 2", 1);
}
This tells flash that when the button is released, go to scene 2.
Scene 2, is where the start of the main game begins. To insert ‘Scene 2’, click on ‘insert’, from the top menu, and select scene.
On scene 2, insert three dynamic textboxes, and three static text boxes.
Give these var names to the dynamic text boxes:
One textbox needs to have a ‘var’ of: ammo
Another needs a var of: playerName
And the last needs a var of: money.
Now obviously for the static text boxes, they describe what the dynamic text boxes are for. So next to the ammo text box on the left hand side, insert the text ‘ammo’.
For the money text box, it needs a money symbol next to it ‘$’.
Being a shooting game, you may want to make a crosshair cursor. Take this tutorial to see how to make a crosshair cursor.
To go back to scene 1, click on ‘view’, from the top menu, hover the mouse over ‘go to’, and select scene 1.
This is a basic way of creating a menu, but it is fully funtional, and the skills learnt from this tutorial, can definately be used for other tasks. NOT JUST FOR A SHOOTING GAME!
Useful flash shortcuts
Learning the Adobe Flash shortcuts isn't necessarily essential, but certainly can come in handy!
Selection tool – shortcut key = v
Oval tool – shortcut key = o
Rectangle tool – shortcut key = r
Brush tool – shortcut key = b
Paint bucket tool – shortcut key = k
Convert to keyframe – shortcut key = F6
Convert to blank keyframe – shortcut key = F7
Clear keyframe – shortcut key = shift+F6
Test movie – shortcut key = Ctrl+Enter
Debug movie – shortcut key = Crtl+Shift+Enter
Test Scene – shortcut key = Ctrl+Alt+Enter
Actions – shortcut key = F9
Transform – shortcut key = Ctrl+T
Have this list somewhere nearby your computer, in no time you'll be able to use them off the top of your head.
Selection tool – shortcut key = v
Oval tool – shortcut key = o
Rectangle tool – shortcut key = r
Brush tool – shortcut key = b
Paint bucket tool – shortcut key = k
Convert to keyframe – shortcut key = F6
Convert to blank keyframe – shortcut key = F7
Clear keyframe – shortcut key = shift+F6
Test movie – shortcut key = Ctrl+Enter
Debug movie – shortcut key = Crtl+Shift+Enter
Test Scene – shortcut key = Ctrl+Alt+Enter
Actions – shortcut key = F9
Transform – shortcut key = Ctrl+T
Have this list somewhere nearby your computer, in no time you'll be able to use them off the top of your head.
Setting x and y co-ordinates
Defining a movieclip's position using only actionscript is essential. And can be used for so many different tasks, game making, website design, logo placement, title placement etc.
Draw out a shape or picture on the stage, make it moderate size and place it anywhere on the stage. Select the whole of the shape/picture you have drawn, right click on it, and convert it in to a movieclip.
In the properties box, give it an instance name of ‘myimage’, without the quotation marks.
Now right click on frame 1, on the first and only layer, and select ‘actions’.
Insert the following actionscript:
myimage.onEnterFrame = function() {
this._x = 253;
this._y = 178;
this._width = 55;
this._height = 55;
};
This tells Adobe Flash that when it enters the frame, the images x (horizontal) co-ordinates is to be set to 253, and its y (vertical)
co-ordinates is to be set to 178.
It also tells flash that the width and height of the image is to be set to 55. If you apply this to a simple shape like a square it should turn out perfect, but changing the width and height of something like a stick figure, will most like distort it. Unless you adjust the height and width settings until you have the desired effect. Obviously for a stick figure you would want the height to be greater than the width otherwise he will be one funny looking stick figure.
The current x and y co-ordinates will place the image in the center of the stage (providing the stage size is set to default). Now test the flash movie and the image will have those exact co-ordinates, height and width properties that were set in the actionscript.
How could something like this be applied to a game? Shooting or car game, when the player dies they are reset back to the set co-ordinates, RPG, when the player reaches a certain point in the game they are taken to new part of the game. The possiblities are endless. Play with the ideas and test them out. There is no exact line of actionscript that will make something happen, there are a number of different ways of writing completely different lines of actionscript, but still having the same effect.
Draw out a shape or picture on the stage, make it moderate size and place it anywhere on the stage. Select the whole of the shape/picture you have drawn, right click on it, and convert it in to a movieclip.
In the properties box, give it an instance name of ‘myimage’, without the quotation marks.
Now right click on frame 1, on the first and only layer, and select ‘actions’.
Insert the following actionscript:
myimage.onEnterFrame = function() {
this._x = 253;
this._y = 178;
this._width = 55;
this._height = 55;
};
This tells Adobe Flash that when it enters the frame, the images x (horizontal) co-ordinates is to be set to 253, and its y (vertical)
co-ordinates is to be set to 178.
It also tells flash that the width and height of the image is to be set to 55. If you apply this to a simple shape like a square it should turn out perfect, but changing the width and height of something like a stick figure, will most like distort it. Unless you adjust the height and width settings until you have the desired effect. Obviously for a stick figure you would want the height to be greater than the width otherwise he will be one funny looking stick figure.
The current x and y co-ordinates will place the image in the center of the stage (providing the stage size is set to default). Now test the flash movie and the image will have those exact co-ordinates, height and width properties that were set in the actionscript.
How could something like this be applied to a game? Shooting or car game, when the player dies they are reset back to the set co-ordinates, RPG, when the player reaches a certain point in the game they are taken to new part of the game. The possiblities are endless. Play with the ideas and test them out. There is no exact line of actionscript that will make something happen, there are a number of different ways of writing completely different lines of actionscript, but still having the same effect.
Learning actionscript
Learning actionscript can be really difficult, it's just like learning another languange, a languange that allows you to communicate with Adobe Flash and tell it what to do, when to do it and how to do it. This is one of the most important skills to learn for anyone wanting to develop their skills in game making, website design and interactive pages.
Actionscript is extremely precise, 100% to be exact, so you will need to become really familar with the languange, and this is obviously achieved through constant use of actionscript, trying different things, solving code errors. Learning to solve code errors is definately a really effective way of developing your skills. It doesn't matter in the slightest if you have to Google the solution, your job is to remember the mistake, and REMEMBER THE SOLUTION!
Get to know the basics, before progressing to more advanced actionscript you should at least know some of the most basic lines of actionscript. For example, a very common line that you will use very regularly:
'gotoAndPlay(2)' - This tells Adobe Flash that you want it to go to the
second keyframe on the timeline, and play. Timeline control is definately something you need to understand, and luckily, it is really easy to pick up. This line of code doesn't really achieve much though. To make this more detailed, you could make it,
'on (release) {gotoAndPlay(2)}' - This actionscript would work perfect
with a play button.
That may only be one line of actionscript,and a very simple line, but it's a start. And in no time you should be able to memorise that and use it regularly without even thinking about it. Of course you will eventually need to use much more sophisticated actionscript, but once you have mastered the basics, this won't seem so daunting. And these tutorials will ease you in to the process.
Summary: Begin to learn actionscript and remember it, you should never copy and past, the idea is learn to write your own code, the more you type in the actionscript, the quicker and easier you will learn to write your own code!
Quote: 'When you come across a problem, find the solution, and remember the solution!'
Actionscript is extremely precise, 100% to be exact, so you will need to become really familar with the languange, and this is obviously achieved through constant use of actionscript, trying different things, solving code errors. Learning to solve code errors is definately a really effective way of developing your skills. It doesn't matter in the slightest if you have to Google the solution, your job is to remember the mistake, and REMEMBER THE SOLUTION!
Get to know the basics, before progressing to more advanced actionscript you should at least know some of the most basic lines of actionscript. For example, a very common line that you will use very regularly:
'gotoAndPlay(2)' - This tells Adobe Flash that you want it to go to the
second keyframe on the timeline, and play. Timeline control is definately something you need to understand, and luckily, it is really easy to pick up. This line of code doesn't really achieve much though. To make this more detailed, you could make it,
'on (release) {gotoAndPlay(2)}' - This actionscript would work perfect
with a play button.
That may only be one line of actionscript,and a very simple line, but it's a start. And in no time you should be able to memorise that and use it regularly without even thinking about it. Of course you will eventually need to use much more sophisticated actionscript, but once you have mastered the basics, this won't seem so daunting. And these tutorials will ease you in to the process.
Summary: Begin to learn actionscript and remember it, you should never copy and past, the idea is learn to write your own code, the more you type in the actionscript, the quicker and easier you will learn to write your own code!
Quote: 'When you come across a problem, find the solution, and remember the solution!'
Subscribe to:
Posts (Atom)