 Movieclip symbols are reusable pieces of flash animation  consisting usually of one or more graphic/button symbols  thus they are flash movies within your flash movie.  They have their own non-restricted Timeline (any number of layers and frames - just like the main timeline) that plays independent of the main movie's Timeline.

 The best thing about using movieclips is that you can control them with ease.  you can change their dimensions, position, color, and other properties and can even duplicate and delete them.  Movie clip symbols have instance names which helps in accessing them within actionscript.

 Ex) to create a movie clip symbol, follow the following steps: 1. First create/import the object(s) to be converted into a movieclip. Import an image onto the stage using Ctrl+R. 2. Select the object(s) and then press F8 (or Modify >> Convert to Symbol). 3. Select the Movieclip type and name the symbol, say 'mc_fade').

3. Double-click the instance of 'mc_fade' on the stage to switch to its symbol-editing mode. 4. Now create an animation sequence (you can use simple Tweened Animation or Frame-by-Frame Animation)Tweened AnimationFrame-by-Frame Animation

5. The previous figure shows the Timeline of the Movieclip symbol. Click Scene 1 to exit from the symbol editing mode. 6. Save your work and test the Movie (Ctrl + Enter). That's it your movieclip is ready! Its that simple. 7. Add another scene, then move the created movie clip symbol onto the stage.

 Ex) This example shows how we could access movie clip symbol within action script. 1. Create a new flash file 2. draw a small circle onto the stage and convert it to movie clip symbol. 3. Give this symbol an instance name (circle) 4. Create four buttons. Each button will be used to move the movie clip symbol (circle) in one of the four directions(up, down, left, right)

 Note: the upper-left corner has the coordinates (0,0).  To move the movieclip symbol down, increments y-axis.  To move the movieclip symbol up, decrements y-axis.  To move the movieclip symbol right, increments x-axis.  To move the movieclip symbol left, decrements x-axis.

5. Add the following code to the up button: on( press) { circle._y = circle._y – 10; } circle._y: it is the y-axis for the circle movie clip symbol

6. Now, by your self write the action script for the other buttons. 7. Test the application

 ex) in this example, we will show how to make a movie clip symbol that keeps moving on the stage according to the direction user specifies. 1. Create a new flash movie 2. On the first layer, import a certain background image to cover all the stage. 3. Go to (insert  New Symbol) to insert a new symbol. Make its type movie clip

4. Import an animated image to the area of the created movie clip symbol. Use (import  import to stage) to insert the image directly on symbol area 5. If you import an animated image, you will notice a number of images added to the library. And also, a number of keyframes will be added to the symbol timeline. 6. Return to the main time line, insert the created symbol onto the stage and name it (m). 7. Insert another layer, name it (buttons). 8. Add 4 buttons within this layer. Each one for a certain direction (Up, Down, Left, Right) 9. Insert another layer, name it (actions). 10. On the first frame of this layer, add the following actionscript:

var x:Number = 1; onEnterFrame = function() { if(x==1) m._x = m._x + 5; else if(x==2) m._y = m._y + 5; else if(x==3) m._x = m._x - 5; else m._y = m._y - 5; } This variable is used to determine the direction of the moving symbol. If it is equals (1): moving right If it is equals (2): moving down If it is equals (3): moving left If it is equals (4): moving up Notice that the initial value of it is 1 (moving right)

var x:Number = 1; onEnterFrame = function() { if(x==1) m._x = m._x + 5; else if(x==2) m._y = m._y + 5; else if(x==3) m._x = m._x - 5; else m._y = m._y - 5; } The code written inside onEnterFrame = function() { } will be executed repeatedly at a rate equals to the movie frame rate (the code will be executed 12 times per second)

var x:Number = 1; onEnterFrame = function() { if(x==1) m._x = m._x + 5; else if(x==2) m._y = m._y + 5; else if(x==3) m._x = m._x - 5; else m._y = m._y - 5; } The code between { … } will be executed repeatedly for an indefinite amount of time. This actionscript will check the value of x, and according to it, the symbol will be moved using a certain direction. The value of (x) will be changed by the four direction buttons inserted in this movie.

11. Now, go to the actionscript of the up button and add the following code: on(press) { _root.x = 4; } 12. go to the action panel of the right button and add the following code: on(press) { _root.x = 1; }

13. go to the action panel of the down button and add the following code: on(press) { _root.x = 2; } 14. go to the action panel of the left button and add the following code: on(press) { _root.x = 3; }

 What is an Array:  Array is a list of cells, each cell in the list has a number to identify it (index or position).  Each cell can be used to hold information such as text, or a number, or an image.  Note: An Array size or length are the same thing. It refers to the number of cells that store information in the Array.

 To declare an array variable inside flash, use the following general form: var array_name:Array = new Array(); Ex) var x:Array = new Array();  This statement will generate an empty array.  To insert a text element to this array: X[0] = “ some text ” ; //Here the text value ( “ some text ” ) will be added to the first element //of the array.  To insert a new numeric element (at position 1): X[1] = 4235; // here the value (4235) will be added to the second element of the //array.

 Adding new elements to this array:  x[2] = “ ab ” ;  X[3] = ;  X[4] = “ asd ” ;  You can notice that arrays created in flash can hold values with different data types “ some text ” 4235 positions elements x “ ab ” “ asd ”

 To get a value from the Array use:  myArrayName[x]; //Where x is index of the value from the Array you want to fetch. Ex) to print the value stored at index (2) of the array defined in the previous example: trace(x[2]);  Counting the Length of an Array:  To find the length of an array in flash use: array_name.length;

 ex) the statement: trace(x.length); will print (5) because array (x) has 5 elements. Exercise) 1. Try (push()) function to add elements to an array 2. Try (reverse()) function to order array elements in reverse order

 Ex) This example shows how to control mouse cursor. The movements of mouse cursor will be captured and stored in an array. Then, these movements will be read and re-played again. 1. Create a new flash file. 2. Write stop(); statement in the action panel of the first frame. 3. Insert a button symbol onto the stage and write “ Start capturing ” as a caption. 4. Add the following actionscript to the action panel of the button. Select the button then click F9 the write:

on(release) { gotoAndStop(5); } 1. Insert a key frame at frame# Write the following action script in the action panel of frame#5: var xa:Array=new Array(); var ya:Array= new Array(); onEnterFrame = function() { xa.push(_xmouse); ya.push(_ymouse); } _xmouse : return the x-coordinate of the current location of the mouse cursor on stage _ymouse : return the y- coordinate of the current location of the mouse cursor on stage Both valuse will be added to both arrays This process will continue repeatedly

1. Add a button onto the stage at frame#5 with “ Stop capturing ” as a caption. 2. In the action panel of that button, put the following actionsript: on(release) { delete onEnterFrame; gotoAndStop(10); } This statement is used to stop the running onEnterFrame function Then, the movie transfers and stops at frame 10

1. Insert a keyframe into frame#10 2. Insert a movie clip symbol onto the stage at this frame and give it (m) as an instance name. 3. In the action panel of this frame, write the following actionscript code:

var i:Number=0; onEnterFrame=function() { if(i<xa.length) { m._x = xa[i]; m._y = ya[i]; i=i+1; } else { delete onEnterFrame; play(); } onEnterFrame repeats the process of reading x and y- coordinate values from the arrays (xa,ya) and giving them to the x and y coordinates of the (m) symbol. This will result in moving the (m) symbol This onEnterFrame repeats the process of reading x and y- coordinate values from the arrays (xa,ya) and giving them to the x and y coordinates of the (m) symbol. This will result in moving the (m) symbol