[RESOLVED] moview clip Button issues

[emoska]

Hi all :-)

I'm trying to create a button which displays an animation when the mouse hovers over it, and then performs an exit animation when it hovers out. I've looked at many of the major tutorials for this without success.

The one I'm looking at right now, basically gets the user to create a movie clip containing an animation of a button at different states ('up', 'over' and 'out'). It then uses actionscript to play some of the sequence on rollOver, and the rest of the sequence on rollOUT. It then asks for this code to be pasted on an actions layer on the main stage:


1. btn1_mc.buttonMode = true;
2. btn1_mc.addEventListener(MouseEvent.ROLL_OVER,onBu ttonOver);
3. btn1_mc.addEventListener(MouseEvent.ROLL_OUT,onBut tonOut);
4.
5. function onButtonOver(e:MouseEvent):void
6. {
7. e.currentTarget.gotoAndPlay("over");
8. }
9.
10. function onButtonOut(e:MouseEvent):void
11. {
12. e.currentTarget.gotoAndPlay("out");
13. }


But the error I get when I try and use it is:

"Location: Line 5. Description: The class or interface 'MouseEvent' could not be loaded. Source: function onButtonOver(e:MouseEvent):void

Location: Line 10. Description: The class or interface 'MouseEvent' could not be loaded. Source: function onButtonOut(e:MouseEvent):void"


The weird thing is that I downloaded the .fla file from the tutorial page and managed to get my button working by pasting it in there, but when pasting that back into my movie, this error returned :-p

Any ideas?

[mikepol]

1. create a movieclip, name it myButton
2. on the movieclip timeline create your states (how you want your button to look when it's up, over, pressed)
3. give those frames labels "_up" , "_over" and "_down" (no quotes)
4. put a stop() at the end of each state's animation in the timeline.
5. go back to _root and in the first frame type:

myButton.onPress=function(){}

6. publish and presto

[emoska]

Hi Mikepol :-)

Thanks for helping out

Ok, I've tried your code and the movie is loading with no errors, but the button does nothing when rolled over or out.

With placing the code on _root, did you mean placing it on the first frame of the 'actions' layer on my main movie? Or creating a new bit of code specifying it as the root movie?

Thanks again!

[mikepol]

so put the

myButton.onPress=function(){}

in the same frame that myButton is located, so that you can target it correctly.

This will tell myButton to react to all the states that you've defined and make the movieclip behave like a button

[emoska]

Great, got it. I put the code in the same frame as the mc button, and it seems to be responding like a button (i.e. is able to be pressed), but isn't animating at all...

[emoska]

This may be a stupid question, but am I supposed to be using all the original code I talked about earlier? Or is this a new approach?

[mikepol]

This is an approach to going to a specific frame label in your gotoAndPlay("out")
but this time instead of "out" you have "_up" , "_over" and "_down". forget about your listeners. once you declare your button as pressable, flash's bit of internal hacky magic kicks in where it interally recognises "_up" , "_over" and "_down" and goes to that frame when that state is meant to happen when the movieclip is being treated as a button.
you can then delare your functional handles for that button independently elsewhere, using

myButton.onPress=function(){}
myButton.onRelease=function(){}
myButton.onRollOver=function(){}

etc..

[Mr Wabbit]

There are 5 states in total, when you use a Movieclip

So Mikepol said, the 4 that all know though there is one last state, which is onReleaseOutside.

It may sound useless, but bug can occur easily if not used. You do not need to use it on a button (as in Symbol type Button) as its already built in.

Play with the following, make a mc and give it an instance of mcRelease and then in the main frame actions place the following.

mcRelease.onPress = function(){
	trace ("Press");
}

mcRelease.onRelease = function(){
	trace ("Release");
}

mcRelease.onRollOver = function(){
	trace ("RollOver");
}

mcRelease.onRollOut = function (){
	trace ("Rollout");
}

mcRelease.onReleaseOutside = function (){
	trace ("Release outside");
}

This will show you all the states.

Just some extra material that could help really

[emoska]

Hey guys, it's working! Thanks for helping out, I really appreciate it

One question though, the button resizes for some reason when I publish it. Any ideas?

Again, thank you!

[Mr Wabbit]

If it resizes its likily to be you have used _x or _y scale somewhere in the movie, often people do this because there button is a child and they resize the parent. Though Im not sure why in your case without seeing the code.