Intro to ActionScript


"Before & After 2" Assignment example at Bottom of Page

Using ActionScript to Animate Objects

    What you'll learn:
  • Animation can be done without using the timeline at all!
  • A little taste of what advanced coding in ActionScript is about.
  • That Flash is made of objects, objects have properties, and properties can (often) be coded.

See the example below for what you'll make.

1) Draw a picture, and convert it to a symbol a movie clip. Call it "bob_mc", or whatever you like. Click on it, and look down at the Properties Panel: Where it says "Instance Name" grayed out, write in a name, such as "bob". This name allows you to find this object on the stage, even though you've made hundreds of instances of "bob_mc".

2) Create three buttons and write titles on them, "move", "rotate" and "alpha".

3) Code the "alpha" button:

on (release) {
            _root.bob._alpha = 34;
     }

This button says that when the button is clicked, go to the main timeline (the _root), find the object called "bob" and note it's property of transparency (it's _alpha), then set the _alpha to 34 percent (alpha is on a scale from 0, invisible, to 100, full opaque). The code must be put in precisely for the animation to work! Test movie: your movie clip should fade when you click the alpha button.

4) Code the "rotate" button:

on (release) {
            _root.bob._rotation = 79;
     }

This button says that when the button is clicked, go to the main timeline (the _root), find the object called "bob" and note it's angle (it's _rotation), then reset the _rotation to 79 degrees (alpha is on a scale from 0, not moving, to 360, full circle). The code must be put in precisely for the animation to work! Test movie: your movie clip should tilt when you click the rotate button.

5) Code the "move" button:

For this one, we're going to note that each property has a number attached to it: a property measures something that can be expressed with a number: alpha is in percents, 0-100; rotation is in degrees, 0-360. We're going to manipulate the objects placement on the "x" axis of the stage.

on (release) {
            _root.bob._x = _root.bob._x + 10;
     }

This code says that on button release, find the number of pixels "bob" is from the left side and reset "bob's " position on the x axis to that number + 10 pixels! On each click, bob should move right by 10 pixels.

That's it!