Advantage – Immediate Feedback
As the student repeatedly presses the Debug Control’s “Over” button, she will be able to see the Turtle execute the commands she has given it.
Content
- Summary
- Video Link
- Technique Steps
- Code
Summary
This post will demonstrate a technique for teaching kids (or anyone) coding, using Turtle Graphics, Python, Python IDLE, Python IDLE’s Debug Control and Statement Execution Stepping.
This technique should work for Windows, Mac, and Linux (e.g. Raspberry Pi).
Video Link
Here is a link to a YouTube Video for this post.
Technique Steps
- Open your File Manager
- “File Explorer” in Windows
- “Finder” in Mac
- “File Manager” in Raspberry Pi
- Navigate to the folder [CodeFolderPath] in which you have your code to be used. Most File Managers let you copy the path to a command line.
- Open a Command Line Window
- “Command Prompt” in Windows
- “Terminal” in Mac and Raspberry Pi
- At the Command Line, change directory to [CodeFolderPath], whatever that is.
- example:
- $ cd ~/pythonPjs/MasonPjs
- At the Command Line, run IDLE.
- $ idle
- This will bring up the IDLE Shell Window.
- In the IDLE Shell Window’s menu bar, click File Open and open the appropriate code file.
- This will bring up the IDLE Code Window.
- In the IDLE Shell Window’s menu bar, click Debug/Debugger.
- This will bring up the IDLE Debug Control Window.
- In the Debug Control Window:
- UnTick the Stack Checkbox.
- Tick the Source Checkbox.
- Minimize the IDLE Shell, File Manager and Command Line Windows. We want the student to focus on the important windows.
- IDLE Debug Control
- IDLE Code
- Turtle Graphics
- Position the Debug Control & IDLE Code windows so you’ll be able to see them AND the Turtle Graphics Window SIMULTANEOUSLY. I plan on Turtle Graphics Window to be on the RIGHT of the screen. So I put:
- Debug Contol – Top Left of the screen.
- IDLE Code – Bottom Left of the screen. I make it about the same WIDTH as the Debug Control Window.
- In the IDLE Code window click on File/Run/Run Module
- RESIZE it to be above the IDLE Code Window.
- ALSO Minimize the IDLE Shell Window that (annoyingly 🙂 ) popped up again.
- Click on Debug Control Window’s “Over” button until the Turtle Graphics window appears. NOTICE with each click of “Over”.
- NOTICE with each click, A NEW LINE in the Code Window is highlighted.
- NOTICE when
forward()
orleft()
commands are executed, the Turtle Graphics Window responds with the appropriate action. - NOTICE after the line
A1pos = pos(); A2abs_pos = abs(pos())
has been executed, the Debug Control Window contains 2 lines under the “Locals” - A1pos – (200.00,0.00) or something like this value
- A2abs_pos – 200.00 or something like this value
- Keeping track of the current values of these items.
- NOTICE that after we execute the
if abs(pos()) < 1:
statement, we loop back to just under thewhile True:
statement.
- Click on "Over" for about 30 more times. NOTICE the Turtle Graphics window cooking along, OBEYING the commands in the Code Window. 🙂
- Right Click on the
break
Line & select "Set Breakpoint".- NOTICE the yellow background.
- In the Debug Control Window Click on the "Go" button. This will run until just before we execute the breakpoint line.
- WATCH the Trutle Graphics window do its thing.
- Click "Over".
- NOTICE we exit the
while True:
loop.
- NOTICE we exit the
- Click "Over".
- NOTICE the
end_fill()
statement colors the star yellow.
- NOTICE the
- Click "Over" one last time.
- NOTICE we are DONE. 🙂
Code
Here is the code we used in the video.
from turtle import * setup (width=500, height=500, startx=500) color('red', 'yellow') begin_fill() while True: forward(200) left(170) A1pos = pos(); A2abs_pos = abs(pos()) if abs(pos()) < 1: break end_fill() done()