Add eventlistener to embedded movieclip AS3

phillyrob · May 11, 2008, 5:43pm

How can I addeventlistener to a movieclip embedded in another to where both the parent and the child will respond to a mouse event in AS3? The parent movieclip will move while the child changes alpha.

bLaf · May 11, 2008, 6:38pm

Try

ParentMovieClip.mouseChildren = false;

That way, events which are targeting child objects will get fired, but the target will be the parent.

phillyrob · May 11, 2008, 7:06pm

[quote=bLaf;2324726]Try

ParentMovieClip.mouseChildren = false;

That way, events which are targeting child objects will get fired, but the target will be the parent.[/quote]

I’ll try it. Thanks

adnan794 · May 11, 2008, 7:14pm

If your movieclip is a child of another movieclip then you can register the parent movieclip for listener and in that listener function you can call event.currentTarget this will give the the child movieclip which is inside the other so by registering one listener you can do both things you want moving the parent and changing alpha for the child.

snickelfritz · May 11, 2008, 8:22pm

[QUOTE=phillyrob;2324702]How can I addeventlistener to a movieclip embedded in another to where both the parent and the child will respond to a mouse event in AS3? The parent movieclip will move while the child changes alpha.[/QUOTE]
Here’s the basic concept:
“parent1” clip is the target for the event listener.
Event propagation causes the children of “parent1” to receive events directed at “parent1”.
“parent1” is tweened within the function triggered by the child clips, “child1” and “child2”.

//on the stage: movieclip "parent1" contains movieclips "child1" and "child2"
stop();
import gs.TweenMax;
import fl.motion.easing.*;
var button:String = "";

parent1.addEventListener(MouseEvent.MOUSE_OVER, rollover, false, 0, true);
parent1.addEventListener(MouseEvent.MOUSE_OUT, rollout, false, 0, true);

function rollover(event:MouseEvent):void {
	button = event.target.name;
	TweenMax.to(event.target, 1, {alpha:.5});
	TweenMax.to(parent1, .2, {x:120, ease:Linear.easeIn});
	trace(button);
}

function rollout(event:MouseEvent):void {
	button = event.target.name;
	TweenMax.to(event.target, 1, {alpha:1});
	TweenMax.to(parent1, 1, {x:100, ease:Elastic.easeOut});
	trace(button);
}

phillyrob · May 11, 2008, 8:31pm

[quote=snickelfritz;2324753]Here’s the basic concept:
“parent1” clip is the target for the event listener.
Event propagation causes the children of “parent1” to receive events directed at “parent1”.
“parent1” is tweened within the function triggered by the child clips, “child1” and “child2”.

ActionScript Code:
[LEFT][COLOR=#808080]//on the stage: movieclip “parent1” contains movieclips “child1” and “child2”[/COLOR]
stopCOLOR=#000000[/COLOR];
import gs.[COLOR=#000080]TweenMax[/COLOR];
import fl.[COLOR=#000080]motion[/COLOR].[COLOR=#000080]easing[/COLOR].*;
var [COLOR=#0000ff]button[/COLOR]:[COLOR=#0000ff]String[/COLOR] = [COLOR=#ff0000]""[/COLOR];
 
parent1.[COLOR=#000080]addEventListener[/COLOR][COLOR=#000000]([/COLOR]MouseEvent.[COLOR=#000080]MOUSE_OVER[/COLOR], rollover, [COLOR=#000000]false[/COLOR], [COLOR=#000080]0[/COLOR], [COLOR=#000000]true[/COLOR][COLOR=#000000])[/COLOR];
parent1.[COLOR=#000080]addEventListener[/COLOR][COLOR=#000000]([/COLOR]MouseEvent.[COLOR=#000080]MOUSE_OUT[/COLOR], rollout, [COLOR=#000000]false[/COLOR], [COLOR=#000080]0[/COLOR], [COLOR=#000000]true[/COLOR][COLOR=#000000])[/COLOR];
 
function rolloverCOLOR=#000000[/COLOR]:[COLOR=#0000ff]void[/COLOR] [COLOR=#000000]{[/COLOR]
 button = event.[COLOR=#0000ff]target[/COLOR].[COLOR=#0000ff]name[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]event.[COLOR=#0000ff]target[/COLOR], [COLOR=#000080]1[/COLOR], [COLOR=#000000]{[/COLOR]alpha:.[COLOR=#000080]5[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]parent1, .[COLOR=#000080]2[/COLOR], [COLOR=#000000]{[/COLOR]x:[COLOR=#000080]120[/COLOR], ease:Linear.[COLOR=#000080]easeIn[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 traceCOLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
 
function rolloutCOLOR=#000000[/COLOR]:[COLOR=#0000ff]void[/COLOR] [COLOR=#000000]{[/COLOR]
 button = event.[COLOR=#0000ff]target[/COLOR].[COLOR=#0000ff]name[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]event.[COLOR=#0000ff]target[/COLOR], [COLOR=#000080]1[/COLOR], [COLOR=#000000]{[/COLOR]alpha:[COLOR=#000080]1[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]parent1, [COLOR=#000080]1[/COLOR], [COLOR=#000000]{[/COLOR]x:[COLOR=#000080]100[/COLOR], ease:Elastic.[COLOR=#000080]easeOut[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 traceCOLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
[/LEFT]

[/quote]

Thanks Snickelfritz, I will try to digest and implement you code.

phillyrob · May 12, 2008, 6:39am

Thanks, but I am not following. Can you give me an example? Here is some simple code that is on the root or parent timeline. I have a movieclip called recTangle, Inside the movieclip recTangle, I have a movieclip called bluerecTangle. I want the movieclip recTangle to move and at the sametime I want the embedded movieclip bluerecTangle to change alpha to = 0;

recTangle.addEventListener(MouseEvent.ROLL_OVER, rollOver1);
recTangle.addEventListener(MouseEvent.ROLL_OUT, rollOut1);
function rollOver1(event:MouseEvent):void
{
recTangle.x += 50;

}
function rollOut1(event:MouseEvent):void
{
recTangle.x -= 50;
}

phillyrob · May 12, 2008, 6:40am

Thanks, but I am not following this. Can you please give me an example? Here is some simple code that is on the root or parent timeline. I have a movieclip called recTangle, Inside the movieclip recTangle, I have a movieclip called bluerecTangle. I want the movieclip recTangle to move and at the sametime I want the embedded movieclip bluerecTangle to change alpha to = 0;

recTangle.addEventListener(MouseEvent.ROLL_OVER, rollOver1);
recTangle.addEventListener(MouseEvent.ROLL_OUT, rollOut1);
function rollOver1(event:MouseEvent):void
{
recTangle.x += 50;

}
function rollOut1(event:MouseEvent):void
{
recTangle.x -= 50;
}

phillyrob · May 12, 2008, 6:48am

[quote=snickelfritz;2324753]Here’s the basic concept:
“parent1” clip is the target for the event listener.
Event propagation causes the children of “parent1” to receive events directed at “parent1”.
“parent1” is tweened within the function triggered by the child clips, “child1” and “child2”.

ActionScript Code:
[LEFT][COLOR=#808080]//on the stage: movieclip “parent1” contains movieclips “child1” and “child2”[/COLOR]
stopCOLOR=#000000[/COLOR];
import gs.[COLOR=#000080]TweenMax[/COLOR];
import fl.[COLOR=#000080]motion[/COLOR].[COLOR=#000080]easing[/COLOR].*;
var [COLOR=#0000ff]button[/COLOR]:[COLOR=#0000ff]String[/COLOR] = [COLOR=#ff0000]""[/COLOR];
 
parent1.[COLOR=#000080]addEventListener[/COLOR][COLOR=#000000]([/COLOR]MouseEvent.[COLOR=#000080]MOUSE_OVER[/COLOR], rollover, [COLOR=#000000]false[/COLOR], [COLOR=#000080]0[/COLOR], [COLOR=#000000]true[/COLOR][COLOR=#000000])[/COLOR];
parent1.[COLOR=#000080]addEventListener[/COLOR][COLOR=#000000]([/COLOR]MouseEvent.[COLOR=#000080]MOUSE_OUT[/COLOR], rollout, [COLOR=#000000]false[/COLOR], [COLOR=#000080]0[/COLOR], [COLOR=#000000]true[/COLOR][COLOR=#000000])[/COLOR];
 
function rolloverCOLOR=#000000[/COLOR]:[COLOR=#0000ff]void[/COLOR] [COLOR=#000000]{[/COLOR]
 button = event.[COLOR=#0000ff]target[/COLOR].[COLOR=#0000ff]name[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]event.[COLOR=#0000ff]target[/COLOR], [COLOR=#000080]1[/COLOR], [COLOR=#000000]{[/COLOR]alpha:.[COLOR=#000080]5[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]parent1, .[COLOR=#000080]2[/COLOR], [COLOR=#000000]{[/COLOR]x:[COLOR=#000080]120[/COLOR], ease:Linear.[COLOR=#000080]easeIn[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 traceCOLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
 
function rolloutCOLOR=#000000[/COLOR]:[COLOR=#0000ff]void[/COLOR] [COLOR=#000000]{[/COLOR]
 button = event.[COLOR=#0000ff]target[/COLOR].[COLOR=#0000ff]name[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]event.[COLOR=#0000ff]target[/COLOR], [COLOR=#000080]1[/COLOR], [COLOR=#000000]{[/COLOR]alpha:[COLOR=#000080]1[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 TweenMax.[COLOR=#000080]to[/COLOR][COLOR=#000000]([/COLOR]parent1, [COLOR=#000080]1[/COLOR], [COLOR=#000000]{[/COLOR]x:[COLOR=#000080]100[/COLOR], ease:Elastic.[COLOR=#000080]easeOut[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
 traceCOLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
[/LEFT]

[/quote]

How could I do it with is code:

Here is some simple code that is on the root or parent timeline. I have a movieclip called recTangle, Inside the movieclip recTangle, I have a movieclip called bluerecTangle. I want the movieclip recTangle to move and at the sametime I want the embedded movieclip bluerecTangle to change alpha to = 0;

recTangle.addEventListener(MouseEvent.ROLL_OVER, rollOver1);
recTangle.addEventListener(MouseEvent.ROLL_OUT, rollOut1);
function rollOver1(event:MouseEvent):void
{
recTangle.x += 50;

}
function rollOut1(event:MouseEvent):void
{
recTangle.x -= 50;
}

bLaf · May 12, 2008, 8:45am

[quote=phillyrob;2324918]Thanks, but I am not following. Can you give me an example? Here is some simple code that is on the root or parent timeline. I have a movieclip called recTangle, Inside the movieclip recTangle, I have a movieclip called bluerecTangle. I want the movieclip recTangle to move and at the sametime I want the embedded movieclip bluerecTangle to change alpha to = 0;

recTangle.addEventListener(MouseEvent.ROLL_OVER, rollOver1);
recTangle.addEventListener(MouseEvent.ROLL_OUT, rollOut1);
function rollOver1(event:MouseEvent):void
{
recTangle.x += 50;

}
function rollOut1(event:MouseEvent):void
{
recTangle.x -= 50;
}[/quote]

Here’s my version

 recTangle.addEventListener(MouseEvent.ROLL_OVER, rollOver1);
recTangle.addEventListener(MouseEvent.ROLL_OUT, rollOut1);
recTangle.mouseChildren = false;

function rollOver1(event:MouseEvent):void
{
recTangle.x += 50;
// two ways to deal with it:
recTangle.bluerecTangle._alpha = 0;
// or
//event.currentTarget.bluerecTangle._alpha = 0;

}
function rollOut1(event:MouseEvent):void
{
recTangle.x -= 50;

recTangle.bluerecTangle._alpha =100;
// or
// event.currentTarget.bluerecTangle._alpha = 100;


}

phillyrob · May 12, 2008, 1:57pm

[quote=bLaf;2324948]Here’s my version

 recTangle.addEventListener(MouseEvent.ROLL_OVER, rollOver1);
recTangle.addEventListener(MouseEvent.ROLL_OUT, rollOut1);
recTangle.mouseChildren = false;
 
function rollOver1(event:MouseEvent):void
{
recTangle.x += 50;
// two ways to deal with it:
recTangle.bluerecTangle._alpha = 0;
// or
//event.currentTarget.bluerecTangle._alpha = 0;
 
}
function rollOut1(event:MouseEvent):void
{
recTangle.x -= 50;
 
recTangle.bluerecTangle._alpha =100;
// or
// event.currentTarget.bluerecTangle._alpha = 100;
 
 
}

[/quote]

Thanks 1 million this works pefectly!. I changed the code _alpha to alpha to work in AS 3 but it works. You are a life saver. Thanks again.

Topic		Replies	Views
Accessing a movieclip from within a movieclip flash	4	103	May 11, 2008
Target movieclip inside of movieclip class with event	0	149	August 20, 2010
onClipEvent Troubles flash	0	63	January 14, 2005
onClipEvent Troubles	0	58	January 14, 2005
addEventListener to what exactly? flash	0	107	August 16, 2009

Add eventlistener to embedded movieclip AS3

Follow:

Popular

Loose Ends

Add eventlistener to embedded movieclip AS3

Related topics

Follow:

Popular

Loose Ends