[chosen]

Hello All,

I'm having problems with getting the buttons inside my movie clip to work properly. When I click a button I want to load the movie clip according to the button and remove the current movie clip on the screen.I have 3 buttons on the main timeline with that works excellent with the same code below minus the path of the movie clip. However, the problem comes when I placed the 3 buttons inside of a movie clip it will not work (Please note I have also given it the path according the movie clip). I am attaching the .fla for your review.

stop();
var mc = this.createEmptyMovieClip("emptyMC", this.getNextHighestDepth());
_level0.MCTester.Squares.onRelease = function() {  
mc.removeMovieClip();	
mc.attachMovie("Squares", "Squares", this.getNextHighestDepth(), {_x:350, _y:90});
};
_level0.MCTester.Circle.onRelease = function() {	
mc.removeMovieClip();   
mc.attachMovie("Circle", "Circle", this.getNextHighestDepth(), {_x:350, _y:150});
};
_level0.MCTester.Rect.onRelease = function() { 
mc.removeMovieClip();   
mc.attachMovie("Rect","Rect", this.getNextHighestDepth(), {_x:350, _y:230});
};

Attached File(s)

•  Movie_Clip_Buttons.zip (93.53K)
  Number of downloads: 91

[thehat]

First of all, you don't need the _level0.MCTester. on your buttons, so I'm not going to use it in this post.

The reason that this isn't working is because when you use the notation onRelease = function the scope of the funtion becomes the button rather than it's containing movieclip. This is easily illustrated:

Squares.onRelease = function() {
	trace(this); //gives _level0.MCTester.Squares
};

So you have two options. The first is to use _parent. This is the easiest technique, and uses the least code, but I don't think it's the best way to learn.

Squares.onRelease = function() {
	trace(this);   
	   _parent.mc.attachMovie("Squares", "Squares", this.getNextHighestDepth(), {_x:350, _y:90});
};

The second option is using something called Delegate. This allows you to create function to handle the button clicks, which means the scope stays with your movieclip. I prefer this technique because it more closely resembles the way events are handled in actionscript 3, and because it enables you to keep proper control of scope which becomes important if you want to get into object orientated programming. Delegate has a method called create, which links your button press to a function. It requires two arguments, the scope of the target function and the name of the target function.

stop();

import mx.utils.Delegate;

var mc = this.createEmptyMovieClip("emptyMC", this.getNextHighestDepth());

Squares.onRelease = Delegate.create(this, onSquares);
Circle.onRelease = Delegate.create(this, onCircle);
Rect.onRelease = Delegate.create(this, onRect);

function onSquares() {
	trace(mc);
	//mc.removeMovieClip();	
	mc.attachMovie("Squares", "Squares", 1, {_x:350, _y:90});
};

function onCircle() {	
	//mc.removeMovieClip();   
	mc.attachMovie("Circle", "Circle", 1, {_x:350, _y:150});
};

function onRect() { 
	//mc.removeMovieClip();   
	mc.attachMovie("Rect","Rect", 1, {_x:350, _y:230});
};

The other thing you'll notice is that I've commented out the removeMovieClip calls. Now that your scope is working properly that call actually removes mc, meaning nothing can attach to it. If you want to be sure that the previously attached image is removed each time, just attach it to the same layer.

This post has been edited by thehat: 06 October 2009 - 06:28 AM

[chosen]

Thank you thehat, I never heard about the delegate function but it does seem to make the code a lot easier. Thanks again!