Background
jLogo Programming
- Commanding a Turtle
- Pseudocode
- Adding New Commands
- Iteration and Animation
- Hierarchical Structure
- Procedure Inputs
- Operators & Expressions
- Defining Operators
- Words & Sentences
- User Interface Events
- What If? (Predicates)
- Recursion
- Local Variables
- Global Variables
- Word/Sentence Iteration
- Mastermind Project
- Turtles As Actors
- Arrays
- File Input/Output
- AI: Pitcher Problem Solver
Java
- A Java Program
- What's a Class?
- Extending Existing Classes
- Types
- Turtle Graphics
- Control Flow
- User Interface Events
Appendices
- Jargon
- What Is TG?
- TG Directives
- jLogo Primitives
- TG Editor
- Java Tables
- Example Programs
- *** New ***:
Installation Notes
Updates
- December 13, 2008
- March 7, 2009
- January 6, 2012
- March 15, 2013
- January 20, 2014
- February 13, 2014
- July 29, 2014
- January 18, 2016
- January 29, 2016
- August 19, 2016
Lastly
Commanding a Turtle
Introduction
In this lesson, you will write your first computer programs using Logo. After an introduction to the turtle and its environment, you will learn a few commands that the turtle understands. Then it's up to you to instruct the turtle to draw a bunch of stuff.
An Overview of Logo and Turtle Graphics
Logo and "turtle graphics" go back quite a long time (1967). They come from BBN and MIT's Artificial Intelligence Laboratory and the team of Danny Bobrow, Wally Feurzeig, Seymour Papert, and Cynthia Solomon. Let's read Seymour's own description of it:
... "the turtle." You can think of this as a drawing instrument... Imagine that you are looking at a computer screen. On it you see a small turtle, which moves when you type commands in a language called "turtle talk," leaving a line as it goes. The command "Forward 50" causes the turtle to move straight ahead a certain distance. "Forward 100" will make it move in the same direction twice as far. You soon get the idea that the numbers represent the distance it moves; they can be thought of as turtle steps. Now if you want to make it go in a different direction, you give it a command like "Right 90." It stays in the same place but turns on itself, facing east if it had previously been facing north. With this knowledge you should easily be able to make it draw a box. If that's easy for you, you can think about how to draw a circle, and if that's easy you can try a spiral. Somewhere you will meet your level of difficulty, and when you do I'll give you this piece of advice: Put yourself in the place of the turtle. Imagine yourself moving in the outline of a box or a circle or a spiral or whatever it may be.
Figure 2.1 shows the original turtle from "Mindstorms," Seymour Papert, Basic Books, Inc., 1980.
Wikipedia has a great entry for Logo.
jLogo is a version of Logo that is written in the Java programming language. It is sort-of a subset of Berkeley Logo extended to have some traits of Java. Java is just not a good language to start out with. By starting out with jLogo, you will get a good feel for what programming is all about. With this experience, transitioning to Java will not be too hard if this is what you want.
The Graphics Canvas - TurtleSpace
You are going to be learning how to write computer programs which draw things on a digital canvas. This makes a lot of sense because most things that you interact with that contain a computer have a display of some sort or another. Think about it; desktop and notebook computers have flat-panel displays, mobile phones have small displays, tablets - check, new cars have a couple, and now even the Nest Thermostat has a little display... They are everywhere around you.
You are going to be instructing an object, a turtle, to move around on a virtual canvas, drawing as it goes. TG, the program you will use, has an area (a subwindow) called the graphics canvas. Think of it as a two-dimensional world in which the turtle lives.
Here's what the turtle's world looks like. The turtle starts out at the coordinates: 0,0 (the center of its world), heading North. The turtle's world is a bit different from the Cartesian coordinate system that you may be familiar with (from your math classes).
If you look closely, you'll notice that the origin for angle measurement is different. In turtle graphics, 0 degrees is aligned with the positive Y axis instead of the positive X axis. The other difference is that angle measurement in positive amounts measure clockwise rotation, the opposite direction that you've learned in math classes.
Four Basic Commands
Table 2.1 shows a few Logo commands.
Command | Inputs | Description | Example |
---|---|---|---|
FD FORWARD |
number | Moves the turtle forward, in the direction it is facing, by the specified number of turtle steps. One turtle step is equal to one pixel. | FD 100 |
BK BACK |
number | Moves the turtle backward, i.e., exactly opposite to the direction that it's facing, by the specified number of turtle steps. One turtle step is equal to one pixel. | BACK 150 |
LT LEFT |
number | Turns the turtle counterclockwise by the specified angle measured by a number of degrees (1/360 of a circle). | LEFT 180 |
RT RIGHT |
number | Turns the turtle clockwise by the specified angle, measured in degrees (1/360 of a circle). | RT 90 |
|
Notice that these commands must include a number, an input. As an example, when you type in a forward command, you must specify some number of turtle steps. This makes sense; if you didn't specify a distance, how would the turtle know when to stop? If you forget to provide the number, you will be reminded, e.g., typing
forward |
followed by the Enter key will result in a little pop-up box that contains:
Make sure to separate the command name and the input with at least one space. Here's what you will see if you type
right90 |
followed by the Enter key.
Ok, enough of an introduction; it is time for you to try stuff out for yourself.
I've written a computer program that has been embedded in these web pages (it's a Java applet) which understands the Logo language. I've named it TG, an acronym for Turtle Graphics.
If TG is behaving as it should, you will see two white areas divided horizontally by a gray namestripe with "CommandCenter" and "t1" in it. This namestripe can be dragged up and down by positioning the mouse on it, holding the left button down, and moving the mouse up/down. Move the namestripe if necessary so that there is approximately equal space above and below it.
The turtle (the hexagon with head, legs and a tail) is in the middle of the graphics canvas. It is heading north. It has its black pen down, ready to draw a line as it moves. Click the left mouse button in the CommandCenter - an interaction area below the graphics canvas. The namestripe will turn black and a cursor (small, thick, black vertical bar) to the right of a "? " prompt will start to blink indicating it is ready for you to type in instructions.
TG Programming Environment Applet
To get started, try typing the following instructions which will draw a box:
forward 100 right 90 forward 100 right 90 fd 100 rt 90 fd 100 rt 90 |
Exploration: Additional Commands
Table 2.2 shows a few more Logo commands.
Command | Inputs | Description | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
HOME | Moves the turtle to the center of the graphics canvas, i.e., coordinates 0,0. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
PENUP PU |
Lifts the turtle's pen up so that it leaves no trace when the turtle moves. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
PENDOWN PD |
Puts the turtle's pen down so that it leaves a trace when the turtle moves. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
CG CLEAN |
Erases (cleans) everything that the turtle has drawn on the graphics area (ClearGraphics). The turtle's state (position, heading, pen color, etc.) is not changed. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
PLAYCLIP | clipNumber |
A WAV (waveform) audio clip is played.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
SETBACKGROUND SETBG |
number |
Sets the color of the background of the graphics canvas. Color is
expressed as a number.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
SETC SETPC SETPENCOLOR |
number | Sets the turtle's pen color. Color is expressed as a number as with SETBACKGROUND. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
SETPENSIZE SETPS |
number | Sets the width of the turtle's pen, which determines the thickness (in pixels) of the trace it leaves, the line it draws. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
SETSHAPE SETSH |
number |
Sets the turtle's image to a specified shape. Shape is expressed as
a number. The built-in shapes are:
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
HT HIDETURTLE |
Hides the turtle, makes it invisible. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
ST SHOWTURTLE |
Makes the turtle visible. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Play around with all these commands. You've seen how easy it is to draw a box; draw some additional boxes that are different colors, that are drawn with different sized pens. Explore...
Practice: Draw Some Figures
Instruct the turtle to draw a triangle, a square, a pentagon, a hexagon, ... Again, vary the colors, use different sized pens, and place them at different places in TurtleSpace.
Help at Your Fingertips
In addition to giving the turtle commands, the CommandCenter can be used to get help when you need it. Type "help setpencolor" in the CommandCenter and press Enter. Figure 2.4 shows what happens.
For more information about what you can get help with, type help and press Enter. Figure 2.5 shows what happens.
Explore what you can do with the help command. help tg will get you an overview of the TG programming environment. All of the commands that were covered in this lesson are from the GrafCmd category. You will get the full listing of commands that fall into this category by typing help grafcmd and pressing Enter.
Running TG as an Application
The nice feature of Java applets is that they are part of web pages. Once you have the browser on the page containing the applet, you have access to the applet. But, an important security feature of a Java applet is that it can't do anything to the computer on which it's running. To insure this, applets have no access to stuff on the computer they are executed on.
But, as our programs get bigger and more complicated, it is necessary for TG (the turtle graphics program) to be able to read a file containing commands and execute them as it reads the file. You need to be able to change the instructions and/or add instructions to the program, and then save what you've done to a file.
Java applications can provide this functionality.
The TG programming environment you have been using on this web page can also run on your computer as an application. It does everything that the applet does and more. But, for you to run it on your computer, you need to have a copy of it (TG.jar). Appendix H (Installation of TG) covers how to get it and run it.
Summary
Writing software, computer programs, is a lot like writing down the steps to do something.
You've learned some of the the jLogo language. If you got the turtle to draw a triangle, a box, etc..., for you, you got experience instructing it to do things in a specific order. And, the order is very important. In programming we refer to this order of steps as a sequence. In our programs, we moved the turtle and then turned it, moved it, then turned it, told it to raise its pen, moved it,... If you put all of the movement commands first followed by all the turn commands, you would not get what you want - you would get a straight line. So, writing a program is all about putting together instructions in a specific order.
Exercises
-
Go back to the TG applet, get the turtle to the HOME location and type:
loadpicture "maze
into the CommandCenter. This will paint an image of a maze onto the background of TG's graphics canvas. Your challenge... use commands you've learned in this lesson to get the turtle to draw a path out of the maze. Figure 2.6 shows me starting to work the turtle out.
Figure 2.6 -
Draw a collection of boxes that looks like the one in Figure 2.7.
Figure 2.7 -
Draw a pair of axes that look like the ones in Figure 2.8.
Figure 2.8 -
Draw a small grid that looks like Figure 2.9.
Figure 2.9
Go to the Table of Contents
On to the Pseudocode