Highlighted

How to use movieClip symbols in a movieClip symbol

Community Beginner ,
Sep 07, 2020

Copy link to clipboard

Copied

I asked a question about the mismatch of mouse position and drawing coordinates on a responsive screen last time and was happy to hear the quick answer (divided by stage scale).

 

I put a button symbol and a movie clip symbol inside the movie clip symbol. Button symbols respond to mouse events, but movie clip symbols do not.

 

app.on("mousedown", function(e)
{
target = e.target;
if (target == app.redButton) //Button symbol work
{
app.config.color = "#FF0000";
app.erase = false;
app.colorHighlight.x = target.x
}
else if(target == app.greenMovieClip) //MovieClip symbol not work
{
app.greenMovieClip.alpha = 0.3;
}
});

 

So when I hover the mouse over the symbol, I print the symbol's name on the console.

 

app.on( "mouseover", function(e)

{
target = e.target;
console.log(target.name);
});

 

The name of the button symbol is displayed, but the movie clip symbol is null.

I want to know how to put a movie clip inside a movie clip symbol and make it react to mouse events like a button symbol.

 

https://kong.or.kr/painting.html
The file I practiced is on the link above. Three green circles in the center are the movie clip symbols.

Views

45

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

How to use movieClip symbols in a movieClip symbol

Community Beginner ,
Sep 07, 2020

Copy link to clipboard

Copied

I asked a question about the mismatch of mouse position and drawing coordinates on a responsive screen last time and was happy to hear the quick answer (divided by stage scale).

 

I put a button symbol and a movie clip symbol inside the movie clip symbol. Button symbols respond to mouse events, but movie clip symbols do not.

 

app.on("mousedown", function(e)
{
target = e.target;
if (target == app.redButton) //Button symbol work
{
app.config.color = "#FF0000";
app.erase = false;
app.colorHighlight.x = target.x
}
else if(target == app.greenMovieClip) //MovieClip symbol not work
{
app.greenMovieClip.alpha = 0.3;
}
});

 

So when I hover the mouse over the symbol, I print the symbol's name on the console.

 

app.on( "mouseover", function(e)

{
target = e.target;
console.log(target.name);
});

 

The name of the button symbol is displayed, but the movie clip symbol is null.

I want to know how to put a movie clip inside a movie clip symbol and make it react to mouse events like a button symbol.

 

https://kong.or.kr/painting.html
The file I practiced is on the link above. Three green circles in the center are the movie clip symbols.

Views

46

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Sep 07, 2020 0
Adobe Community Professional ,
Sep 07, 2020

Copy link to clipboard

Copied

Hi.

 

It's probably because Buttons symbols have their mouseChildren property set to false by default while Movie Clip symbols don't.

 

So when you try go get the current target on a Button instance, you get the actual button itself. But if you try to do the same with a Movie Clip instance, the current target will probably be some shape or bitmap inside of it.

 

So what you can do is to set to the mouseChildren property of your Movie Clip instance to false.

 

Please let us know if this is what you need.

 

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 07, 2020 0
Community Beginner ,
Sep 07, 2020

Copy link to clipboard

Copied

Hi, JC, thank you so much every time.

 

As you told me, by setting the mouseChildren property to false, the movieclip symbol responds to mouse events like a button symbol.


I am a beginner who wants to create learning content with Animate. I am learning by modifying little by little with the source files released by experts. I have a lot of fun doing this.

 

I think Animate is a great tool for creating interactive learning like games.


Best regards
YCK

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 07, 2020 1
Adobe Community Professional ,
Sep 07, 2020

Copy link to clipboard

Copied

Hi, Young.

 

This is great. I'm glad it's working now.

 

Yeah. Animate is a great tool for creating simple games and learning content.

 

I have a GitHub repo with some samples:

http://bit.ly/2mJgDoG

 

Maybe you'll find something useful there.

 

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Sep 07, 2020 0