Adobe Flash Training

Creating a game menu

2011-03-22T08:03:00.000-07:00

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!

Useful flash shortcuts

2011-03-22T06:48:00.000-07:00

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.

Setting x and y co-ordinates

2011-03-22T06:44:00.000-07:00

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.

Learning actionscript

2011-03-22T05:54:00.000-07:00

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!'

How to insert a combo box

2010-03-20T03:37:00.000-07:00

The combo box is an inbuilt component in flash, and is very easy to use.
Simply click on ‘window’ from the top menu, and then select ‘components’, from the list.
A window will appear with a few categories, click the plus symbol next to ‘user interface’, and now double click on the ‘combo box’ option. This will insert an instance of a combo box on the stage.
As you will see, there are no options in the combo box; we need to change the parameters. Simply click on the combo box, you should see the combo boxes property box at the bottom of the screen, if not, click on the little arrow button.
There will be three tabs, ‘Properties’, ‘Filters’ and ‘Parameters’, select the parameters tab.

A table will appear in the empty window, here is where you edit the parameters.

Where it says label, there will be no text in the box next to it, so double click on the empty box, and this will appear. (without the names).

Simply use the ‘+’ symbol to add labels. I used ‘John’, ‘Jack’ and ‘Barry’
That’s all you need to do, and you’ve go a combo box.

How to make a checkbox

2010-03-19T22:26:00.000-07:00

Flash has built in components, and one of these components is a checkbox.
Click on the ‘window’ button which is at the top of the screen. Select ‘components’ from the list of options. A new window will be displayed, and in this there will be a couple of sections. We want the ‘User Interface’ components. And from these components, double click on the ‘checkbox’ option. An instance of a text box will now appear on the stage.
Select the checkbox, and above its property box at the bottom of the screen, is where the actions can be applied. Insert the following code:

onClipEvent (enterFrame) {
if (this.selected) {
_root.gotoAndStop(2);
}
}

This tells flash that when the frame is entered, if the checkbox is selected, go to frame 2.
And that’s all there is to making a checkbox.
Checkboxes can be good for making a quiz, or getting information from the user.

Fun PC Games

2010-03-18T22:47:00.001-07:00

Download games
Free PC online Games , free pc games download, computer games & mobile games including puzzle games, arcade games, RPG games, shooting games , casual games and more free games downloads available at Fun PC Games

How to display an output message

2010-03-11T05:36:00.000-08:00

This can be good when giving the user instructions, creator of the game etc.
Simply right click on frame 1, and insert the following code:

trace (“Use the arrow keys to navigate you way around”)

This would display an out put message that says ‘Use the arrow keys to navigate you way around.
It’s as simple as that.

Subtracting numbers

2010-03-09T23:07:00.001-08:00

This tutorial is exactly the same as the adding numbers tutorial.
Only replace the ‘+’ symbol with a ‘-‘symbol.
And the actionscript code on the ‘=’ symbol button would be:

on (release) {
_root.answer = Number(value1)-Number(value2);
}

Instead of

on (release) {
_root.answer = Number(value1)+Number(value2);
}

Take the adding numbers tutorial here

Multiplying numbers

2010-03-09T23:06:00.002-08:00

This tutorial is exactly the same as the adding numbers tutorial.
Only replace the ‘+’ symbol with a ‘*‘symbol. (shift-8)
And the actionscript code on the ‘=’ symbol button would be:

on (release) {
_root.answer = Number(value1)*Number(value2);
}

Instead of

on (release) {
_root.answer = Number(value1)+Number(value2);
}

Take the adding numbers tutorial here

Dividing numbers

2010-03-09T23:06:00.000-08:00

This tutorial is exactly the same as the adding numbers tutorial.
Only replace the ‘+’ symbol with a ‘/‘symbol.
And the actionscript code on the ‘=’ symbol button would be:

on (release) {
_root.answer = Number(value1)/Number(value2);
}

Instead of

on (release) {
_root.answer = Number(value1)+Number(value2);
}

Take the adding numbers tutorial here

Adding two numbers together

2010-03-09T23:04:00.000-08:00

A really easy task, however, a very common mistake is often made.
When defining the numbers in actionscript, you MUST define them as numbers; otherwise they’ll be recognised as strings.
If they are recognised as strings, 2+2 would come out as 22.
So let’s start this tutorial, and do it the CORRECT way.
Start by selecting the ‘text tool’, in the property box, set it to, ‘Input text’, and draw out a text box. Now right click on the text box you just inserted, and select ‘copy’, right click somewhere else on the stage and select ‘paste’.
Now position the two text boxes next to each other, leave enough room for ‘+’ symbol to go in between them.
Layout so far:
‘+’
Now give the input textbox on the left an instance name of ‘value1’, and the one on the right an instance of ‘value2’. (Do not include the quotes)
Now underneath the two textboxes and ‘+’ symbol, put a ‘=’ symbol in, position it underneath the ‘+’ symbol.
Now using the ‘text tool’ again, insert a textbox underneath the ‘=’ symbol. (This is where the answer will be displayed). Select the text box, and in its property box, set it to ‘dynamic text’, and give it an instance name of ‘answer’, without the quotes.
Layout:

‘+’
‘=’

Right click on the ‘+’ symbol, and select ‘convert to symbol’, select the ‘button’ radio button, and then click OK.
Right click on the ‘=’ button, and select ‘actions’, and insert the following code:

on (release) {
_root.answer = Number(value1)+Number(value2);
}

This tells flash that when the button is released, value1 (the left textbox) and value2 (the right textbox) are to be added together, and the answer is to be displayed in the answer textbox.

Now right click on frame 1, select ‘actions’, and insert the following code:

var value1:Number = 0;
var value2:Number = 0;
var answer:Number = 0;

This sets all the textboxes to 0
And that’s all you need to do.

Designing and creating an RPG game

2010-03-09T21:28:00.000-08:00

RPG/Role Playing games are among the most popular games. As and RPG game puts the user in control of the game more than most other games types. Allowing the user to make choices, take certain paths and hope it’s the right one and so on.
Before you start designing your game, it is really important that you do a plan first.
Grab a scrap of paper and start jotting down the ‘Game Plan.’
This can include, the list of characters that will appear in your game, including there role in the game, and even a biography of the character, including there personality, are they bad or good, what do they do in the RPG game.
Now try develop a bit of a story line, how will the game begin, what type of problems will arise, what will fix the problems?
Deciding how the user will interact with the game, for example:
Will the user be required to walk through the game and face the challenges, or will they only need the mouse to decide the characters fate, both would be better.
Write it out like a book, you do not need to include all the details, just enough for you to understand what’s going on. Once you’ve mapped out the plan, have a pretty accurate idea of what events will happen in the game, solution, character etc, have a little think about some additional features that you could add to your game.
Such as:
Inventory - to hold all the items the player can collect
Health bar – so the player can die
Timer or time limit – make the game more difficult with a time limit
Score – things the player can collect through out the game to earn points.

Once you have this all written down, know what you want to happen in the game, have the events plotted out, you can start creating your game, and you’ll be shocked about how much easier it is to set your game out, and get it going.
Start by designing your characters, design a menu, and so on.
The information you need, can be found on this website.
Resources:

How to make an inventory
How to make a score
Timer/time limit
Health bar

How to make a dropdown menu

2010-03-09T04:13:00.000-08:00

There are many ways to make a dropdown menu using flash, some easier than others, however, the graphic of the dropdown menu can sometimes be a bit glitchy and just don't do what you want it to.
Here is a way, of making a dropdown menu, that works great, and is very functional.
We will be using the ‘_visible’ code for this dropdown menu, and it works great when making a dropdown menu in flash.
Begin by inserting an additional layer. Double click on layer 1, and rename it, ‘dropDown’. Double click on the other layer, and name it content.
On the dropDown layer, using the rectangle tool, draw out a rectangle, with a width of about ‘110’, and a height of about ‘45’. This rectangle will be used to bring down the dropdown menu. Using the ‘text tool’, draw out a text box in the rectangle, insert the text ‘tools’, and in text boxes property panel, make sure the text is set to ‘static’.
Select the whole rectangle, and right click on it, select ‘copy’, and then right click somewhere on the stage, and select ‘paste’.
ALTERNATIVE/TIP: Place the rectangle in the position that you want it to be, and select the whole thing. Now press ‘Ctrl-c, now press, Ctrl-shift-v’. This will copy the rectangle, and paste it in the exact same position. Using the down arrow key, you can move it just underneath the other rectangle, and then it’s all in place.
Copy and paste the rectangle twice, so that you are left with 3 rectangles on the stage.
On one of the rectangles, double click on the text box, and change the text to ‘FAQ’, and on the other rectangle change the text to ‘Contact’.
Now select one of the rectangles (make sure the text is selected too, hold shift to select multiple things), right click, and select ‘convert to symbol’. Select the ‘button’ radio button, and then click OK. Convert the other two rectangles in to buttons using the same method, (select whole rectangle, right click, convert to symbol, button, OK)
Now position the button that says ‘tools’ on it, in the top left hand corner of the stage, The other two buttons have to go directly underneath, (the final positioning is exactly how you want the dropdown menu to appear, the rest will be done through actionscript).
Select the button with ‘FAQ’ written on it, and change in its property’s panel, give it an instance name of ‘faq_btn’ without the quotes!!!
Now for the ‘Contact’ button, change its instance name to ‘contact_btn’, again, without the quotes!!!
Right click on frame 1 of the ‘dropDown’ layer, and select actions. Insert the following code:

stop();
contact_btn._visible = false;
faq_btn._visible = false;

This tells flash that when the flash movie starts, we want it to be stopped on frame 1, and the contact button, is not to be visible, as well as the faq button.
Now right click on the button that says ‘tools’ on it, and select actions. Insert the following code:

on (release) {
if (_root.faq_btn._visible == false, _root.contact_btn._visible == false) {
_root.faq_btn._visible = true;
_root.contact_btn._visible = true;
} else if (_root.faq_btn._visible == true, _root.contact_btn._visible == true) {
_root.faq_btn._visible = false;
_root.contact_btn._visible = false;
}
}

This tells flash that when the button is release, if the faq button, and the contact button, are not visible, make them visible, and if they are already visible, to make them not visible.
Now right click on the faq button, select actions, and insert the following code:

on (release) {
gotoAndStop(2);
}

This tells flash that when the faq button is release, go to and stop at frame 2.
Right click on the contact button, and insert the following code:

on (release) {
gotoAndStop(3);
}

This tells flash that when the button is release, to go to and stop at frame 3.
That is it for the actions now. Now insert keyframes at frames 2 and 3 on the ‘dropDown’ layer.
All we need to do now is fill in the content layer. Insert keyframes on frames 2 and 3 on this layer as well. (the content layer).
On frame 2, using the ‘text tool’ simply insert the text, FAQ, at the top of the stage, and then just make up a couple of random questions and answers.
Now on frame 3, using the ‘text tool’ again, insert the text, CONTACT, and then perhaps just a fake email, phone number etc.
Now if you hit ‘Ctrl-Enter’, you’ll be able to click the tools button, and the other two options will appear underneath, click the either of the buttons’ and you’ll be taken to the specified frame, simply click on the tool button again, to hide the menu.
And that’s how you make a fully functional dropdown menu.

Flash Decompiler

2010-03-07T23:21:00.000-08:00

Flash Decompiler is a program used to edit flash video's and games. It can convert .swf files back to their original .fla file type, meaning you can open it up in flash and edit things etc.
This is great to learn how things are done in flash, and give an answer to "I wonder how that was done?'

Download a free 15 day trial :
Flash Decompiler Gold 2.3.1.1156

How to make a password

2010-03-06T21:51:00.000-08:00

In this tutorial we are going to make an input text field where the user needs to enter a password in order to play the flash file.

This is really easy to do.
Begin by selecting the ‘text tool’, and in the property box at the bottom, make sure it is set to ‘dynamic text’, and the text alignment is set to ‘Align Center’.
Now at the top of the stage, draw out a large text field that will fit the text, ‘invalid password’ in it. In the property’s box of this text field, underneath where it says, dynamic text, there will be an empty box, in this box, insert the following, ‘wrongPassword’. Without the quotes!!!
This text box will be used to let the user know if they have entered an invalid password.
Using the ‘text tool’ again, set it to ‘input text’, in the property’s box, and insert a text field on the stage. (This is where the user will enter a password). In the property box, underneath where it says, ‘input text’, write ‘my_passWord’, without the quotes!!!
And next to where it says Var: write, ‘passWord’, without the quotes.
Now we will need to insert a button, for the user to click after they have entered a password. Somewhere on the stage, using the ‘oval tool’, draw out an oval, where you want the submit button to be.
Now select the whole oval, right click on it, and then go down to ‘convert to symbol’, and make it a button.
Now right click on the button, and select ‘actions’, insert the following code:

on (release) {
if (_root.passWord == "cjay" == true) {
gotoAndStop(2);
} else {
_root.wrongPassword.text = "Invalid Passord";
gotoAndStop(1);
}
}

In the first line of code:

‘(_root.passWord == “cjay” == true) {

Change ‘cjay’ to whatever you want the password to be.
When the button is released, it checks to make sure that the password entered is cjay, and if it is it will go to the next frame.
Else
The text box we made before called wrongPassword, will display, the text ‘Invalid Password’ and it will stay at frame 1.
Now right click on frame 1 in layer 1, select ‘action’, and insert the following code:

stop();
my_passWord.password = true;

This code tells flash that to stop on this frame, and that the text entered is to be displayed with asterisks, as this hides the password.
Now right click on frame 2 of layer 1, select ‘insert keyframe’, and delete everything off this keyframe.
On this new keyframe, using the ‘text tool’ set it to ‘static text’, enter some text like, ‘the password you entered was accepted’.
And that’s it for this tutorial.

How to make a health bar

2010-03-05T17:01:00.000-08:00

Making a health bar with with flash 8 can be useful for many different types of flash games, and it doesn’t just have to be a health bar. It can be a petrol gauge in a racing flash game, a time left bar, a skill bar; pretty much anything that represents stats. Flash 8 works very well with numbers and stats, so it's good to learn as it is very commonly used when making flash games.

For this example, we’ll just use it as a health bar.
Begin by drawing out a rectangle on the stage, they’re you go, that’s it for the drawing part already. Select the whole rectangle, and in its property box at the bottom of the screen, you see W: meaning width, and H: meaning height, set the width to 120, and the height to 20. This is not necessary, but an average size health bar is around this in flash games.
Right click on the rectangle, go down to ‘convert to symbol’, and make it a ‘movie clip’. However, to the right, there is a registration grid, it is set to the middle by default, change it over to the left of the grid by clicking on the desired area on the grid, and then click OK.

Now right click on the rectangle movieclip, and select ‘actions’ from the menu, insert the following actionscript:

onClipEvent (enterFrame) {
this._xscale -= 1;
}
onClipEvent (enterFrame) {
if (this._xscale == 0) {
_root.gotoAndStop(2);
}
}

This code means that the xscale of the rectangle will go down by 1 every time flash 8 enters the frame.
If flash 8 enters the frame and the xscale is 0, flash will go to frame 2.
Right click on frame 1, and go down to ‘actions’, insert the following actionscript:

stop();

Now right click on frame 2, and select ‘insert keyframe’, this is the frame, where we will let the user know, that, they’re dead.
Delete the health bar from this frame, as there won’t be any by the time they reach frame 2 in the game, and insert the following text on the stage, ‘You died!!!’.
You could animate this text, add some graphics, or something like that.
And that's how you make a health bar using flash 8.
As I said, this learning how to use statistics and numbers using flash 8, is very useful for when it comes to making flash games.

Play free online flash games

2010-03-03T16:31:00.000-08:00

Games provided by miniclip.com

Action
3 FOOT NINJA
ON THE RUN
MONSTER TRUCKS
COMMANDO
KICKBOXING
TRIALS 2
CAB DRIVER
DESERT AMBUSH
FROST BITE
FROST BITE 2
POLICE PURSUIT
TRIBE

Shoot 'Em Up
RAILROAD RAMPAGE
OBAMA ALIEN DEFENSE
CLASH N SLASH
AIR BARONS
BOW MASTER
GUN RUN
TANKED UP
CASTLE CONQUEST
SNIPER
MOST WANTED
KING OF THE HILL
PAINTBALL

Sports
WINTER GAMES
MOUNTAIN BIKE
BASE JUMPING
JET SKI
SURF'S UP
GO KARTS
THE ASHES
MINI SOCCER
AIR SHOW
FIELD GOAL
SUPER TRUCKS
TIGER GOLF

Racing
FAST CAR FRENZY
MAX SPEED
RICH RACER
DOWN HILL CHILL
ICE RACER
POWER BOAT
FORMULA G1
SNOWBOARD MADNESS
CARAVAN RACERS
MINICLIP RALLY
WOOD RUNNER
HOT RODS
RURAL RACER

How to make an animated button

2010-03-01T19:25:00.000-08:00

If you aren’t familiar with making buttons, you can take a tutorial here

Begin by drawing out the shape you want to be a button, right click on it and select, ‘convert to symbol’.
Now double click on the button to enter its timeline.
Once in the button’s timeline, select the entire button, and right click on it and then go down to ‘convert to symbol’ again. This time, make sure the ‘movie clip’ radio button is checked, and then click OK.
This not change the whole button in to a movie clip, if you go back to the main timeline, flash will recognise the whole thing, as being a button still.
Now double click on the graphic you just converted in to a movie clip, to enter its timeline.
Here is where you can animate the button, notice how the timeline and frames are normal.
Animate it any way you want.
I made a button that has text on it that says ‘Click’. I inserted a keyframe at frame 10, and changed the text to ‘Here’, and inserted another keyframe at frame 20, so ‘Here’ appears for the same time as ‘Click’.
Now I have a button that say’s click, and shortly after it changes to here. This loops so my button displays it over and over.
Animate it anyway you want, that was just an idea for you, change the picture completely if you want.

Other tutorials you might like:

This tutorial has information in it to show you how to link buttons.

How to make glowing text

2010-03-01T17:27:00.000-08:00

Glowing text is a great effect, and it can be a great way to catch the users attention, which is why in this example I'll show you how to link the text to a website.
Begin by using the text tool and inserting the text that you want to add a glowing effect to.
I'm using the text 'Learn Flash 8 Pofessional'
Once you have done this, right click on the text, and choose 'convert to symbol'. Check the 'button' radio button, and click on OK.
Right click on this button, and go down to, 'actions'.
Now insert the following code:

on (release) {

getURL(http://www.learnflash8pro.blogspot.com/);
}

Now when the user clicks on the text it will take them to them to my website.
Simply replace the URL in the brackets with the URL you want, include http://www/.

Select the button, and open up it's propert pannel by clicking on the little Up arrow which it in the center of the screen, and at the bottom.
There will be three tabs here,
Properties, Filters and Parameters.
We need to use some Filters, so click on the Filters tab.
There will be a plus symbol, which is used to add filters, click on this and select 'Glow'.
(While you are using the filters, experiment by adding more filter and messing around with the settings,
THAT IS HOW YOU LEARN NEW THINGS, AND BECOME A BETTER USER OF FLASH PROFESSIONAL 8
Once you select glow, you can adjust the settings (to the left) to change the way it looks, larger glow, strength of glow etc.
And that's it, now you can add this to your game or movie, animate the text by making it move around the screen to catch the users attention even more.

How to make a movie clip drag able

2010-02-27T01:20:00.000-08:00

Add the following code to a movie clip to make it drag able:

onClipEvent (mouseDown) {

startDrag(this);
}
onClipEvent (mouseUp) {
stopDrag();
}

Common audio problem

2008-10-04T01:41:00.000-07:00

One of the most frequent questions I have been recieving How do you import audio and preview it simply by moving the playhead. This is very simple, first of all, import the audio that you want to the library. Rename layer 1 audio. Drag the audio file from the library to the stage on the first keyframe. insert another key frame where the audio ends, if the audio has ended the wave line will just be a straight line. Once you have established the audio ending point, click on the first keyframe of the audio layer, and in the properties inspector, you will see an option that says sync, click on the drop down menu and set it to stream. Click on the last keyframe and change the sync option to stop, this is so the audio will stop playing when it reached the specified keyframe.
Now move the playhead along the timeline and the audio will play at wherever the playhead is.

How to make your character walk with the arrow keys

2008-10-03T20:21:00.000-07:00

Insert an additional layer so that you will now have two layers; name the top layer actions, and the bottom layer character.
On the first frame of the character layer, draw out your character facing to the left of the stage. Convert it into a movie clip and name it stand still. Right click on stand still in the library and select duplicate, name the duplicate walk left. Double click on the walk left symbol in the library and animate him walking right. IMPORTANT NOTE: Don’t actually make him move to the right; just animate the legs as if he was walking right.
When you have done that, click back to the main timeline.
Now right click on the walk left movie clip in the library and name the duplicate walk right.
Double click on the walk right movie clip to enter it timeline and then select modify from the top menu options, transform and flip horizontal. Now click back to the main timeline.
On the first frame of the character drag an instance of the stand still move clip to the centre of the stage, give it an instance name of standStill. Double click on this move clip and insert a blank keyframe at frame 2. Then drag an instance of the walk left move clip to the centre of the stage making sure it is in the same position as the stand still move clip was. Insert another blank keyframe where, then drag an instance of the walk right movie clip from the library and position in the centre of the stage, as before make sure this is in the same position the walk left was, only is will be facing the opposite direction.
Insert a new layer, and name it actions, right click on the first frame and select actions, add the following code:
Stop();

Now click back to the main timeline.
Right click on the first frame of the actions layer, and select actions, add the following code:
//if the left arrow key is down, go to frame to of this movie clip and also move left.
standStill.onEnterFrame = function() {
if(Key.isDown(Key.LEFT)) {
this._x+=4;
this.gotoAndStop(2);
}
else if(Key.isDown(Key.RIGHT)) {
this._x-=4;
this.gotoAndStop(3);
}
//if none of the above is happening, stop on frame 1
else this.gotoAndStop(1);
}

Well done, that is all you need to do.
As I always say: any questions Email me at: learn_flash_pro_makeitsimple_now@hotmail.com

How to make a website

2008-10-03T19:16:00.000-07:00

We will start by inserting the required layers, insert 4 additional layers.
In order from the bottom layer to the top layer, sections, title, stitle, navigate and actions(the order does not matter too much, this is the order I used).
Select modify from the top menu bar, than select the option document, change the background colour(preferably not white).
We will now insert all the required keyframes and frames needed to make the website.
Actions- Insert a frame at frame 4
Navigate- Insert a frame at frame 4
Stitle- Insert a keyframe in frames 2, 3 and 4 leaving you with 4 key frame in the layer.
Title- Insert a frame in frame 4
Sections- Insert a keyframe at frames 2, 3 and 4 leaving you with 4 keyframes.

Select the window option from the top menu bar, then select the option components.
Under the user interface section, double click on the button option.
Now there will be a on the stage and one in the library. Drag the button to the left of the stage(this will be so the user can navigate between pages).
NOTE: Make sure the button is on the navigate layer.
When you have positioned it where you want it, select it, then press:
Ctrl C
To Copy the Button
Ctrl Shit V
To Paste the Button In Place.

Using the arrow keys, position the copied button underneath the previous button(you may put this next to your button, depending on your layout).
Using the same method, ctrl c and ctrl sift v, put another button underneath the copied button. Now copy and paste one more under the button you just pasted, you should now be left with for buttons.
Now we don’t want the button name to be button obviously, however, we change the name using a different method when using a compiled button.
Select top button, now open up the properties inspector, then click on the tab labeled parameters. Just under icon, there will be a box that says label in it, next to it there will be a box that says button, change the box that says button to Home.
Give it an instance name of homepage. (the main page for a website)
Now select the bottom underneath the home button, and label it Tutorials, give it an instance name of tutorials.
Select the button under Tutorials and label it Tips, give it an instance name of tips also.
Select the button underneath tips and label it Did You Know? Give it an instance name of dyk.

We will now apply all the actions that will be required for the website.
Right click on the first frame in the actions layer, and select the option actions.
On the first line type in:
stop();
tutorials.onRelease = function() {
gotoAndStop(2);
}
tips.onRelease = function() {
gotoAndStop(3);
}
dyk.onRelease = function() {
gotoAndStop(4);
}
homepage.onRelease = function() {
gotoAndStop(1);
}

Now lets put the sections together. On the second keyframe in the sections layer, write out something like, “Welcome to my website”.
On the third keyframe of the sections layer write out something like “Great tips to get you started”.
On the fourth frame of the sections layer write out something like “Did you know http://www.learnflash8pro.blogspot.com/ is a great site for learning flash”.
Now for the first frame of the title layer, we want to insert the name of a website, for example, I would insert the text Learn Flash 8 Professional. This title will appear on every frame so make sure that it does not interfere with any of the other pages.
Last but now least the Stitle layer, this is to simple name the current page, so for example on the first frame you would write something like, homepage, the second would say tutorials and so on.(it is basically to tell the user what the current page features).
And that is how you make a website using flash, add some animations to make it look a bit better, it's always good to have an attractive website.

How to make a banner in flash

2008-10-03T06:13:00.001-07:00

In this tutorial you will be making a website banner, which is commonly used for advertising. And, it is super easy to make a banner in flash!
Here is what you will achieve:
You will get the banner to appear, and when the user clicks on the banner, it will take them to most likely a website link.
Start by drawing out a rectangle using the rectangle tool(this is how big your banner will be).
Using the text tool(static text), draw out a text box, and insert some text relating to the site, and possibly an image! For this banner it will be “Learn Flash 8 Professional”.
After you have added text to the banner, feel free to add anything else to make it more appealing. Convert the banner into a button, and name it button. Give the banner an instance name of banner_btn.
Now insert a new layer and name it Actions.
Right click on frame 1 of the actions layer and select actions. On the first line type in:

banner_btn.onRelease = function() {
getURL("http://www.learnflash8pro.blogspot.com/");
}

What this does is when the user releases the mouse on the banner it directs them to the website input in the actionscript panel. The only thing you would need to change would be the URL of the website(the URL is inside the brackets).

And that's how to make a banner in flash!