April 8, 2003
Lecture 9: Introduction to Sequential Algorithms via Dynamic Drawing
Demo files are in ~wolz/www/ART34508/Lecture09Demo
We didn't following this outline, but instead looked at some examples that students were asked to build as we went. Because of the extra time for student problem solving, the lecture was extended into Friday. These notes provide a summary of the lecture rather than an outline for the presentation. (Feedback was that it worked well, engaging the students better than a "slide-based" lecture.)
Once again we looked at the four components of a repetition statement:
1. The initial state.
2. The end (or continue condition)
3. The body of the repetition
4. The increment
The lesson is focused on how these components apply to algorithms, and especially to recursive algorithms.
Recursion is the notion of doing the same thing within itself. Rather than
dwell on mental models, we'll simply illustrate its use.
To date we have used the "hand tools" to draw graphics, buttons and movieclips, and then used code to animate them.
ActionScript also provides tools for "programming" drawing.
Only the basics are covered here, the full range of methods can be found in the "reference" window under: Objects>Movies>MovieClip>DrawingMethods
Drawing is accomplished by creating an empty movie clip and then using it to draw.
Download the flash files Demo1.fla
Study the commands "lineTo", "lineStyle" , "moveTo", and "curveTo"
These are the basics there are other commands for drawing and filling as well.
An algorithm is a procedure for doing a task. Its not quite as simple as a "set of rules" because it is indeed a procedure, a sequence of steps.
The real key to thinking about an algorithm though is that an algorithm has some generality to it, that is, it can be applied in more than one situation.
As a simple example, consider an algorithm for drawing a square on the screen.
This requires two vertical and two horizontal lines of the same size connected at the corners.
What I just described is a "rule" for what a square is, but it doesn't direct me in how to draw a square.
Here is an algorithm,
To draw a square, start at an origin position (x,y)
Draw a line from (x,y) to (x+d,y) where "d" is the length of a side of the square
Draw a line from (x+d,y) to (x+d,y+d)
Draw a line from (x+d,y+d) to (x,y+d)
Draw a line from (x,y+d) to (x,y)
Notice in particular that in an algorithm there are variables that allow for, well variability.
You should be able to create an algorithm for drawing a square in ActionScript!
A powerful notion from algorithms is the notion that an algorithm can solve a problem by using simplified versions of itself.
This notion is particularly important to Artificial Intelligence and Networks (graph traversal) algorithms.
Many times it is easier to think about a problem by solving one step and applying the same algorithm to the remainder of the problem.
Download Demo2.fla which contains examples of some recursive algorithms. Notice how the method name is used within the method itself!
Notice too that a recursive algorithm is one that allow you to repeat steps. See if you can identify the four major components of repetition in the recursive methods in Demo2.fla
The methods in the demo are called "tail-end recursive" because the recursion comes at the bottom of the method.
This type of method is very easy to translate into a for or while statement.
To really appreciate the power of recursion you need to have a different way of thinking about drawing.
To that end the "turtle" was invented about 30 years ago.
Rather than drawing lines from coordinate points, the turtle allows you to "move around" a drawing.
A turtle has a "state": a position on the plane, a direction it is facing (calculated in degrees, with north being 0), and a pen state (up or down).
The basic turtle commands are:
Forward(some distance) // changes the position by moving the turtle that distance in the direction of the heading
Back(some distance) // opposite of forward
Right(some turn) // changes the heading of the turtle without changing its position
Left(some turn) // opposite of right.
Penup/Pendown // changes the pen state
When the pen is down the turtle draws while it moves. When the pen is up, the turtle just moves.
Download Turtle1.fla to study how the turtle can be used. You do not need to master the code to make the turtle work, but it IS interesting code.
Download Turtle2.fla to see how the turtle can be used to create drawing algorithms.
Download Turtle3.fla to see how the turtle can be used to create powerful pictures using tail recursion.
A tail recursive algorithm can be rewritten easily as a "loop."
A truly recursive algorithm can't. Yet these powerful solutions are ubiquitous
in computing.
To solve a truly recursive algorithm you think about what you have to do to solve "this" problem in terms of two or more smaller problems of the same type.
Take a simple tree for example. A tree is a trunk with two branches.
Each branch in turn is a trunk with two branches.
The base condition (the point where you end) is when the trunk is so small it can't support any branches.
Download Turtle4.fla to study how recursion can be used to draw a very rigid tree.
In this lecture trees are being drawn, but this kind of tree algorithm forms the backbone of a lot of computer science.
The power of recursion comes in when tree structures are parameterized.
Download Turtle5.fla and Turtle6.fla to study some enhancements to the algorithm in Turtle4.fla
The turtle drawings so far are deterministic. Specific values control the variability in the algorithms.
Stochastic or non-deterministic algorithms are based on "good guesses". In such algorithms variables are controlled by random numbers. Download Turtle7.fla to see some of the power of such randomization.
The question to ask is whether such randomization controls nature. (note how much more natural the random tree looks!). Einstein once said that God doesn't play dice. The question is whether the naturalness of this last tree is because of radomization or because of variability we still do not fully understand. What MAKES a branch grow in a particular direction? Wind, sun, shade, or the fact that a deer nibbled on the nub of the branch in the winter? Just some thoughts.
An algorithm is a PROCEDURE for doing a task. An algorithm includes variables that make the procedure general so it can be applied to many situations.
A recursive algorithm is one that uses the method within itself to solve a simpler problem.
A tail-end recursive algorithm is one that calls upon itself at the "tail end" of the algorithm.
A truly recursive algorithm is one in which the recursive call upon itself somewhere inside the method (other than just at the end.) A recursive algorithm may call upon itself more than once. Note that each subcall assumes a SIMPLER (or smaller) problem is being solved.)
| File | Contents |
| Turtle1.fla | Intro to the turtle, and simple examples of creating drawings |
| Turtle2.fla | Examples of using the turtle to create algorithms |
| Turtle3.fla | Example of a recursive algorithm |
| Turtle4.fla | A truly recursive algorithm |
| Turtle5.fla | A more abstract tree (with more parts parameterized) |
| Turtle6.fla | A tree with even more variability |
| Turtle7.fla | A tree that is controlled stochastically (one that uses random to determine the value of a variable) |
The actionscript dictionary as well as the tutorials provide details on the constructs presented here.
In particular study the tutorials on Movieclips, and controlling movie clips
The best way to understand algorithms is to play with them!
Understanding the ActionScript Language > About custom objects > Assigning methods to a custom object