Feb 14 2009

AS3 how to control a movieclip from a class

Category: ClassesHadi Tavakoli @ 4:42 pm

While walking through AS3 you have certainly faced the problem that you want to use a movieclip from the library in your movie and you do not have any attachMovieClip as you had in AS2!

ok, the problem will be solved when you look at everything including every movieclip as a class. Considering that, let's do a small test and see if we can set a simple movieclip in the library and bring in some other movieclips into the stage and play around with its playhead...

I'm writting this post right at the middle of creating a resizable horizental menu, so I just stopped at the beggining to write this little article and then go ahead with my menu... which I hope I can finish it by tonight :)

anyway, let's start by creating a new AS3 Flash File from File > New and at the first frame put the follwoing on the action panel:

(Maybe we can sometimes use the document class for our flash creations, but I don't know why I don't like that document class! maybe it's because I still have not found any good reason for using that. it makes me feel a bit limited. so I'm not using it untill I find a good reason for that!)


		  
		  
		  
		  
		  
		  
		

The first line here actually imports another class into our FLA which will be used as the base for our menu and we will import the library items in that HMenu class and the last line above, simply puts the new class we just called into the stage.

Well, I'm sure you know this, but don't test the movie right now as you still have not created any HMenu class yet, right?!

now save your FLA somewhere and name it anything you want, it doesn't matter but just remember to correct the import path for your own use.

Now open a new .as file from File > New and save it with the name "HMenu.as" in the exact path you entered above and put this code in it:


		  
		  
		  
		  
		  
		  
		

What you get from this code is that HMenu is actually a MovieClip and it's constructor function will create new instances of another class called Box and adds it into itself, the HMenu class.

maybe you are saying that in this point, we will create another class in a .as file... to some extends, yes, but before doing that, let's get back to our FLA and create our Box class in there by just creating a movieclip in the library!

So, in your FLA, hit Insert > New Symbol and call your new symbol "Box" and select the MovieClip option and at the bottom of that window click the "advanced" button to see the other options.

Check the "Export for ActionScript". in the class field type the path to the same path you used as above when importing the HMenu class. in my case, I typed "com.myflashlab.classes.tools.hMenu.Box".

And leave the Base Class field as it is which should be "flash.display.MovieClip" if you are interested to know what it exactly means by Base Class, you should know that it will actually say that this class you are creating will extend the MovieClip class.

now you're done, hit the OK button and the movieclip will appear in your library. (Maybe it will give you a gentel notice saying that the class file is not avaiable in the path you entered and flash will generate it automatically... or smething like that, well, no problem, let flash do what it needs to do! you go ahead!)

in the Movieclip you just created, create two key frames and in each one draw some shapes or write something, whatever, the intension is to have two frames or more in the movieclip so later we can see how you should control the playhead indicator from the Box class file we will later create.

For right now, test the movie! and you will see that the movieclip you created will be shown on the stage! and of course it loops through the keyframes you created!

If you still have any doubt on why it's showing on the stage, let's have a quick review on what we did so far... First on the FLA we created a class called HMenu and added it to the stage. then in HMenu class we called in a class called Box like this

var myBox:MovieClip = new Box();

** notice the name of the class "Box".

And finally we created a movieclip symbol in the FLA and named it "Box". So flash understand what to do and creates the .as file in runtime (We don't see it but it is there actually!) and that's it, the library movieclip will be used.

ok, nice and easy till here, and now we want to create a Box.as class file that we will actually be able to see so we can control our library symbol! This will be so easy, just open a new .as file and save it with the name of Box.as in the exact same place you used when creating the Symbol in the library... and insert the fowwloing code into the Box.as file.


		  
		  
		  
		  
		  
		  
		

Test your movie and the playhead indicator will stop at the first frame simply because you had told the movieClip class to stop();

That's all. I'm sure you will find this articla very helpful when you will be dealing with some situations when you want to create some instances of a same movieclip in a for loop...

I will write more about this on my next post when I actually finish creating my HMenu class.

Thanks,
Hadi

Tags: , , ,