1. Let’s make a shape…. Move!
Using Tkinter to create action

2. Create a polygon… triangle
Just like we did earlier, we will use the Tkinter graphics module to make a shape.
import time
from tkinter import *
tk = Tk( )
canvas = Canvas(tk, width=400, height=400)
canvas.pack( )
canvas.create_polygon(10, 10, 10, 60, 50, 35)
*Now that we have our canvas and our polygon (triangle), we will use a for statement to make it move. Can you imagine how we might do this?
After importing the time and Tkinter (graphics) module, we create the canvas (background).
Drawing the polygon (triangle) is made simple, all we have to do is list the x and y coordinates for each point. The parameters of the create_polygon function are pairs of coordinates. So (10, 10, 10, 60, 50, 35) means one point at location 10,10 second point at location 10,60 and third point at location 50,35.
We are now going to use a for statement to make it move. If you thought it might work making the triangle (object) move FOR a number of times, you are correct! 

3. For Statement for x in range(0, 60):
Include all you just programmed, and add the following just below. It is a for statement  don’t forget indentation.
for x in range(0, 60):
canvas.move(1, 5, 5)
tk.update( )
time.sleep(0.05)
We have a for statement, and from the first line, we know it will repeat 60 times.
The second line, canvas.move(1,5,5) is a little different from what we have encountered before. The polygon (triangle) we just created is an object. Since it is the ONLY object we have created so far, it gets an object ID number of 1. That is what the 1 means in this line. The 5s are the x and y coordinates. The whole line states something like this: move object 1 (the triangle) 5 pixels to the right and down 5 pixels.
* If you were confused on why the y coordinate would move down… then congratulations! That means you were paying attention  The only thing different from graphics coordinates in computer programming, is the plane is sort of flipped. On a Cartesian plane, the coordinate 0,0 would be the bottom left (think back to basic algebra / geometry). In CS, the coordinate 0,0 would be the top left… so it is ‘looking’ downward. If you get the wrong direction when programming, just add a negative sign and that should solve your problem.
The tk.update ( ) line just tells the program to update what has happened… so in a For loop, the triangle will move to the right and down 5 pixels, then update the screen. Finally, the program sleeps for 5/100ths of a second. If the program did not pause, the triangle would move so fast you wouldn’t see it happen. That is why the time.sleep function is important.

4. What a great event!
Now that we can make the triangle move, we can use an event binding to make it move based on which key we press.
Most games we play use directional keys to move the player (think  object) in a 2D plane.
Events are things that happen when your program is running. (move a mouse, press a key, close a window)
Just like when we have to wait for an event (like going to a wedding or a concert), then when we are at the event, we react appropriately (cheer or ‘rock out’), the program is waiting for an event when we tell it to, then it will react as we tell it to.

5. Moving triangle def movetriangle(event): canvas.move(1,5,0)
We are creating a function called movetriangle. The function takes one parameter called event. We are now going to tell Tkinter that we want this function to wait for a specific event… full code on next slide

6. Just press play
from tkinter import * tk = Tk() canvas = Canvas(tk, width = 400, height = 400) canvas.pack() canvas.create_polygon(10, 10, 10, 60, 50, 35) def movetriangle(event): canvas.move(1,5,0) canvas.bind_all(‘<KeyPress-Return>’, movetriangle)
Take a look at this so far… We know what the first part of the code does: importing the Tkinter module, creating a shortcut tk, so we don’t have to type “tk.create_polygon…” and “tk.” in front of everything like we did with turtle graphics (“turtle.penup())… etc. Then the code creates a 400 x 400 canvas, asks to make the canvas appear
What is new is this: The code in line 5 creates our triangle (polygon) with the x and y paired coordinates for all three points (10, 10) (10, 60) and (50, 35).
After this, we create a new function called movetriangle (gee…. I wonder what it will do ;) This function will wait for an event. When that event happens, the triangle (1) [ the object ID number] will move 5 pixels to the right and will not move vertically (0).
Finally, we are binding (fixing, attaching, tying to, etc…) the event as the Enter button (the return key) * Return [aka ‘enter’] was named because it was the ‘carriage return’ on the typewriter. Just in case it ever comes up in a trivia night sometime. If so, you can say “Thank you Mr. Hastings!”.. or not. It’s like whatever, man. 

7. Where are my keys? def movetriangle(event): if event.keysym == ‘Up’:
Add this to our def move triangle code…
def movetriangle(event):
if event.keysym == ‘Up’:
canvas.move(1, 0, -3)
elif event.keysym == ‘Down’:
canvas.move(1, 0, 3)
elif event.keysym == ‘Left’:
canvas.move(1, -3, 0)
else:
canvas.move(1, 3, 0)
canvas.bind_all(‘<KeyPress-Up>’, movetriangle)
canvas.bind_all(‘<KeyPress-Down>’, movetriangle)
canvas.bind_all(‘<KeyPress-Left>’, movetriangle)
canvas.bind_all(‘<KeyPress-Right>’, movetriangle)
Adding to what we have learned so far, we know that binding the event <KeyPress- *Up/Down…etc> and passing the movetriangle function as a parameter, we can now move our polygon (triangle) the stated pixels when we press that key. Hooray! Now how could you modify this to make it your own?

8. What next?
What could you do to customize this program? What parameters could you change? Could you add anything we did previously to your functions and events? Play around with it, you won’t break anything!

9. Let’s move a picture
import time from tkinter import * tk = Tk() canvas = Canvas(tk, width=400, height=400) canvas.pack() myimage = PhotoImage(file='c:\\face.gif') canvas.create_image(0, 0, anchor=NW, image=myimage) for x in range(0, 35): canvas.move(1, 10, 10) tk.update() time.sleep(0.05)
After importing the time and Tkinter (graphics) module, we create the canvas (background).
Drawing the polygon (triangle) is made simple, all we have to do is list the x and y coordinates for each point. The parameters of the create_polygon function are pairs of coordinates. So (10, 10, 10, 60, 50, 35) means one point at location 10,10 second point at location 10,60 and third point at location 50,35.
We are now going to use a for statement to make it move. If you thought it might work making the triangle (object) move FOR a number of times, you are correct! 