As usual, create a directory to hold today's activities:
$ cd ~/cs170/labs $ mkdir lab2 $ cd lab2
Or, you can do it the slightly more efficient way:
$ mkdir ~/cs170/labs/lab2 $ cd ~/cs170/labs/lab2
Up to this point, every program you have written has executed in sequential order. It was very easy to trace through the code by hand, since you could always start with the first instruction and follow through to the next. However, sometimes this is not entirely desireable. There are occasions where non-sequential execution is useful.
Tkinter is designed so that events can occur, and allows you to define an event handler that decides what to do when the event happens. You will use this to create programs that allow for user interaction in today's lab.
Now that you know how to draw shapes in Tkinter, we can start performing animations in Tkinter as well. In Turtle, animations were easy because of the Turtle main loop. With the graphics module, we had to manage our own animation loop. In Tkinter, we must manage our own loop as well. To practice with this, let's make a simple bouncing ball program.
In a file called bouncing_ball.py, write a program that displays a ball that bounces around the screen. The ball should start in the upper left corner of the screen, and should move towards the bottom right section of the screen. The ball should not be able to leave the screen. If the ball is about to leave the screen, make the ball bounce away from the edge it was going to leave.
You will have to create a canvas, and pack that into your root window. All of the drawing methods belong to the canvas object, so you need a reference to that canvas in order to draw.
Remember that the create_oval method returns
a tag that can be used to refer to the object that is
drawn on the canvas. This means that instead of clearing the
entire canvas, you can just move the ball you have drawn using
the move method of the canvas.
You can use the coords method of the canvas to
get the position of an element on the canvas. Remember that
this returns 4 values, the upper-left x and y coordinates, as
well as the lower-right x and y coordinates.
Your ball will basically be invisible unless you slow down
the animation speed. in the Graphics module, we set the
framerate to determine this. You will have to perform this
step manually. You can use the sleep function
of the time module to slow down the loop, and thus slow down
the animation.
My guess is that you used straight line movements for the bouncing ball program. This works for something like a pong game, but isn't very interesting. Change the movement of the ball so that it is non-linear.
Back to the old classics. You can now draw to the Tk canvas. Today we start manipulating the objects we have drawn. We performed animation on Wednesday by using a loop. However, we also would like to interact with the program. Use the event based programming constructs to allow users to control two rectangles on the screen.
Create a program in a file called pong.py that allows two different players to control two different pong paddles. Each pong paddle will be represented by a single rectangle on either side of the window.
One of the players should control their paddle with the mouse, while the other will be controlled by the keyboard. The mouse player should change the y location of the paddle by moving the mouse when the left mouse button is , while the keyboard player should use the up and down arrow keys to change the position of the paddle.
You need to create two rectangles, one for each paddle.
Since the create_rectangle method returns an ID
that can be used to later change the drawn rectangle, you
will need to keep track of this separately for each paddle.
You will need to bind both
the <B1-Motion> and
the <Key> events, and you will need one
event handler for each of them.
The event object for the mouse will have x and y as attributes, which is the current coordinates of the mouse in the canvas. The event object for the keyboard will have a keysym attribute, which will describe which key was pressed.
The keyboard controlled player can change the paddle using
the move method. However, because the mouse
gives you a new position you need to use
the coords method to update the mouse
controlled paddle.
Using rectangles is fine, but kind of a bit boring. A "real" pong game wouldn't use a simple rectangle for the paddle. Instead, it would use an image for the paddles!
Search on Google, or use GIMP to create your own paddle images. Then look at the documentation for the Tk Canvas Object, as well as the PhotoImage documentation. Load your images instead of using the rectangles. Can you make the paddle images you are using the same size as the rectangles, without manipulating the image manually?
When you have finished, create a tar file of your lab2
directory. To create a tar file, execute the following commands:
cd ~/cs170/labs tar czvf lab2.tgz lab2/
To submit your activity, go to inquire.roanoke.edu. You should
see an available assignment called Lab Assignment 2.
Make sure you include a header listing the authors of the file.