Introduction to Flash and Actionscript

S2 - Movieclip Properties

T1 - The Snowman

 


Create a new Flash for Android or IOS document depending on your device

Library Symbols



1. Draw a circle on the Stage.

2. Convert this circle into a movie clip symbol called myCircle.


3. Delete the Symbol from the stage.

4. Draw an orange triangle. Use the polyStar tool with sides set to 3. Then use Modify > Transform > Distort to change the shape. Convert it to a symbol and name it myOrangeTriangle. Delete the symbol from the stage.

6. Draw a brown rectangle. Convert each to a symbol, name, and then delete.

Note: Use the rotation feature to angle the arms i.e. myLeftArm_mc.rotation = 45 ;

 

Creating the Snowman using Instances


7. Add 3 instances of the large circle to the side of the stage. Name each instance. NOTE: Put each circle on its own layer so that they can go behind each other

MovieClip Properties

Some properties of MovieClip instances are:

  • scaleX - scales the instance horizontally by a specified number
  • scaleY - scales the instance vertically by a specified number
  • x - controls the x coordinate of the instance
  • y - controls the y coordinate of the instance
  • rotation - rotates the instance to the angle specified (-180 to 180)
  • width - adjusts the width of the instance
  • height - adjusts the height of the instance
  • alpha - adjusts the opacity level of the instance (0 to 1)
  • visible - visibility (true or false)
  • x - x location
  • y - y location

MOVING THE OBJECTS TO CREATE A SNOWMAN

1.
Create a new layer for the ActionScript code. Name this Actions.

 
2. Right Click on Frame 1 and choose Actions

http://4.bp.blogspot.com/-kLliuKv9Pok/TgMKMcoQvjI/AAAAAAAAAL8/2DA4qNgAZVs/s320/actions-panel.png

 

Set up the areas of your program. These sections will go in every program your create

 

To position the snowman


Add the remaining Top Circle

Add the buttons

Add the eyes and mouth using the circles and change the colour

 

To get the color hex values click on the color palette icon in the tool menu (Replace the # with 0x)

 

 

Add the hat using rectangle and circle

Add the arms and nose

 

CREATING A SIMPLE ANIMATION

Create a new MovieClip using an image

 

1. Find a picture of wind on the internet.

2. Copy the image.

3. Insert > New Symbol and name it myWind.

4. Paste the image.

5. To remove the background Modify > Bitmap > Trace Bitmap and then delete

5. Create a new layer and add an instance of the wind to the stage. Name the instance.

 

Fade the wind in using alpha

 

1. On frame 1 of the actions layer change the alpha value of the wind to 0 (invisible)

 

 

2. Right click on frame 10 of the animations layer and add a blank keyframe, set the alpha to 0 .1;

3. Right click on frame 20 of the animations layer and add a blank keyframe, set the alpha to 0.2;

4. Continue every 10 frames until the alpha value is 1.

6. Make duplicate frames of all your other layers by right clicking on the last frame (probably 100) of each layer and adding a keyframe.

7. Run your program.

 

Move the hat across the screen and have it disappear when it leaves the stage.

Change x values and alpha on frames to accomplish this

.

Have the hat rotate as it blows off the screen.

Use the rotate feature on existing frames to rotate the hat