Forums → Programming Forum → A Step By Step Guide on Making Your Very First Adobe Flash CS3/CS4 Program

16	11770

offline

Axel

475 posts

Nomad

Posted February 24, '10 1:55am UTC

So you want to make your first flash game! Lets get started.

Pre-Makeing:

First you have to do these steps. AKA how do download flash.

1. Go here and click on the try button.

2. Install Adobe Flash CS4/CS3.

3. Open Adobe Flash.

Making the Game:

1. Create a circle.

1. Click on the rectangle located on the bar on the right.

2. Click on it again (Double Click) and select Oval tool.

3. On the white rectangle box in the middle of the program, click and drag the mouse while holding down SHIFT.

You have created a circle. DONE!

2. Turn it into a symbol.

1. Click on the circle.

2. Click on Window > Convert to Symbol.

3. Name your symbol Button.

DONE! Now your circle is a "symbol" that is called Button!

3. Give it a insurance name of "button".

1. Click on the "Properties" tab located on the top-right.

2. Click on the Button (The Circle).

3. On the space that says, "Insurance name", put "Button".

DONE!

4. Give it actionscript.

1. On the "Layer" on the bottom of the screen, right-click and click on "Insert New Layer".

2. Click on the small WHITE box. (Not Gray.)

2. Click on the box above the "Layers" that says Actions - Frame. (If you don't see it, make sure Window > Actions is checked.)

3. On the box given, put this in:

Button.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
function mouseDownHandler(event:MouseEvent):void {
navigateToURL(new URLRequest("http://www.Armorgames.com/&quot);
}

You just made your first flash game. Congrats. Click on Control > Test Movie to play your game. If everything went right, when you click on Button, it will open ArmorGames.com.

Questions, comments, something went wrong? Post here.

So you want to make your first flash game! Lets get started.\r\n\r\nPre-Makeing:\r\n\r\nFirst you have to do these steps. AKA how do download flash.\r\n\r\n1. Go [url=http://www.adobe.com/products/flash/?promoid=BPDEE]here[/url] and click on the try button.\r\n[img]http://i49.tinypic.com/sls9rm.jpg[/img]\r\n\r\n\r\n2. Install Adobe Flash CS4/CS3.\r\n\r\n3. Open Adobe Flash.\r\n\r\n[b]Making the Game:[/b]\r\n\r\n[b]1. Create a circle.[/b]\r\n\r\n1. Click on the rectangle located on the bar on the right.\r\n\r\n[img]http://i46.tinypic.com/2m800zp.jpg[/img]\r\n[img]http://i45.tinypic.com/zojbq0.jpg[/img]\r\n\r\n2. Click on it again (Double Click) and select Oval tool.\r\n[img]http://i47.tinypic.com/m7atqr.jpg[/img]\r\n\r\n3. On the white rectangle box in the middle of the program, click and drag the mouse while holding down SHIFT.\r\n[img]http://i50.tinypic.com/2hhi2yx.jpg[/img]\r\n\r\nYou have created a circle. DONE!\r\n\r\n[b]2. Turn it into a symbol.[/b]\r\n\r\n1. Click on the circle.\r\n\r\n2. Click on Window > Convert to Symbol.\r\n[img]http://i48.tinypic.com/14v48xg.jpg[/img]\r\n\r\n3. Name your symbol Button.\r\n[img]http://i46.tinypic.com/jl71n7.jpg[/img]\r\n\r\nDONE! Now your circle is a "symbol" that is called Button!\r\n\r\n[b]3. Give it a insurance name of "button".[/b]\r\n\r\n1. Click on the "Properties" tab located on the top-right.\r\n\r\n2. Click on the Button (The Circle).\r\n\r\n3. On the space that says, "Insurance name", put "Button".\r\n[img]http://i46.tinypic.com/o0c94m.jpg[/img]\r\n\r\nDONE!\r\n\r\n[b]4. Give it actionscript.[/b]\r\n\r\n1. On the "Layer" on the bottom of the screen, right-click and click on "Insert New Layer".\r\n\r\n[img]http://i46.tinypic.com/1zw1yqw.jpg[/img]\r\n\r\n2. Click on the small WHITE box. (Not Gray.)\r\n\r\n[img]http://i47.tinypic.com/2yzjyfk.jpg[/img]\r\n\r\n2. Click on the box above the "Layers" that says Actions - Frame. (If you don't see it, make sure Window > Actions is checked.)\r\n\r\n[img]http://i50.tinypic.com/2nsyjrn.jpg[/img]\r\n\r\n3. On the box given, put this in:\r\n\r\nButton.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);\r\nfunction mouseDownHandler(event:MouseEvent):void {\r\n    navigateToURL(new URLRequest("http://www.Armorgames.com/"));\r\n}\r\n\r\n\r\n\r\n\r\nYou just made your first flash game. Congrats. Click on Control > Test Movie to play your game. If everything went right, when you click on Button, it will open ArmorGames.com.\r\n\r\nQuestions, comments, something went wrong? [b]Post here.[/b]

16 Replies

offline

BeastMode10

374 posts

Nomad

Posted February 24, '10 3:20am UTC

No offense, but I'd rather not waste a perfectly good demo just to make a hyperlink.

offline

Axel

475 posts

Nomad

Posted February 24, '10 3:41am UTC

Its not really the hyperlink that matters. Its now this can be expanded really easyly. If you replace it with
stop()
Button.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
function mouseDownHandler(event:MouseEvent):void {
nextFrame();
}

You can make a game from there. The hyperlink is just a example of what you can do.

offline

Darkroot

2,763 posts

Peasant

Posted February 24, '10 7:50am UTC

Yeah but there is really little you can do with that if you don't know more code. It basically a button that could be created without actionscript. If I were you I would of explained and did more with event listeners and functions.

Also if you want your code to be betterish then you should make your event listeners to be more garbage collection friendly.

Button.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler, false, 0, true);

So flash player is able to purge memory from objects that are not needed. So all those eventlistners don't eat at all your memory.

offline

kingryan

4,196 posts

Farmer

Posted February 24, '10 8:42am UTC

Axel, as a FailFlasher...it would probably be nicer if you could do a tutorial that helps us move the circle with the arrow keys.

I worked out how to make a button a while ago...but couldn't find a tutorial to get me any further...

offline

plasmafish

252 posts

Nomad

Posted February 24, '10 6:49pm UTC

I think that I made a decent game for download. I left out things like score and weapons and damage, but that is because it took me a decent time to program it in myself. Nothing huge in life comes for free, unless you stole it.

http://3dmitchell.com/freeDL/gametutFLASH8.swf

The FLA is in flash 8 format.
http://3dmitchell.com/freeDL/gametutFLASH8.fla

offline

Axel

475 posts

Nomad

Posted February 25, '10 12:55am UTC

Ok, so tell me things you want the button to do.

If you want the button to move with the arrow keys, heres the code, Kingryan:

//these booleans will check which keys are down
var leftDown:Boolean = false;
var upDown:Boolean = false;
var rightDown:Boolean = false;
var downDown:Boolean = false;
//how fast the character will be able to go
var mainSpeed:int = 5;

//adding a listener to Button that will move the character
Button.addEventListener(Event.ENTER_FRAME, moveChar);
function moveChar(event:Event):void{
//seeing if the arrow keys are down, then moving the char
//if they are
if(leftDown){
mcMain.x -= mainSpeed;
}
if(upDown){
mcMain.y -= mainSpeed;
}
if(rightDown){
mcMain.x += mainSpeed;
}
if(downDown){
mcMain.y += mainSpeed;
}
//keeping the main character within the playing field
if(mcMain.x <= 0){
mcMain.x += mainSpeed;
}
if(mcMain.y <= 0){
mcMain.y += mainSpeed;
}
if(mcMain.x >= stage.stageWidth - mcMain.width){
mcMain.x -= mainSpeed;
}
if(mcMain.y >= stage.stageHeight - mcMain.height){
mcMain.y -= mainSpeed;
}
}
//this listener will listen for down keystrokes
stage.addEventListener(KeyboardEvent.KEY_DOWN, checkKeysDown);
function checkKeysDown(event:KeyboardEvent):void{
//Also moving with the WASD keys
if(event.keyCode == 37 || event.keyCode == 65){
leftDown = true;
}
if(event.keyCode == 38 || event.keyCode == 87){
upDown = true;
}
if(event.keyCode == 39 || event.keyCode == 68){
rightDown = true;
}
if(event.keyCode == 40 || event.keyCode == 83){
downDown = true;
}
}
//this listener will listen for keys being released
stage.addEventListener(KeyboardEvent.KEY_UP, checkKeysUp);
function checkKeysUp(event:KeyboardEvent):void{
//making the booleans false based on the keycode
if(event.keyCode == 37 || event.keyCode == 65){
leftDown = false;
}
if(event.keyCode == 38 || event.keyCode == 87){
upDown = false;
}
if(event.keyCode == 39 || event.keyCode == 68){
rightDown = false;
}
if(event.keyCode == 40 || event.keyCode == 83){
downDown = false;
}
}

Ok, so tell me things you want the button to do.\r\n\r\nIf you want the button to move with the arrow keys, heres the code, Kingryan:\r\n\r\n//these booleans will check which keys are down\r\nvar leftDown:Boolean = false;\r\nvar upDown:Boolean = false;\r\nvar rightDown:Boolean = false;\r\nvar downDown:Boolean = false;\r\n//how fast the character will be able to go\r\nvar mainSpeed:int = 5;\r\n \r\n//adding a listener to Button that will move the character\r\nButton.addEventListener(Event.ENTER_FRAME, moveChar);\r\nfunction moveChar(event:Event):void{\r\n//seeing if the arrow keys are down, then moving the char\r\n//if they are\r\n        if(leftDown){\r\n		mcMain.x -= mainSpeed;\r\n	}\r\n	if(upDown){\r\n		mcMain.y -= mainSpeed;\r\n	}\r\n	if(rightDown){\r\n		mcMain.x += mainSpeed;\r\n	}\r\n	if(downDown){\r\n		mcMain.y += mainSpeed;\r\n	}\r\n	//keeping the main character within the playing field\r\n	if(mcMain.x <= 0){\r\n		mcMain.x += mainSpeed;\r\n	}\r\n	if(mcMain.y <= 0){\r\n		mcMain.y += mainSpeed;\r\n	}\r\n	if(mcMain.x >= stage.stageWidth - mcMain.width){\r\n		mcMain.x -= mainSpeed;\r\n	}\r\n	if(mcMain.y >= stage.stageHeight - mcMain.height){\r\n		mcMain.y -= mainSpeed;\r\n	}\r\n}\r\n//this listener will listen for down keystrokes\r\nstage.addEventListener(KeyboardEvent.KEY_DOWN, checkKeysDown);\r\nfunction checkKeysDown(event:KeyboardEvent):void{\r\n	//Also moving with the WASD keys\r\n	if(event.keyCode == 37 || event.keyCode == 65){\r\n		leftDown = true;\r\n	}\r\n	if(event.keyCode == 38 || event.keyCode == 87){\r\n		upDown = true;\r\n	}\r\n	if(event.keyCode == 39 || event.keyCode == 68){\r\n		rightDown = true;\r\n	}\r\n	if(event.keyCode == 40 || event.keyCode == 83){\r\n		downDown = true;\r\n	}\r\n}\r\n//this listener will listen for keys being released\r\nstage.addEventListener(KeyboardEvent.KEY_UP, checkKeysUp);\r\nfunction checkKeysUp(event:KeyboardEvent):void{\r\n	//making the booleans false based on the keycode\r\n	if(event.keyCode == 37 || event.keyCode == 65){\r\n		leftDown = false;\r\n	}\r\n	if(event.keyCode == 38 || event.keyCode == 87){\r\n		upDown = false;\r\n	}\r\n	if(event.keyCode == 39 || event.keyCode == 68){\r\n		rightDown = false;\r\n	}\r\n	if(event.keyCode == 40 || event.keyCode == 83){\r\n		downDown = false;\r\n	}\r\n}

offline

Axel

475 posts

Nomad

Posted February 25, '10 1:00am UTC

Opps, use this instead,
Use this insted, opps...
var leftDown:Boolean = false;
var upDown:Boolean = false;
var rightDown:Boolean = false;
var downDown:Boolean = false;
var mainSpeed:int = 5;

Button.addEventListener(Event.ENTER_FRAME, moveChar);
function moveChar(event:Event):void{
if(leftDown){
Button.x -= mainSpeed;
}
if(upDown){
Button.y -= mainSpeed;
}
if(rightDown){
Button.x += mainSpeed;
}
if(downDown){
Button.y += mainSpeed;
}
if(Button.x <= 0){
Button.x += mainSpeed;
}
if(Button.y <= 0){
Button.y += mainSpeed;
}
if(Button.x >= stage.stageWidth - Button.width){
Button.x -= mainSpeed;
}
if(Button.y >= stage.stageHeight - Button.height){
Button.y -= mainSpeed;
}
}
stage.addEventListener(KeyboardEvent.KEY_DOWN, checkKeysDown);
function checkKeysDown(event:KeyboardEvent):void{
if(event.keyCode == 37 || event.keyCode == 65){
leftDown = true;
}
if(event.keyCode == 38 || event.keyCode == 87){
upDown = true;
}
if(event.keyCode == 39 || event.keyCode == 68){
rightDown = true;
}
if(event.keyCode == 40 || event.keyCode == 83){
downDown = true;
}
}
stage.addEventListener(KeyboardEvent.KEY_UP, checkKeysUp);
function checkKeysUp(event:KeyboardEvent):void{
if(event.keyCode == 37 || event.keyCode == 65){
leftDown = false;
}
if(event.keyCode == 38 || event.keyCode == 87){
upDown = false;
}
if(event.keyCode == 39 || event.keyCode == 68){
rightDown = false;
}
if(event.keyCode == 40 || event.keyCode == 83){
downDown = false;
}
}

Opps, use this instead,\r\nUse this insted, opps... \r\nvar leftDown:Boolean = false;\r\nvar upDown:Boolean = false;\r\nvar rightDown:Boolean = false;\r\nvar downDown:Boolean = false;\r\nvar mainSpeed:int = 5;\r\n\r\nButton.addEventListener(Event.ENTER_FRAME, moveChar);\r\nfunction moveChar(event:Event):void{\r\n        if(leftDown){\r\n        Button.x -= mainSpeed;\r\n    }\r\n    if(upDown){\r\n        Button.y -= mainSpeed;\r\n    }\r\n    if(rightDown){\r\n        Button.x += mainSpeed;\r\n    }\r\n    if(downDown){\r\n        Button.y += mainSpeed;\r\n    }\r\n    if(Button.x <= 0){\r\n        Button.x += mainSpeed;\r\n    }\r\n    if(Button.y <= 0){\r\n        Button.y += mainSpeed;\r\n    }\r\n    if(Button.x >= stage.stageWidth - Button.width){\r\n        Button.x -= mainSpeed;\r\n    }\r\n    if(Button.y >= stage.stageHeight - Button.height){\r\n        Button.y -= mainSpeed;\r\n    }\r\n}\r\nstage.addEventListener(KeyboardEvent.KEY_DOWN, checkKeysDown);\r\nfunction checkKeysDown(event:KeyboardEvent):void{\r\n    if(event.keyCode == 37 || event.keyCode == 65){\r\n        leftDown = true;\r\n    }\r\n    if(event.keyCode == 38 || event.keyCode == 87){\r\n        upDown = true;\r\n    }\r\n    if(event.keyCode == 39 || event.keyCode == 68){\r\n        rightDown = true;\r\n    }\r\n    if(event.keyCode == 40 || event.keyCode == 83){\r\n        downDown = true;\r\n    }\r\n}\r\nstage.addEventListener(KeyboardEvent.KEY_UP, checkKeysUp);\r\nfunction checkKeysUp(event:KeyboardEvent):void{\r\n    if(event.keyCode == 37 || event.keyCode == 65){\r\n        leftDown = false;\r\n    }\r\n    if(event.keyCode == 38 || event.keyCode == 87){\r\n        upDown = false;\r\n    }\r\n    if(event.keyCode == 39 || event.keyCode == 68){\r\n        rightDown = false;\r\n    }\r\n    if(event.keyCode == 40 || event.keyCode == 83){\r\n        downDown = false;\r\n    }\r\n}

offline

kingryan

4,196 posts

Farmer

Posted February 25, '10 10:18am UTC

That didn't quite work...

Got something along the lines of:

offline

tehQED

33 posts

Nomad

Posted February 25, '10 3:21pm UTC

kingryan, you have to label the object 'Button.' Go to the timeline, click the object once, then type 'Button' in the box in the lower left hand corner

offline

plasmafish

252 posts

Nomad

Posted February 25, '10 9:41pm UTC

"On the space that says, "Insurance name", put "Button"."

Yeah kids, make sure to name your insurance.

offline

rjbman

215 posts

Nomad

Posted February 25, '10 11:08pm UTC

Umm, that's instance. No offense, but I doubt you need insurance on a few lines of code.

offline

Axel

475 posts

Nomad

Posted February 26, '10 12:51am UTC

You was not following my guide!

All you have to do is Step Three, and it should work. I already tested it, Kingryan.

Hope this helps!

offline

mystera

39 posts

Nomad

Posted February 26, '10 9:35am UTC

Umm i think it's called "Instance" not Insurance.

offline

plasmafish

252 posts

Nomad

Posted February 26, '10 9:52am UTC

Umm i think it's called "Instance" not Insurance.

Exactly, he should proofread before posting a tutorial.

offline

mystera

39 posts

Nomad

Posted February 26, '10 12:28pm UTC

Exactly...or else people would take a hard time locating the right hting.

Showing 1-15 of 16

Categories

Quests

Community

Forums → Programming Forum → A Step By Step Guide on Making Your Very First Adobe Flash CS3/CS4 Program