TUTORIAL FOUR
ARTISTIC VARIABLES

The purpose of this program is to demonstrate how variables can be used to draw simple shapes on the screen. It also demonstrates how to draw a circle using nothing but dots.

Step 1 : Drawing basic shapes

Drawing simple shapes to the screen is very straight forward. Providing you know that an X coordinate measures the horizontal distance of the screen from left to right and that the Y coordinate measures the vertical distance of the screen from the top to the bottom, you should be able to understand what each of these do:

CLS
DOT 635,475
BOX 10,10,630,20
CIRCLE 320,240,100
ELLIPSE 320,240,100,200
LINE 120,240,520,240

Step 2 : A touch of color

If you run the program now, you will notice they are all the same color. White on black is the default color scheme, but you can change this to anything you wish. To draw in a particular color, you must set the ink color first. In order to set the ink color you need a special color value. As the color value is made up of red, green and blue components, it is very difficult to find the right value be guesswork alone. It is for this reason that the RGB command was created. This command takes a red, green and blue value separately and produces a single value that represents the desired color to set the ink with. The ink command itself requires two color values. The first is a foreground color that paints the shapes whereas the second is a background color that is used to clear the screen with. Place this line at the top of your code to see what happens:

INK RGB(255,100,0),RGB(0,0,255)

Step 3 : Using variables to draw

The idea of using variables to draw to the screen is a profound lesson to learn. It is the basis on which all advanced computer graphics are based. To draw a thing, move its position value and draw it again is the very essence of movement. To draw a thing, change the image value and draw it again is the very essence of animation. Prepare to type your first profound piece of code:

v=0
DO
LINE 0,v,v,480
v=v+1
LOOP

It may not seem profound now, but you will repeat this basic logic thousands of times. Learning its importance now will advance your learning considerably. Run the program to see what happens.

Step 4 : From a line to a circle

It's not just strange line patterns that can be created. Replace the code segment above with the following lines to see how variables can command even more control over what you draw:

v=0
cx=160
cy=120
DO
ox=cos(v)*100
oy=sin(v)*100
v=v+1
DOT cx+ox,cy+oy
LOOP

Final Step : Things for you to do

1. Change the program to alter the size of the dot circle
2. Change the program to alter the color of the dots within the circle
3. Change the program to move the center of dot circle as it's being drawn

You can skip to the next tutorial by selecting TUTORIAL FIVE.