[Joseph]

This is a tutorial that will teach you some of the basics of ActionScript. Which is the programming language used with (Adobe) Macromedia Flash. This tutorial will take you through things step-by-step. I am presuming that you have no knowledge of Flash or ActionScript.

First I will begin to explain to you what Flash's capabilities are and how you can use them to create great things. You can use Flash to make games (generally fairly simple and basic), great-looking and interesting web sites, other applications, and animated movies. Although, I cannot animate and will not be telling you how to animate.

Ok, so if you do not already have some version of Flash, you can download a 30-day free trial of Flash 8 via www.maromedia.com and then get the activation for free with a Google search. Alright, now open up Flash (It will take a second) and then click on 'Flash Document' under the 'Create New' menu. Now on the left hand of your screen, you will see a toolbar with a lot of different things: Pencil tool, line tool, shape tool, selector, etc. Take a moment to look over them and look all through the menus and such.

Up at the top you will see what is called the timeline. It has increments of 1, 5, 10, 15, and so on. That is how you would animate a movie and even do some things when creating games. Now, go to 'Modify' and then select 'Document' This brings up a page where it has blanks for the title and description of you creation (you can leave those blank), demensions for the stage that you will be working on (this will also be the size of the window that your game will be viewed in), a background color and frame-rate in FPS (Frames per second.) This option can really speed up your game if it is boring and running slow. Those options are pretty much self-explanitory; feel free to edit them however you like.


Alright, now I will teach you how to make a character move. Lets start out with something extremely simple -- say a ball. Select the circle shape tool from the toolbar make a small circle. Now use the subselection tool, which is on the top right hand corner of the toolbar. Make it so your ball is in the center of the selection. Now click on it and hit F8 or go to the 'Modify' and select 'Convert to Symbol.' Now you will want to make sure that 'Movie Clip' is selected insted of 'Graphic' or 'Button.' Now select your ball again and go to 'Window' and then to 'Actions.' Next copy and paste the following code into the actions menu.


Code:

onClipEvent (enterFrame) {
if (Key.isDown(Key.UP)) {
_y -= 10;
}
}
onClipEvent (enterFrame) {
if (Key.isDown(Key.DOWN)) {
_y -= -10;
}
}
onClipEvent (enterFrame) {
if (Key.isDown(Key.LEFT)) {
_x -= 10;
}
}
onClipEvent (enterFrame) {
if (Key.isDown(Key.RIGHT)) {
_x -= -10;
}
}



Next, go to 'Control' and select 'Test Movie.' Now you can see what your game looks like so far. You can now control your ball or character with the arrow keys. Although, if you'll look over the code, you will see where it says UP, DOWN, LEFT, and RIGHT; you can edit those to SPACE or whatever you want.

That code is about the simplest that there is in the entire world of ActionScript. But now let's get into something a tad more complicated. Although, this time there is hardly any work needed whatsoever. In fact, it is as simple as opening up a new document and reopening the Actions menu like you did before. (We are really going to be adding this code to frame1 but it should already be selected so I didn't want to confuse you.) Next, add the following code to it.

Code:

//import classes
import flash.display.*;
import flash.geom.*;
//screen settings
var screen:BitmapData = new BitmapData(Stage.width, Stage.height, false, 0);
var centreLine:Rectangle = new Rectangle(Stage.width / 2 - 1, 0, 2, Stage.height);
this.attachBitmap(screen, 1);
//ball settings
var ballRad:Number = 2;
var ball:Rectangle = new Rectangle(0, 0, ballRad * 2, ballRad * 2);
var velocity:Object = new Object();
reset();
//paddle settings
var paddleWidth:Number = 4;
var paddleHeight:Number = 50;
var playerPaddle:Rectangle = new Rectangle(Stage.width - 10 - paddleWidth / 2, Stage.height / 2 - paddleHeight / 2, paddleWidth, paddleHeight);
var computerPaddle:Rectangle = new Rectangle(0 + 10 - paddleWidth / 2, Stage.height / 2 - paddleHeight / 2, paddleWidth, paddleHeight);
//score settings
var playerScore:Number = 0;
var computerScore:Number = 0;
var playerScoreText:TextField = this.createTextField("playerScoreText", 2, Stage.width / 2 + 50, 20, 0, 0);
var computerScoreText:TextField = this.createTextField("computerScoreText", 3, Stage.width / 2 - 60, 20, 0, 0);
playerScoreText.autoSize = computerScoreText.autoSize = true;
playerScoreText.selectable = computerScoreText.selectable = false;
playerScoreText.textColor = computerScoreText.textColor = 0xFFFFFF;
playerScoreText.variable = "playerScore";
computerScoreText.variable = "computerScore";
onEnterFrame = function ():Void {
//reset screen
screen.fillRect(screen.rectangle, 0);
screen.fillRect(centreLine, 0xFFFFFF);
//player paddle movement
if (Key.isDown(Key.UP)) {
playerPaddle.y -= 5;
}
if (Key.isDown(Key.DOWN)) {
playerPaddle.y += 5;
}
screen.fillRect(playerPaddle, 0xFFFFFF);
//computer paddle movement
if (velocity.x < 0) {
if (ball.y < computerPaddle.y + paddleHeight / 2) {
computerPaddle.y -= Math.abs(velocity.y) - 0.5;
} else {
computerPaddle.y += Math.abs(velocity.y) - 0.5;
}
}
screen.fillRect(computerPaddle, 0xFFFFFF);
//ball movement
ball.x += velocity.x;
ball.y += velocity.y;
if (ball.y > Stage.height - ballRad) {
ball.y = Stage.height - ballRad;
velocity.y *= -1.0;
} else if (ball.y < 0 + ballRad) {
ball.y = 0 + ballRad;
velocity.y *= -1.0;
}
if (ball.x > Stage.width - ballRad) {
reset();
computerScore++;
} else if (ball.x < 0) {
reset();
playerScore++;
}
if (playerPaddle.x - ball.x < Math.abs(velocity.x)) {
if (ball.y > playerPaddle.y && ball.y < playerPaddle.y + paddleHeight) {
ball.x = playerPaddle.x - ballRad - paddleWidth / 2;
velocity.x *= -1.1;
}
} else if (ball.x - computerPaddle.x < Math.abs(velocity.x)) {
if (ball.y > computerPaddle.y && ball.y < computerPaddle.y + paddleHeight) {
ball.x = computerPaddle.x + paddleWidth / 2;
velocity.x *= -1.1;
}
}
screen.fillRect(ball, 0xFFFFFF);
};
function reset():Void {
ball.x = Stage.width / 2 - ballRad;
ball.y = Stage.height / 2 - ballRad;
velocity.x = randNum(6, 3);
velocity.y = randNum(6, 3);
computerPaddle.y = playerPaddle.y = Stage.height / 2 - paddleHeight / 2;
}
function randNum(max:Number, min:Number):Number {
return (Math.floor(min + Math.random() * (max - min)));
}



Now, select 'Test Movie' again and test out your game. It is a fairly complex pong game. (You control your padal with the arrow keys.) This code uses BitMap Data, which is one of the latest and greatest things in the world of Flash and ActionScript. It also uses fairly sofisticated artificial intelligence (A.I.). The computer player is actually quite smart.

Well, I hope my little tutorial helped you out atleast a little bit. I strongly encourage you to visit the Action Script library at: http://syboard.net/c...hp?showforum=18 where they have more advanced tutorials and tons of ActionScript code and tools that will help you as you improve. I might add some more here later, but you can find most of my other ones there.

So long... ^_^