Flash Exercise Notes 2
syllabus | schedule | assignments | class notes | web resources | ARTC courses
ActionScripting Essentials and More Drawing
Basic Flash Programming

To add comments to a piece of code:

// one line is commented out
/* comment */ multiple lines of code are commented out
***************************************************

Being able to see what is wrong with your code

Use trace(); a LOT.

trace("hello I am here");
trace(theVariable);

Use trace to see what the variable is at any point or put trace in a function to see if it gets in there.
***************************************************

Rules

Don't use reserved words as your variable names.

If it turns blue while you are typing it, then it is reserved.
***************************************************

DataTypes

Array
Boolean
Date
MovieClip
Number
Object
String
Textfield

Date, MovieClip and Textfield have data types within them - they are called composite data types

Arrays are collections of data - they can contain lots of individual things.

Examples:
var theColors:Array = new Array():
var theNames:Array = new Array("Bob", "John", "Mary", "Jane");

To access one element in an array:

trace (theNames[1]);

To add another element to the end of an array:

theNames.push("Frank");

Arrays start at 0

***************************************************

If Blocks

if (myAge >= 18) {
      trace("go have fun");
}

--------------------

if (myAge < 18) {
      trace("stay home");
}
else if (myAge >= 65) {
      trace("retire");
}
else if (myAge == 18) {
      trace("have fun");
}
else if (myAge > 18 && myAge < 65) {
      trace("get a job");
}

To make a textbox that the user can enter information into you need to specify that the textbox is Input Text in the Properties. You also need to give it an Instance Name. If you have a button that you click to see what the age is the code might look like this:

inputButton.onRelease = function() {
      var myAge = myInput.text;
      if (myAge<18) {
           trace("stay home");
      } else if (myAge>=65) {
           trace("retire");
      } else if (myAge == 18) {
           trace("have fun");
      } else if (myAge>18 && myAge<65) {
           trace("get a job");
      }
};

backgroundColor = '#000000';

***************************************************

Creating a Gradient Fill

beginGradientFill(fillType, colors, alphas, ratio, matrix, [spreadMethod], [interpolationMethod], [focalPointRatio]);
endFill();

fillType = "linear" or "radial"
      with a radial fill the first color specified is in the middle

colors = a Array of colors either specified before you use it in the beginGradientFill function or in the function call itself.

for example the array of colors are defined in the call:
beginGradientFill("linear", [0x000000, 0xFFFFFF], [100, 50], [0, 255], matrix);

You can add as many colors as you want but you must have the same number of alphas, and ratios listed.

ratio = the position of the color in the gradient. For instance, 0 is the start of the gradient and 255 is the end of the gradient. 128 is in the middle of the gradient.

alphas = the transparency level for each of the colors in the gradient

matrix is an object that has type, width, height, x, y and rotation defined.

For instance notice that we can define the Array of colors, alphas, ratios and the matrix before we call the beginGradientFill function:

init();
function init() {
      lineStyle(1, 0, 100);
      var colors:Array = [0xFFFFFF, 0xFF00FF];
      var alphas:Array = [100, 50];
      var ratios:Array = [0, 255];
      var matrix:Object = {matrixType: "box", w:100, h:100, x:0, y:0, r:0};
      beginGradientFill ("linear", colors, alphas, ratios, matrix);
      moveTo(0,0);
      lineTo(100,0);
      lineTo(100,100);
      lineTo(0,100);
      lineTo(0,0);
      endFill();
}

To rotate the gradient you will need to change the r value:
r:0 = left to right
r:Math.PI/4 = 45 degree angle
r:Math.PI/2 = right to left

To specify a radial gradient:
beginGradientFill ("radial", colors, alphas, ratios, matrix);

Your gradient will not work if any of the following is true:
The number of items in the colors, alphas, and ratios parameters are not equal.
The fillType parameter is not "linear" or "radial".
Any of the fields in the object for the matrix parameter are missing or invalid.

Three optional parameters you can add to the beginGradientFill function:

spreadMethod = "pad" "reflect" or "repeat" - how the gradient acts when it hits the end

pad will make the last color stay there and stretch across

reflect will make the gradient repeat backwards then forward then backwards

repeat will repeat the gradient over and over

interpolationMethod = "rgb" or "linearRGB" - effects how the colors are distributed when they repeat

focalPointRatio = a number between -1 and 1 that controls the center of the gradient (good for a radial gradient).

0 = focal point in the center
1 = focal point is at one border of the gradient circle
-1 = focal point is at the other border of the gradient circle

You could modify the above example to be:

gradButton2.onRelease = function(){
      lineStyle(1, 0, 100);
      var colors:Array = [0xFFFFFF, 0x0000FF, 0x00FF00];
      var alphas:Array = [100, 75, 50];
      var ratios:Array = [0, 128, 255];
      var spreadMethod = "repeat";
      var interpolationMethod = "RGB";
      var focalPointRatio = 0.3;
      var matrix:Object = {matrixType: "box", w:100, h:100, x:100, y:0, r:0};
      beginGradientFill ("radial", colors, alphas, ratios, matrix, spreadMethod, interpolationMethod, focalPointRatio);
      moveTo(100,0);
      lineTo(200,0);
      lineTo(200,100);
      lineTo(100,100);
      lineTo(100,0);
      endFill();
}

****************************************

A simple Drawing program

init();
function init() {
      lineStyle(4, 0, 100);
}
function onMouseDown():Void {
      moveTo(_xmouse, _ymouse);
      onMouseMove = draw;
}
function onMouseUp():Void {
      delete onMouseMove;
}
function draw():Void {
      lineTo(_xmouse, _ymouse);
}

****************************************

Changing parameters of the drawing program

//initialize the variables

var pencolor:String = "0x000000";

function onMouseDown():Void {
      lineStyle(mySizeInput.text, pencolor, theLineAlpha.text);
      mydrawingmoveTo(_xmouse, _ymouse);
      onMouseMove = draw;
}
function onMouseUp():Void {
      delete onMouseMove;
}
function draw():Void {
      mydrawinglineTo(_xmouse, _ymouse);
}