Have you ever needed to assign button Click events and Mouse Over events and encapsulate data to a button in Flash? I have, pretty much every day. Im not sure where i picked up this technique but ive been using it for a very long time. The basic setup is simple. Say you have 5 buttons with instance names; btn1, btn2, btn3, btn4, btn5.

Instead of trying to assign event handlers to each button one by one, i setup a for loop like the following:

for (var i:int=1;i<=5;i++) {
	this["btn"+i].addEventListener(MouseEvent.CLICK, clickHandler);
	this["btn"+i].addEventListener(MouseEvent.MOUSE_OVER, overHandler);
	this["btn"+i].addEventListener(MouseEvent.MOUSE_OUT, outHandler);
}

The for loop will loop through all five of your btns and assign the mouse click, rollover and rollover events for each. Simple :)

Once you grasp that concept, then its time to inject metadata into the button itself so that each mouse event handler can use that data.

say we have an array of info for each button, which would contain a title, and description.

var buttonData:Array = new Array(["title 1","description 1"],
					["title 2","description 2"],
					["title 3","description 3"],
					["title 4","description 4"],
					["title 5","description 5"]);

now, in out loop we can target that data, and inject it into the button movieclip instance. like so:

for (var i:int=1;i<=5;i++) {
	this["btn"+i].addEventListener(MouseEvent.CLICK, clickHandler);
	this["btn"+i].addEventListener(MouseEvent.MOUSE_OVER, overHandler);
	this["btn"+i].addEventListener(MouseEvent.MOUSE_OUT, outHandler);
	this["btn"+i].title = buttonData[i][0];
	this["btn"+i].desc = buttonData[i][1];
}

once that data has been injected.. we can access it at any time, in any of our mouse events like so:

function clickHandler(e:MouseEvent):void {
	trace("title: "+e.currentTarget.title);
	trace("desc: "+e.currentTarget.desc);
}

the full script would look something like this (just make sure you have 5 buttons with the correct instance names on the stage):

var buttonData:Array = new Array(["title 1","description 1"],
					["title 2","description 2"],
					["title 3","description 3"],
					["title 4","description 4"],
					["title 5","description 5"]);

for (var i:int=1;i<=5;i++) {
	this["btn"+i].addEventListener(MouseEvent.CLICK, clickHandler);
	this["btn"+i].addEventListener(MouseEvent.MOUSE_OVER, overHandler);
	this["btn"+i].addEventListener(MouseEvent.MOUSE_OUT, outHandler);
	this["btn"+i].title = buttonData[i][0];
	this["btn"+i].desc = buttonData[i][1];
}

function clickHandler(e:MouseEvent):void {
	trace("title: "+e.currentTarget.title);
	trace("desc: "+e.currentTarget.desc);
}
function overHandler(e:MouseEvent):void {
	trace("over event: "+e.currentTarget)

}
function outHandler(e:MouseEvent):void {
	trace("out event: "+e.currentTarget)
}

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>