Interaction with Graphics

1. Interaction with Graphics Also displaying GIFs

2. Text Output on the graphics window • There is a class called Text which will put the message on the graphics window msg = Text(Point(10, 200), “Hello”) msg.draw(win) • Will put the word Hello on the graphics window, centered horizontally at the given point. • You can use setSize to change the font size, setStyle to change to “bold” or “italic”, and setFace to change the font. • You can use setText to change the message displayed. • The 2nd argument to Text must be a String and ONE string!! If you want to output numbers you will have to use typecasting and concatenation

3. Interaction also implies input! • How does the program get input from the user using the graphics window? • Using getMouse to let the user indicate a location on the window • Using a text Entry to let the user enter text from the keyboard

4. getMouse() • getMouse is a method associated with the GraphWin class, so you call it using a window object, like win. • win.getMouse() • It does return a value, specifically a Point object, indicating where the user clicked • The use we have had for getMouse, to act as a pause at the end of the program, ignores this return value. • If you want to save the point for later use, you would store it in a variable • User_point = win.getMouse()

5. Using getMouse() • msg = Text(Point(50, 50),”click a point”) • msg.draw(win) • userPt = win.getMouse() • circ = Circle (userPt, 25) • circ.draw(win) • This will draw a small circle around the point the user clicked. Note that the constructor Point does not have to be called when the argument is already a point! Do not write “circ = Circle(Point(userPt),25)”

6. How to do text Input from the graphics window • You should prompt the user on the graphics window just as you did on the Shell screen when not doing graphics. This needs a Text object • Then create an Entry object (which allows the user to type in a box) • Arguments: Point for box to center on, integer size of box • Put some text into the Entry object (using setText) • Use a getMouse to pause until the user clicks (after they type) • Use getText to get the user input from the Entry object (will be string) • Then process the string input as desired

7. Using text Entry prompt = Text (Point(150, 200), “Enter a number”) prompt.draw(win) user_input = Entry(Point(150, 150), 5) # box big enough for 5 chars user_input.setText(“ “) # 5 spaces, could also be a default value user_input.draw(win) win.getMouse() # must be there! Or getText will not work number = float(user_input.getText())

8. How to display a GIF on the graphics window • Uses the Image class • pic = Image(Point(100, 100), “cat.gif”) • Assumes there is a file called cat.gif in the same folder as the source file • pic will be an image object which can be drawn on the graphics window centered at the point give • pic .draw(win) • Many other methods exist to manipulate the image pixel by pixel • getPixel, setPixel, save • HINT: you have to save your source code (.py) before these methods will work. The interpreter has to have somewhere to look for the gif file