Home Tutorials Forums Articles Blogs Movies Library Employment Press
Old 08-08-2010, 11:46 AM   #1
CappMarvel
Registered User
 
Join Date: Feb 2005
Posts: 30
Default On Click - Movieclip Color Change

Hi,

I'm trying to get a movieclip fill color to change once clicked. I'm able to get the mouseover and mouseout working. But the click state isn't working properly.

Here's my code:

Code:

Code:
my_mc.addEventListener(MouseEvent.MOUSE_OVER, onFolderOver, false, 0, true);
my_mc.addEventListener(MouseEvent.MOUSE_OUT, onFolderOut, false, 0, true);
my_mc.addEventListener(MouseEvent.CLICK, showMovieclip, false, 0, true);

function onFolderOver(evt:MouseEvent):void {
    var trans = evt.target.transform.colorTransform;
    trans.redOffset = -100;
    trans.blueOffset = -100;
    trans.greenOffset = -100;
    evt.target.transform.colorTransform = trans;
}

function onFolderOut(evt:MouseEvent):void {
    var trans = evt.target.transform.colorTransform;
    trans.redOffset = 0;
    trans.blueOffset = 0;
    trans.greenOffset = 0;
    evt.target.transform.colorTransform = trans;
} 

function showMovieclip(evt:MouseEvent):void {
    var transClick = evt.target.transform.colorTransform;
    transClick.redOffset = -100;
    transClick.blueOffset = -100;
    transClick.greenOffset = -100;
//	transClick.color = 0xFFFFFF;
    evt.target.transform.colorTransform = transClick;

}
When I use the above code, nothing happens once clicked. I tried using the color property, but, although that made a color change (black), it wasn't the color I had indicated (white).

What I have is a movieclip ("my_mc"). Inside the movieclip are other movieclips. When one is clicked, only that movieclip ("my_mc.movieclip01"), is highlighted.

Assistance please.

Thanks.

Stephen
CappMarvel is offline   Reply With Quote
Old 08-08-2010, 01:40 PM   #2
flashGeneral
Senior Member
 
Join Date: Dec 2009
Location: New York
Posts: 188
Default

You have the same settings for mouse over and click. So when your mouse is over the movie clip, then you click on it nothing will change.
flashGeneral is offline   Reply With Quote
Old 08-08-2010, 03:49 PM   #3
CappMarvel
Registered User
 
Join Date: Feb 2005
Posts: 30
Question

Hi flashGeneral,

Well, even when I change my settings to something like this:

Code:
function showMovieclip(evt:MouseEvent):void {
    var transClick = evt.target.transform.colorTransform;
    transClick.redOffset = -50;
    transClick.blueOffset = -50;
    transClick.greenOffset = -50;
//	transClick.color = 0xFFFFFF;
    evt.target.transform.colorTransform = transClick;

}
...there's still no change. I suspected that might be an issue initially, so I changed the variable name of showMovieclip to be different from the others. It didn't help.

Just to clarify, I want the click color to be the same as the mouseover color. I'm trying to have "over", "off" and "on" states.

Any thoughts?

Thanks.

-Stephen
CappMarvel is offline   Reply With Quote
Old 08-08-2010, 03:57 PM   #4
tadster
tadster
 
tadster's Avatar
 
Join Date: Feb 2009
Location: Texas
Posts: 2,111
Default

did you try just appyling a new colorTransform
ActionScript Code:
function showMovieclip(evt:MouseEvent):void {     evt.target.transform.colorTransform =     new ColorTransform(0, 0, 0, 1, 255, 255, 255, 0); }
__________________
www.actiontad.com - ActionScript and JavaScript sitting in a tree...
tadster is offline   Reply With Quote
Old 08-08-2010, 04:46 PM   #5
flashGeneral
Senior Member
 
Join Date: Dec 2009
Location: New York
Posts: 188
Default

I did the same on my end and the code you posted works for me as written.
The thing I don't understand is if you mouse over your target and it changes the offset color, why put code that keeps the offset color the same when clicked? By clicking on your target doesn't change the offset color of the mouse over function.
flashGeneral is offline   Reply With Quote
Old 08-08-2010, 06:03 PM   #6
flashGeneral
Senior Member
 
Join Date: Dec 2009
Location: New York
Posts: 188
Default

I think I got it, use ROLL_OUT and ROLL_OVER because bubbles is false.
ActionScript Code:
my_mc.addEventListener(MouseEvent.ROLL_OVER, onFolderOver, false, 0, true); my_mc.addEventListener(MouseEvent.ROLL_OUT, onFolderOut, false, 0, true); my_mc.addEventListener(MouseEvent.CLICK, showMovieclip, false, 0, true); var trans:ColorTransform = new ColorTransform(); function onFolderOver(evt:MouseEvent):void {     trans.redOffset = -100;     trans.blueOffset = -100;     trans.greenOffset = -100;     evt.target.transform.colorTransform = trans; } function onFolderOut(evt:MouseEvent):void {     trans.redOffset = 0;     trans.blueOffset = 0;     trans.greenOffset = 0;     evt.target.transform.colorTransform = trans; } function showMovieclip(evt:MouseEvent):void {     trans.redOffset = -100;     trans.blueOffset = -100;     trans.greenOffset = -100;     evt.target.transform.colorTransform = trans; }

Last edited by flashGeneral; 08-08-2010 at 06:19 PM.
flashGeneral is offline   Reply With Quote
Old 08-08-2010, 09:42 PM   #7
flashGeneral
Senior Member
 
Join Date: Dec 2009
Location: New York
Posts: 188
Default

Maybe this is closer for what you are looking for:
ActionScript Code:
my_mc.addEventListener(MouseEvent.MOUSE_OVER, onFolderOver, false, 0, true); my_mc.addEventListener(MouseEvent.MOUSE_OUT, onFolderOut, false, 0, true); my_mc.addEventListener(MouseEvent.CLICK, showMovieclip, false, 0, true); my_mc.mouseEnabled=false; var trans:ColorTransform = new ColorTransform(); var nameArray:Array = new Array(); function onFolderOver(evt:MouseEvent):void {     trans.redOffset = -100;     trans.blueOffset = -100;     trans.greenOffset = -100;     for (var i:int=0; i<nameArray.length; i++) {         if (evt.target.name==nameArray[i]) {             trans.redOffset = -100;             trans.blueOffset = -100;             trans.greenOffset = -100;         }     }     evt.target.transform.colorTransform = trans; } function onFolderOut(evt:MouseEvent):void {     trans.redOffset = 0;     trans.blueOffset = 0;     trans.greenOffset = 0;     for (var i:int=0; i<nameArray.length; i++) {         if (evt.target.name==nameArray[i]) {             trans.redOffset = -100;             trans.blueOffset = -100;             trans.greenOffset = -100;         }     }     evt.target.transform.colorTransform = trans; } function showMovieclip(evt:MouseEvent):void {     nameArray.push(evt.target.name);     for (var i:int=0; i<nameArray.length; i++) {         if (evt.target.name==nameArray[i]) {             trans.redOffset = -100;             trans.blueOffset = -100;             trans.greenOffset = -100;         }     }     evt.target.transform.colorTransform = trans; }
flashGeneral is offline   Reply With Quote
Old 08-09-2010, 02:02 AM   #8
CappMarvel
Registered User
 
Join Date: Feb 2005
Posts: 30
Smile

Hi flashGeneral,

Yes, the second option you sent works the way I want! Thanks. I didn't realize there would be so much work involved just for a on state.

Incidentally, this is for a map of the United States. When you mouseover any state, it's highlighted. And when you click on a state, that state remains highlighted -- until you click on another state, and that state becomes highlighted, and all others go back to the off state. I'll have to modify the code further to accomplish that, but you've put me on the path to solving that.

Thanks again.

Stephen
CappMarvel is offline   Reply With Quote
Old 08-09-2010, 04:22 AM   #9
flashGeneral
Senior Member
 
Join Date: Dec 2009
Location: New York
Posts: 188
Default

Try this :
ActionScript Code:
my_mc.addEventListener(MouseEvent.MOUSE_OVER, onFolderOver, false, 0, true); my_mc.addEventListener(MouseEvent.MOUSE_OUT, onFolderOut, false, 0, true); my_mc.addEventListener(MouseEvent.CLICK, showMovieclip, false, 0, true); my_mc.mouseEnabled=false; var trans:ColorTransform = new ColorTransform(); var nameArray:Array = new Array(); var currMovie:MovieClip = new MovieClip(); function onFolderOver(evt:MouseEvent):void {     trans.redOffset = -100;     trans.blueOffset = -100;     trans.greenOffset = -100;     for (var i:int=0; i<nameArray.length; i++) {         if (evt.target.name==nameArray[i]) {             trans.redOffset = -100;             trans.blueOffset = -100;             trans.greenOffset = -100;         }     }     evt.target.transform.colorTransform = trans; } function onFolderOut(evt:MouseEvent):void {     trans.redOffset = 0;     trans.blueOffset = 0;     trans.greenOffset = 0;     for (var i:int=0; i<nameArray.length; i++) {         if (evt.target.name==nameArray[i]) {             trans.redOffset = -100;             trans.blueOffset = -100;             trans.greenOffset = -100;         }     }     evt.target.transform.colorTransform = trans; } function showMovieclip(evt:MouseEvent):void {     if (currMovie != evt.target as MovieClip) {         trans.redOffset = 0;         trans.blueOffset = 0;         trans.greenOffset = 0;         currMovie.transform.colorTransform = trans;     } else {         trans.redOffset = -100;         trans.blueOffset = -100;         trans.greenOffset = -100;     }     nameArray.push(evt.target.name);     for (var i:int=0; i<nameArray.length; i++) {         if (evt.target.name==nameArray[i]) {             trans.redOffset = -100;             trans.blueOffset = -100;             trans.greenOffset = -100;             currMovie = evt.target as MovieClip;             for (i=0; i<nameArray.length; i++) {                 if (nameArray.length==2) {                     nameArray.splice(0,1);                     trace(nameArray.length);                 }             }         }     }     evt.target.transform.colorTransform = trans; }
flashGeneral is offline   Reply With Quote
Old 08-09-2010, 09:49 AM   #10
OmerHassan
Senior Member
 
Join Date: Mar 2009
Location: Islamabad, Pakistan
Posts: 207
Send a message via Skype™ to OmerHassan
Default

In your original code, replace all occurrences of
ActionScript Code:
evt.target
by
ActionScript Code:
evt.currentTarget

target property of the event refers to the movie clips inside my_mc whereas currentTarget refers to the movie clip that was listening for the event (my_mc is listening for the event).
OmerHassan is offline   Reply With Quote
Reply


Thread Tools
Display Modes Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 01:54 PM.

///
Follow actionscriptorg on Twitter

 


Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
Ad Management plugin by RedTyger
Copyright 2000-2013 ActionScript.org. All Rights Reserved.
Your use of this site is subject to our Privacy Policy and Terms of Use.