AS2: Character Interactions

Source File Available Here: http://adf.ly/30bZr

Welcome to Tutorial #6! In this tutorial, I will teach you how to interact with NPCs. By the end, we will have a character and 2 NPCs that will say a message when the user hits the space bar, and will exit the message when the user presses control.

Let's get started by opening up a new AS2 document in Flash:

Now lets draw our 2 or 3 characters. For me, I am doing 1 character and 2 NPCs.

Convert each character to a movie clip by selecting one and pressing F8 on your keyboard.
I called my main character "char".
I called NPC1 "computer1"
And I called NPC2 "computer2"
So now we have 3 movie clips in our library. Next, let's give our "char" and instance name of "char" by going into the properties panel (Window > Properties).

Now we need a message box to display the text when the user presses the space bar when he/she is close enough to the NPCs. So create a text box and make sure it is set to Dynamic. Notice how I gave the text box an instance name of "msg".

Now for the Action Script. Let's go ahead and open up the character's actions by clicking on its movie clip, and pressing F9. Put this:

onClipEvent(load){
speed=3;
}
onClipEvent(enterFrame){
if(Key.isDown(Key.UP)){
this._y-=speed;
}
if(Key.isDown(Key.DOWN)){
this._y+=speed;
}
if(Key.isDown(Key.LEFT)){
this._x-=speed;
this.gotoAndStop(1);
}else
if(Key.isDown(Key.RIGHT)){
this._x+=speed;
this.gotoAndStop(2);
}

}
All this is, is movement code. That is all you need in the character. Notice how on the right and left keys, the character "gotoAndStop(2);". that means if the right key is pressed the character movie clip will go to the 2nd frame of its timeline. On the second frame of the character's timeline, it is facing in the right direction. So basically gotoAndStop(2) means to face right. gotoAndStop(1) means face left.

Next, go into one of the NPCs actions. Type this:

onClipEvent(enterFrame){
distance=500;
ux = _root.char._x;
uy = _root.char._y;
ex = this._x;
ey = this._y;
if(Math.sqrt((ux-ex)*(ux-ex)*(uy-ey)*(uy-ey))<distance && Key.isDown(Key.SPACE)){
_root.msg.text="Computer 1 Says: Press CONTROL to Exit This messsage."
}else
if(Key.isDown(Key.CONTROL)){
_root.msg.text="";
}
}
1.)The variable "distance" is setting how far away the player has to be in order to receive the message.
2.) "ux", "uy", "ex", and "ey" are variables for the char's x and y coordinates and the NPCs x and y coordinates.
3.)The math equation in the "if" statement is calculating how much space is in between the player and the NPC. If the player and the NPC are within 500 pixels (distance variable) of each other, and if the space bar is being pressed, then execute the following action
4.)_root.msg.text="words here"; means to apply the quoted text into the "msg" text box that we made earlier
5.)if(Key.isDown(Key.CONTROL)){ means that if the CTRL button is pressed, execute the following action:
6.) _root.msg.text=""; simply means, make the text box have no words in it.

If you want to add a new message for a different NPC, just copy and paste this code into the new NPC and simply change the message in quotations on line 8 of the code.

The end result should look like this:

Well that does it! Thank you guys for reading this tutorial and make sure you become a member on my blog so that you get notifications of all of my new tutorials that come out every week!

Feel free to use the source file here: http://adf.ly/30bZr