Flash CS3 Tutorial: Loops, for if and while

The for loop is made up of three elements that have the capability to provide for a counter variable, a condition and an operation all in one line. The three elements are separated by a semicolon and contained within a set of parentheses, see example. The first element is the variable in the example the variable is i. The second element is the condition, in this example the for loop is checking to see if i is less then 10. The third and final element is the operation or counter. In the example i is increased by one every time the loop is started.

for (var i:int = 0; i< 10; i ++){

//do this

}

Flash CS3 Tutorial, In this Flash CS3 Tutorial you will find that a few simple objects have been created for you. In the Library you will see three items: container, faster_btn and slower_btn. The faster_btn and slower_btn are simply buttons that you are going to add event listeners to. The object that is slightly different is the container movie clip. This movie clip is empty at the moment but you are going to use ActionScript to put something inside of it. In this Flash CS3 Tutorial the container has already been named container1 in the linkage properties dialog box, but make sure that you remember this step.

To link an object right click on the objects name inside the library select linkage, then select export for ActionScript.

You should be familiar with the naming conventions so, open the actions panel by pressing F9, select the first key frame on the actions layer and look at the code already in the layers panel. The first line of code is creating a variable called speed and setting it equal to 6. You will use this variable later in this Flash CS3 Tutorial. The next line creates the variable container, data types it as a movie clip and sets it equal to a new instance of container1. Remember the linkage, container1 is the name given to the empty movie clip in the library. The third line simple adds an instance of the container to the stage. In more advanced Flash CS3 Tutorials you will learn more about the rest of the code already in the actions panel. This Flash Tutorial is really meant to focus on the for loop.

for (var i:int = 0; i< 361; i +=12){

var shape:Shape = new Shape();

shape.graphics.lineStyle(1.5, 0x45DC91); shape.graphics.drawEllipse(0,0,110,40);

container.addChild(shape); shape.rotation = i;

};

Copy and past the next block of example code to the actions panel, below the other code. Here is the actual for loop, this loop is defining i setting it equal to zero, it then check to see if i is less then 361, if i is less then 361 the loop will do whatever is inside the {}. Next, every time the loopis found to be true the loop adds 12 to the value of i. You can put any information inside the brackets{}.In this Flash CS3 Tutorial the for loop is being used to draw a design. Feel free to explore the shape properties if you want but, this Flash Tutorial isn't going to cover them. However, this Flash Continue SmileyCS3 Tutorial is going to make something interesting so Press control enter to see your for loop in action.

While Loop The while loop is very similar to a for loop in that both will accomplish the same thing. The difference is that you must define each of the elements within a while loop yourself.

Warning - you need to be careful to safe your file before testing a while loop, if you forget part of the code you can and will create and endless loop.

var j:int = 0

while (j<361){

var shape2:Shape = new Shape();

shape2.graphics.lineStyle(1, 0x2C17E8 ); shape2.graphics.drawEllipse(0,0,155,80);

container.addChild(shape2);

shape2.rotation = j;

j+=10

};

Copy the example code into the actions panel below the for loop. The first line of the example code creates and defines the variable j. next is the while statement that checks to see if j is lessthen 361. The new and important line is the last one j+=10 this is basically the counter that increases j. If you forget this line j will never, not be less the n361. Therefor causing the code to run forever. Do, While Loop So, you now have a bar that grows with the amount of data loaded in the main time line, but nothing else happens. You need to make the movie play when the function progressAction is finished. There are several ways to do make Flash CS3 do something when it has finished loading. First, I'm going to show you the simplest way. You can simply add an if statement that checks to see when yourProgress is equal to or greater then 1. If yourProgress is greater or equal to one then play.

var m:int = 0

do {

var shape1:Shape = new Shape();

shape1.graphics.lineStyle(1, 0xFF9900 ); shape1.graphics.drawEllipse(0,0,125,80);

container.addChild(shape1);

shape1.rotation = m; m+=10

} while (m<361);

If you Press Control-Enter you should see the spirals spinning. Each spiral is created with a different kind of loop. Continue Smiley

If you want to understand how the circles were drawn play with the code inside the loops, then checkout the tutorial under controlling graphics.

Download Flash CS3 Tutorial, Source Files