00:00
00:00

AS: Listeners

4,338 Views | 15 Replies
New Topic Respond to this Topic

AS: Listeners 2005-10-17 09:30:30


AS: Main

Event Listeners
==========================================
=========================

Listeners in Flash make user interaction much easier to work with. You can intercept Key presses, mouse movements and clicks no matter which component is focused at the time. The 2 most interesting things about listeners is that they allow you to know when a key is released, or when the user uses the scroll wheel on his mouse!

The Basics
A listener is basically an object. To create a listener object, there are a few things you have to do:
-First, create a new object.
var ListenerObject:Object = new Object()

-Second, make it actually listen to things. For that we use the addListener(object) function that comes in the Key and Mouse classes:

//For a mouse listener
Mouse.addListener(ListenerObject);
//Or for a Key listener
Key.addListener(ListenerObject);

-Third, create the functions for the events that get triggered:

ListenerObject.onSomething = function()
{
//do something
};

Key Listeners
Key listeners allow you to know when a key is pressed, or when a key is released. The two event names are obviously onKeyDown and onKeyUp. In an onKeyXX event, youcan access the Key object, which stores the actual key pressed or released.

There are a few functions in the Key object, but the 2 main ones we need are :
-getCode() : A key code is a number used to store the key currently pressed or release. It is a special Flash-assigned number that can also keep track of when the space key is pressed, for example.
-getAscii(): This is to retrieve the ASCII value of the key. An ASCII value is also a number, but it is used to store what actual character the Key is. List of ASCII characters. This value can be used with the String function fromCharCode(Number).

Here is an example that traces what key is actually pressed, and also traces what key is released:

var ListenerObject:Object = new Object();
ListenerObject.onKeyDown = function()
{
trace("You pressed the "+String.fromCharCode(Key.getAscii())+" key");
}
ListenerObject.onKeyUp = function()
{
trace("You released the "+String.fromCharCode(Key.getAscii())+" key");
}
Key.addListener(ListenerObject);

Note: If a user holds down a key, the onKeyDown event will be triggered as long as the key is pressed. The frequency of the repetition all depends on the user's settings.

Mouse Listeners
Mouse Listeners allow you to know when the user clicks, releases or moves the mouse button, or when he uses the scroll wheel. The events are onMouseDown,onMouseUp,onMouseMove and onMouseWheel.

You've probably already used the first 3 in your games, etc. So I'm, just going to explain how to use onMouseWheel:
If you want to know by how much the mouse wheel has moved, you need to add a parameter to your function: a number. This parameter represents by how much the scroll wheel has moved. It's a positive number if the user scroll up, and a negative number if the user scrolls down.

Examples are worth a thousand words, so here's how you can make a movieclip move up or down using only the scrollwheel. Hopefully you actually have a scroll wheel on your mouse.

var ListenerObject:Object = new Object();
ListenerObject.onMouseWheel = function(inc:Number)
{
_parent.movingMC._y -= inc;
}
Mouse.addListener(ListenerObject);

Note: It is likely that a user won't have a mouse wheel. You should always add a key alternative to the mouse wheel!

This concludes this tutorial about Listeners. Hopefully it was clear enough, and I've made a small example that basically listens for every user interaction. Click here to view it.


BBS Signature

Response to AS: Listeners 2005-10-17 10:05:51


Cool tut, well explained, and nice example of use. The only thing I'd add is that generally Listeners are placed on the Main timeline - I normally add them to the code on the first frame.

One of the questions/problems that I hear a lot about is the fact that the Listener continues to monitor for onKeyDowns after the key has been pressed (ie, when it's held down).
To get around this, I generally suggest using a boolean value to check whether the key has been released, and only run the onKeyDown code if it hasn't.
This example 'does stuff' only when the SPACE key is pressed; if the SPACE key is held down, it doesn't repeatedly 'do stuff'.

bleh=0; //boolean variable
kl = new Object();
kl.onKeyDown = function () {
if (Key.getCode() == 32 && bleh == 0){
//Do stuff
bleh=1; // Disallows the code running until SPACE key is released
}
}
kl.onKeyUp = function () {
if (Key.getCode() == 32){
bleh=0; //Reset boolean
}
}
Key.addListener(kl);


- - Flash - Music - Images - -

BBS Signature

Response to AS: Listeners 2005-10-17 11:03:10


Awesome tut man!

I have never come across Listener's before its really instering..so I did something else with it, only simple but yeah.. if you want to have it displayed in a textbox, just make a dynamic text-box with var 'pressed' and add:

Example first..

var ListenerObject:Object = new Object();
ListenerObject.onKeyDown = function()
{
_root.pressed = "You haven't pressed or released any key!";
}
{
_root.pressed = "You pressed the "+String.fromCharCode(Key.getAscii())+" key";
}
ListenerObject.onKeyUp = function()
{
_root.pressed = "You released the "+String.fromCharCode(Key.getAscii())+" key";
}
Key.addListener(ListenerObject);

If you want it, so when you only press it counts, just replace the 'You released the xx key' with You havent press any key! And replace the first line with You havent press any key, instead of realease iswell.


"Actually, the server timed out trying to remove all your posts..."

-TomFulp

Response to AS: Listeners 2005-10-19 00:42:16


what about putting listeners in classes

Response to AS: Listeners 2005-10-19 02:17:28


Very useful indeed. I was wondering about listeners, since I am trained to become a professional game designer/developer. Perhaps, I shall use it for any game I was thinking of.


Sonic Wii Preloader!

Pro-Pokemon Club/TJPPC - Where I love Mew and members know it!

My art - I do art well, you twirps!

BBS Signature

Response to AS: Listeners 2005-10-29 18:24:54


can i use a listener to make it so you can only press C if the space was pressed before it?

Response to AS: Listeners 2006-05-31 15:19:40


another useful thing to do with listeners which you haven't mentioned in your tutorial is to remove listeners.
adding listener
button.addEventListener("click", oListener);
removing listener
button.removeEventListener("click", oListener);


BBS Signature

Response to AS: Listeners 2006-09-30 19:09:11


how can i make is so that it comes as random letters or numbers then you have to press that number or letter to go to a certain frame and if you dont nothing happens....(when i mean nothing happens i mean you wait till 5 sec then it says "you lose"...something like that)

i hope you understand...


Fate. Strength. Intelligence.

Response to AS: Listeners 2006-11-11 10:49:55


I'm making a mouse avoider and I want a listener to stopo cheaters.I want it on the ALT key becasue that button is a cheat code.CAn you help me get a script for it?


hello

Response to AS: Listeners 2007-03-17 19:03:32


So like a text field component could be created?

class Frame extends _root{
myListener:Object = new Object();
myListener.addListener();
str:String = "";
myListener.onKeyDown = function():Void{
str = str + String.getCharCode(Key.getASCII());
}
}

Response to AS: Listeners 2007-03-17 20:17:42


At 3/17/07 07:03 PM, sniffy-gerbil wrote: So like a text field component could be created?

class Frame extends _root{
myListener:Object = new Object();
myListener.addListener();
str:String = "";
myListener.onKeyDown = function():Void{
str = str + String.getCharCode(Key.getASCII());
}
}

you'd better use the built in textfeild component

//as2
createTextField("myText", 1, 100, 100, 300, 100);
myText.type = "input";
myText.text = "change me";

//as3
var myText:TextField = new TextField()
addChild(myText);
myText.width = 100;
myText.height = 100;
myText.x = 300;
myText.y = 100;
myText.type = "input";
myText.text = "change me";


This blog I made | This game sucks | I, twit

Just trying to get enough Twitter followers to quit Facebook forever

Response to AS: Listeners 2007-03-18 08:26:54


Cool, thanks for giving the AS3 example as well it seems to be a lot more powerful; it was smart to make a TextField class.

Response to AS: Listeners 2007-07-11 13:19:14


using denvish's code as an example

bleh=0; //boolean variable
kl = new Object();
kl.onKeyDown = function () {
if (Key.getCode() == 32 && bleh == 0){
//Do stuff
bleh=1; // Disallows the code running until SPACE key is released
}
}
kl.onKeyUp = function () {
if (Key.getCode() == 32){
bleh=0; //Reset boolean
}
}
Key.addListener(kl);

how do i make it so that 2 keys have to be pressed e.g. up arrow and left arrow??

Response to AS: Listeners 2007-07-11 15:55:24


malakesh: Use the '&&' operator. '&&' just means 'and'. Example:

if (Key.getCode() == 32 && Key.getCode() == <insert_keycode_here> && bleh == 0){
//Do stuff

But why bump this thread? Make a topic on it.

Response to AS: Listeners 2007-07-11 20:15:10


At 7/11/07 03:55 PM, Pedochu wrote: malakesh: Use the '&&' operator. '&&' just means 'and'. Example:

if (Key.getCode() == 32 && Key.getCode() == <insert_keycode_here> && bleh == 0){
//Do stuff

But why bump this thread? Make a topic on it.

i no what the && lol but this doesnt work i think becasuse you telling the flash file to do the same thing twice but get two different answers from it so tht doesnt work im not sure if it is possible but i dont no any otherway to do what i need

Response to AS: Listeners 2009-07-06 01:09:18


At 10/17/05 10:05 AM, Denvish wrote:

: Cool tut, well explained, and nice example of use. The only thing I'd add is that generally Listeners are placed on the Main timeline - I normally add them to the code on the first frame.


One of the questions/problems that I hear a lot about is the fact that the Listener continues to monitor for onKeyDowns after the key has been pressed (ie, when it's held down).
To get around this, I generally suggest using a boolean value to check whether the key has been released, and only run the onKeyDown code if it hasn't.
This example 'does stuff' only when the SPACE key is pressed; if the SPACE key is held down, it doesn't repeatedly 'do stuff'.

bleh=0; //boolean variable
kl = new Object();
kl.onKeyDown = function () {
if (Key.getCode() == 32 && bleh == 0){
//Do stuff
bleh=1; // Disallows the code running until SPACE key is released
}
}
kl.onKeyUp = function () {
if (Key.getCode() == 32){
bleh=0; //Reset boolean
}
}
Key.addListener(kl);

thank you so much for this code. i had no idea how to do this until now. thx!