PDA

View Full Version : Matt's Rock Solid Tutorial and Engine Source


Matt
12-26-2006, 12:02 PM
Matt's Rock Solid Tutorial and Engine Source
Back and better.
Old stuff but new coming.
http://www.kyujjistudios.com/nekohost/files/7/MRSTaES.png
All engines/tutorials copyright ComputerTurret and Matt Thomas (me)

Enjoy!



Drawing shapes using AS

So you can make a line using AS? Whats next? Shapes of cource!

The thing is drawing with AS is all about coordinates.


On the frame.

_root.lineStyle(1, 0x000000);
//change "1" to the lines thickness
//change 0x000000 to a number from different colors
_root.moveTo(250, 250);
//this is the starting spot for the line
//always put the x position first then the y position
_root.lineTo(300, 250);
//this is the ending spot for the line
_root.moveTo(300, 250);
_root.lineTo(300, 300);
_root.moveTo(300, 300);
_root.lineTo(250, 300);
_root.moveTo(250, 300);
_root.lineTo(250, 250);


This makes a square.
Have fun!

SOS system

The easiest way to make a command sos system.

First make 2 text boxes. A larger dynamic text box. Give it the var of “info”
Now make a smaller imput text box above it and give it the var of “command”
Now make an invisible MC(movie clip)
Give it the following code.
onClipEvent(enterFrame){
//MC handler
if(_root.command=="Help"&&Key.isDown(Key.ENTER)){
//checks if the variable named command equals “Help”
//Checks if the enter Key is down.
_root.info+=_root.commandlist
//Adds the variable called “commandlist” to the variable called “info”
}
if(_root.command=="Refresh"&&Key.isDown(Key.ENTER)){
//checks if the variable named command equals “Refresh”
//Checks if the enter Key is down.
_root.play()
//Plays the main timeline.
}
if(_root.command=="Clear"&&Key.isDown(Key.ENTER)){
//checks if the variable named command equals “Clear”
//Checks if the enter Key is down.
_root.info=" "
Sets the variable named info to a blank space.
}
}
//closes brackets.

You can add more things to the list these are only examples.

Now one last thing. On the frame put
stop()
_root.commandlist=">Command-Effect>Help-Gives list of commands>Clear-Clears info>Refresh-Refreshes page"
Now create a lank key frame after this one.
http://www.kyujjistudios.com/nekohost/files/7/Command%20sos%20screenshot.JPG


Connecting MC's using AS
On the frame.

_root.lineStyle(1, 0x000000);
//change "1" to the lines thickness
//change 0x000000 to a number from different colors
_root.moveTo(_root.m1._x, _root.m1._y);
//this is the starting spot for the line
//always put the x position first then the y position
_root.lineTo(_root.m2._x, _root.m2._y);
//this is the ending spot for the line

//m1 and m2 and the movie clips instance names
//change them to the instance names of your movie clips

Drawing a line using AS

On the frame.

_root.lineStyle(1, 0x000000);
//change "1" to the lines thickness
//change 0x000000 to a number from different colors
_root.moveTo(250, 250;
//this is the starting spot for the line
//always put the x position first then the y position
_root.lineTo(300, 300);
//this is the ending spot for the line

Movement and characters.

First to create your guy use the circle tool and use it to draw a circle. Select the whole circle. Right click on it and go down to convert to symbol. Select movie clip from the pop up and the centre option. (See diagrams for all this)

Great now let’s open up the action panel for character.
Click on the new MC (movie clip)
And open up the panel near the bottom of the screen.
Now copy and paste this code in. I’ll explain the code as we go.
onClipEvent(enterFrame){
//this is a handler that you use on MC’s.
if (Key.isDown(Key.UP)) {
//checks if the up key is down(pressed)
this._y -= 5
//subtracts 5 pixles from the charcter’s y coordinates
}
if (Key.isDown(Key.DOWN)) {
//checks if the down key is down(pressed)
this._y += 5
//adds 5 pixles from the charcter’s y coordinates
}
if (Key.isDown(Key.RIGHT)) {
//checks if the right key is down(pressed)
this._x += 5
//adds 5 pixles from the charcter’s x coordinates
}
if (Key.isDown(Key.LEFT)) {
//checks if the left key is down(pressed)
this._x -= 5
//subtracts 5 pixles from the charcter’s x coordinates
}
}
Now test it. (control+enter)
And use the arrow keys to move!
http://www.kyujjistudios.com/nekohost/files/7/Movement%20screenshots.JPG

Randoms

Random's can be very helpful in flash.

_root.variable=random(30)

explanation
"_root."
This means your talking about the main time line

"variable"
This is a variable that you want to set to a random number. You may want to have a random amount of money or a certain skill. Change "variable" to the var of your stat.

"="
This means your setting what ever is in front of it to equal what ever is after it.

"random(30)"
This "randomly" picks a number from 0-"30"
See the connection?
change "30" to what ever number you want.

Example
_root.money=random(100)
The variable "money" well be set to a random number between 0 and 100.

You can also do this

_root.money=random(100)+50
The variable "money" well be set to a number from 50-150

RPG TUTORIAL

Ok lets get started.

PART I

First open flash. (I’m using mx pro 2004)
Next choose to make a new flash document.

Setting up Stats

Now make 1 input text box and 5 dynamic text boxes.
Now in the input text box name the “Var” (in properties once you select the text) “name” without the “’s ok.
Now the 1st dynamic textbox call it something like “strength”
The next “smarts”
The next “money”
The next “charm”
And last one put the “Var” as karma (weather you good or evil lower the number the more evil higher the number the better person you are)

Random stats.

Make a button that says roll or something.
This button will randomly choose your stats that you get to start with.
Now there’s many ways to do this but I did it this way.
I put this in the button

on(release){
_root.strength=random(10)
_root.smarts=random(10)
_root.money=random(10)
_root.charm=random(10)
}
You can change the number in the random code to allow bigger numbers.
Yo ucan also make it randomly a number between 2 numbers like
_root.strength=random(20)+10
That makes it randomly choose from 10-20

Saving and loading your game

Ok make two buttons one that says save game and the other that says load game.
Now in the save game button put this
on(release) {
saveGame();
}
And in the load button
on(release) {
loadGame();
}
Now you have to tell it what to save or load.
So in the frame put

function saveGame(){
myLSO = SharedObject.getLocal("guy");

if(myLSO.data.myObj == undefined){ // No object exists
trace("Saved Game");
}
else{
trace("Overwrote Saved Game");
}
myObj = {};
myObj.objArray = new Array();

myObj.objArray[0] = name;
myObj.objArray[1] = strength;
myObj.objArray[2] = money;
myObj.objArray[3] = charm;
myObj.objArray[4] = karma;

myLSO.data.myObj = myObj;

}


function loadGame(){
myLSO = SharedObject.getLocal("guy");
if(myLSO.data.myObj == undefined){ // No object exists
trace("No Saved Game");
}
else{
trace("Loaded Game");

name = myLSO.data.myObj.objArray[0];
srength = myLSO.data.myObj.objArray[1];
money = myLSO.data.myObj.objArray[2];
charm = myLSO.data.myObj.objArray[3];
karma = myLSO.data.myObj.objArray[4];

}

}

Movement
Ok make a small circle and convert it to an MC (movie clip)
Give it the instance name of “guy”
Now give the MC a this code




onClipEvent(enterFrame){
// Movement
if (Key.isDown(Key.DOWN)) {
_y += _root.paceSpeed;
}
if (Key.isDown(Key.UP)) {
_y -= _root.paceSpeed;
}
if (Key.isDown(Key.LEFT)) {
_x -= _root.paceSpeed;
}
if (Key.isDown(Key.RIGHT)) {
_x += _root.paceSpeed;
}
// City Boundaries
if (_x <_root> (_root.screenWidth - _root.paceSpeed)){
_x = (_root.screenWidth - _root.paceSpeed);
}
if (_y <_root> (_root.screenHeight - _root.paceSpeed)){
_y = (_root.screenHeight - _root.paceSpeed);
}
}
Now in the frame put this

paceSpeed = 4; //how fast he walks
screenHeight = 450; //height of game
screenWidth = 750; //width of game, change to your size.
fscommand("allowscale", false);


PAY CLOSE ATTENTION.ITS EASY TO MESS UP HERE>
Ok lets get started by making are buildings, walls, people ect that you don’t want to be able to walk through.
Now be careful and select ALL your buildings and stuff that you don’t want to walk into but now your guy and covert them into ONE movie clip. Now give it this code

onClipEvent(enterFrame){
with (_root.guy) { //guy is the instance anme of your character
// check if player hits the buildings
if (map.hitTest(getBounds(_root).xMax, _y, true)) {
_x -= _root.paceSpeed;
}
if (map.hitTest(getBounds(_root).xMin, _y, true)) {
_x += _root.paceSpeed;
}
if (map.hitTest(_x, getBounds(_root).yMax, true)) {
_y -= _root.paceSpeed;
}
if (map.hitTest(_x, getBounds(_root).yMin, true)) {
_y += _root.paceSpeed;
}
}
}
PAY ATTENTION!
Ok now double click on the new mc of your buildings and then once again select them ALL and convert to an MC but give this an instance name of map and there will be no action script needed for it. This is called putting an MC in another MC very useful.
Test the game now and you’ll find that you can’t walk through the buildings. If it didn’t work its cause you did something wrong now these aren’t that clear so you may have to reread this tutorial to get it right.

Doors

Right you might want to be able to enter the buildings so make an Mc of a door and put this code in it.

onClipEvent (enterFrame) {
if (_root.guy.hitTest (this)) {
_root.gotoAndStop("school");
}
}

(above code)
If the MC guy hits this then it will go to and play the frame labeled “school” if you don’t know how this is how.
To label a frame click on the frame in the main timeline.
Now open up the properties panel and you'll find a spot for the frame label. If it's not there make sure the frame in the timeline is highlighted.

Gaining stats and money.

Say we’re making a button to increase your strength like at a gym.
You must make a button and put a code like this in.
Example

on (release) {
if (_root.money > 9) {
_root.strength += 1;
_root.money -= 10;
_root.karma += 1;
}
}

All that says is if you have over 9 money you will increase or add to your strength by 1 lose 10 money and your karma will go up by one.

Other examples for gaining and losing stats.

Remember each one is on a different button in a differnt situation.

on (release) {
if (_root.money > 9) {
_root.charm += 1;
_root.money -= 5;
_root.karma -= 1
}
}

on (release) {
if (_root.smarts > 54 && _root.strength > 54) {
_root.money += 50;
_root.karma += 1;
}
}

on (release) {
if (_root.money > 19) {
_root.money -= 20;
_root.smarts += 5;
}
}

Thats the basics.


Open source engines

For those who have been wishing to make soemthing like this but could never do it,here!
I made a basic terrian destruction game with a tank. Use the mouse to aim and left click to shoot.
SWF FILE (http://www.kyujjistudios.com/nekohost/files/7/Computer%20Tanks.swf) -swf
FLA FILE (http://www.kyujjistudios.com/nekohost/files/7/Computer%20Tanks.fla) -fla
Enjoy!

Walk-Punch-React Engine
http://www.kyujjistudios.com/nekohost/file...ch%20engine.swf (http://www.kyujjistudios.com/nekohost/files/7/walk-punch%20engine.swf)
-Walk-Punch-React Engine
-swf file

http://www.kyujjistudios.com/nekohost/file...ch%20engine.fla (http://www.kyujjistudios.com/nekohost/files/7/walk-punch%20engine.fla)
-Walk-Punch-React Engine
-fla file

Bouncing engine
swf (http://www.kyujjistudios.com/nekohost/files/7/Bouncing%20Engine%20v4.0.swf)
-Bouncing engine
-swf file
fla (http://www.kyujjistudios.com/nekohost/files/7/BOUNCE%20ENGINE.fla)
-Bouncing Engine
-fla file


Ragdoll game
My pimped version.
http://www.kyujjistudios.com/nekohost/file...ard_Ragdoll.swf (http://www.kyujjistudios.com/nekohost/files/7/Edward_Ragdoll.swf)
The free version with less features. Make um yourselves!
Swf file
http://www.kyujjistudios.com/nekohost/file...agdoll_free.swf (http://www.kyujjistudios.com/nekohost/files/7/Edward_Ragdoll_free.swf)
Fla file
http://www.kyujjistudios.com/nekohost/file...agdoll_free.fla (http://www.kyujjistudios.com/nekohost/files/7/Edward_Ragdoll_free.fla)

Map maker
http://www.kyujjistudios.com/nekohost/file...0own%20map..swf (http://www.kyujjistudios.com/nekohost/files/7/build%20your%20own%20map..swf)
-Build your own map
-swf file

http://www.kyujjistudios.com/nekohost/file...20own%20map.fla (http://www.kyujjistudios.com/nekohost/files/7/Build%20your%20own%20map.fla)
-Build your own map
-fla file

Platformer
Swf (http://www.kyujjistudios.com/nekohost/files/7/Halo-thegame.swf)
-Halo platformer
-swf file

Fla (http://www.kyujjistudios.com/nekohost/files/7/Halo-thegame.fla)
-Halo platformer
-fla file

I made a VERY simple engine for simple snowflakes falling.
Version 1
Fla File
Click here for fla (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v1.fla)
Swf File
Click here for swf (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v1.swf)
Version 2
Fla File
Click here for fla (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v2.fla)
Swf File
Click here for swf (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v2.swf)
Version 3
Fla File
Click here for fla (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v3.fla)
Swf File
Click here for swf (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v3.swf)
Version 4
Fla File
Click here for fla (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v4.fla)
Swf File
Click here for swf (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v4.swf)
Version 5
Fla File
Click here for fla (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v5.fla)
Swf File
Click here for swf (http://www.kyujjistudios.com/nekohost/files/7/Snow_Engine_v5.swf)

Soon to be flash master
12-26-2006, 07:41 PM
nice/10!

doomlord
12-29-2006, 02:44 AM
also matt your a great ASer and i can get most of what your saying no need to down you or anything or sound braggish but i can draw better than you in flash and photoshop (though i use imageready which is 99% copy of photoshop)

Soon to be flash master
12-29-2006, 02:51 AM
So, he codes, you do graphics. Who cares if your better than him at one thing or another.

Brown Cow is a good coder, I could bowl him out in cricket. Am I better?

LizardRob
12-29-2006, 05:31 AM
I was wondering whether you'd ever update this Matt.

10/10 as always.

phdrummer
12-29-2006, 07:21 AM
wow, i dont have the time to read it now. this should count as 10 posts.

doomlord
12-29-2006, 05:08 PM
yea its pretty HUGE but coz of that guide i learnt how to do buy buttons, your screenshots just look weird to me coz i am using windows exp and its silver and yours is some weird color but 10/10 for guide, great work!

Matt
12-31-2006, 10:54 AM
I customized the colors.
lol

Fabian920
12-31-2006, 11:31 AM
nice guide 10/10 i'll try and follow it

[G]host
01-06-2007, 09:01 AM
Very nice tutorial, but I am trying to elaborate on it a bit and I got stuck. I'm trying to use your HitTest / boundary code and change it a bit. You'll see in the below pic the 'guy', there's a blue box.

http://www.fullgospelassembly.ca/random/HitTest_Area.jpg

That box is the area I am HitTesting, not the character, but when the box stops I want the character to stop too. Not quite sure how to make that work. Also, it's a bit buggy in that if two sides hittest at the same time then it goes right through. You'll see what I mean.

Any help from the geniuses here would be appreciated. :P

http://www.fullgospelassembly.ca/random/Test.fla
http://www.fullgospelassembly.ca/random/Test.swf

phdrummer
01-06-2007, 09:25 AM
wow, you drew that. do you think you could help with the art for my DYC game? ghost

[G]host
01-06-2007, 09:28 AM
Sorry, I don't get much time with Flash, so I have to make use of it all. Thanks though.

(Still need help, for anyone just tuning in. Big help)

phdrummer
01-06-2007, 11:01 AM
awww...

Jacob
01-06-2007, 02:21 PM
host;1307280']Very nice tutorial, but I am trying to elaborate on it a bit and I got stuck. I'm trying to use your HitTest / boundary code and change it a bit. You'll see in the below pic the 'guy', there's a blue box.


That box is the area I am HitTesting, not the character, but when the box stops I want the character to stop too. Not quite sure how to make that work. Also, it's a bit buggy in that if two sides hittest at the same time then it goes right through. You'll see what I mean.

Any help from the geniuses here would be appreciated. :P


I always put collision boxes inside my character clips and check them that way. Having them as separate objects is not necessary. When they are inside the character clips it also allows you to easily change the collision box when the character pose/animation changes.

doomlord
01-07-2007, 09:11 PM
if you want the character to stop with it as well it shouldnt be to hard but oh well keep trying also i'd like to see what else you have for it because all i can do to help you is put gravity in really but i suck at doing jumping heh there was a great tut somewhere but i lost it ;( but i can google it and find it again
also matt in next version should put in picking up stuff for people or having an inventory. or maybe even having one revolving around the game your making

Soon to be flash master
01-08-2007, 01:41 AM
You have to make the guy attach himself to the box.

Like

guy x = box x
guy y = box y

Jacob
01-08-2007, 02:24 AM
That way is not preferable though because it adds extra calculations that are not needed. As your games grow, a bad practice like that becomes a more noticeable problem. If the box is inside the character clip like it should be then no extra code and calculations are needed.

Matt
01-08-2007, 04:19 AM
if you want the character to stop with it as well it shouldnt be to hard but oh well keep trying also i'd like to see what else you have for it because all i can do to help you is put gravity in really but i suck at doing jumping heh there was a great tut somewhere but i lost it ;( but i can google it and find it again
also matt in next version should put in picking up stuff for people or having an inventory. or maybe even having one revolving around the game your making
Sure it's pretty simple. I did a video tutorial on it bu tbecause of my high resolution no one could see much.

doomlord
01-08-2007, 07:59 PM
high rez just swap it to low rez plenty of encoders out there but during my free time i just work on my music game coz i got some drums heh