Topics in Python GUI Development & Graphics

1. Topics in PythonGUI Development & Graphics Professor Frank J. Rinaldo Creation Core - office 401

2. Mad Lib Game • The Mad Lab program in a very simple ‘game’ that will generate some text, based on the user’s input • It make full use of the GUI capabilities we have discussed so far • Entry – one line of text for input • Check button – to select items • Radio button – to select 1 from several items • Text – to display multiple lines of output text

3. Mad Lab Program # Mad Lab from Tkinter import * class Application(Frame): “”” GUI appliaction to generate a story based on user input””” def __init__(self, master): Frame.__init__(self, master) self.grid() self.create_widgets()

4. Mad Lab Programcontinued def create_widgets(self): # Create instruction label Label(self, “Enter information for a new story”).grid(row = 0, column = 0, columnspan = 2, sticky = W) # Create a label & text entry for a name Label(self, “Person: “).grid(row = 1, column = 0, sticky = W) self.person_ent = Entry(self) self.person_ent.grid(row = 1, column = 1, sticky = W) # Create a label & text entry for a plural noun Label(self, “Plural Noun: “).grid(row = 2, column = 0, sticky = W) self.noun_ent = Entry(self) self.noun_ent.grid(row = 2, column = 1, sticky = W)

5. Mad Lab Programcontinued # Create a label & text entry for a verb Label(self, text = “Verb: “).grid(row = 3, column = 0, sticky = W) self.verb_ent = Entry(self) self.verb_ent.grid(row = 3, column = 1, sticky = W) # Create a label for adjectives check buttons Label(self, text = “Adjective(s): “).grid(row = 4, column = 0, sticky = W) # Create itchy check button self.is_itchy = BooleanVar() Label(self, text = “itchy”, variable = self.is_itchy).grid(row = 4, column = 1, sticky = W) # Create joyous check button self.is_joyous = BooleanVar() Label(self, text = “joyous”, variable = self.is_joyous).grid(row = 4, column = 2, sticky = W) # Create electric check button self.is_electric = BooleanVar() Label(self, text = “electric”, variable = self.is_electric).grid(row = 4, column = 3, sticky = W)

6. Mad Lab Programcontinued # Create label for body parts radio buttons Label(self, “Body Part: “).grid(row = 5, column = 0, sticly = W) # Create variable for single body part self.body_part = StringVar() # Create body part radio button body_parts = [“bellybutton”, “big toe”, “medulla oblongata”] column = 1 for part in body_parts: Radiobutton(self, text = part, variable = self.body_part, value = part). Grid(row = 5, column = column, sticky = W) column += 1 # Create a submit button Button(self, text = “Click for story”, comand = self.tell_story).grid(row = 6, column = 0, sticky = W) self.story_txt = Text(self, width = 74, heigth = 10, wrap = WORD) self.story_txt.grid(row = 7, column = 0, columnspan = 4)

7. Mad Lab Programcontinued def tell_story: # get values from GUI person = self.person_ent.get() noun = self.noun_ent.get() verb = self.verb_ent.get() adjectives = “” if self.is_itchy.get(): adjectives += “itchy, “ if self.is_joyous.get(): adjectives += “joyous, “ if self.is_electric.get(): adjectives += “electric, “ body_part = self.body_part.get()

8. Mad Lab Programcontinued story = “The famous explorer” story += person story += “ had nearly given up a life-long quest to find The Lost City of “ story += noun.title() story += “ when one day, the “ story += noun story += “ found “ story += person + “.” story += “A strong, “ story += adjectives story += “particular feeling overwhelmed the explorer. “ story += “After all this time, the quest was finally over. A tear came to “ story += person + “’s” story += body_part + “. “ story += “And then, the “ story += noun story += “ promptly devoured “ story += person + “. “ story += The moral of the story? Be careful what you “ story += verb story += “ for.”

9. Mad Lab Programcontinued # display the story self.story_txt.delete(0.0, END) self.story_txt.insert(0.0, story) # main root = Tk() root.title(“Mad Lib”) app = appliaction(root) root.mainloop()

10. Python Graphicspygame & livewires • pygame and livewires are a set of modules (called packages or libraries) that give programmers a wide range of multimedia classes • We will be able to create programs that have: • Graphics • Sound effects • Music • Animation • We will be able to accept input from the: • Keyboard • Mouse • We will be accessing livewires directly which uses pygame modules

11. New Graphics Window Program # New Graphics Window from livewires import games games.init(screen_width = 640, screen_height = 480, fps = 50) games.screen.mainloop()

12. Setting a Background Image # Background Image from livewires import games games.init(screen)width = 640, screen_height = 480, fps = 50) gall_image = games.load_image(“wall.jpg”, transparent = False) games.screen.background = wall_image games.screen.mainloop()

13. Graphics Coordinate System • In these examples we define our graphics window to be: • screen_width = 640 • screen_heigth = 480 • This means our graphics window is 640 pixels x 480 pixels • The top, left corner is location 0,0 • The bottom, right corner is 639,479 • NOTE: This is different from coordinate system in mathematics (for example) • NOTE: Remember in computer science we usually count from 0: • So the height coordinate runs from 0 to 639 • And the width coordinate runs from 0 to 479

14. Sprite • Sprites are movable graphics objects • They can be still images • They can be animations • In computer games, sprites are usually people, monsters, and any other movable object

15. Pizza Sprite Program # Pizza Sprite from livewires import games game.init(screen_width = 640, screen_heigth = 480, fps = 50) wall_image = games.load_image(“wall.jpg”, transparent = False) games.screen.background = wall_image pizza_image = games.load_image(“pizza.bmp) pizza = games.Sprite(image = pizza_image, x = 320, y = 240) games.screen.add(pizza) games.screen.mainloop()

16. Transparent mode • When we set up the background we set ‘transparent = False’ • When we set up the (pizza) sprite we did not use the ‘transparent’ option • By default, ‘transparent = True’ • When transparent is True this means you can see through an object! • For example: • If you sprite is a round doughnut with a hole in the middle • Then we expect to see ‘though’ the hole to see the background!

17. Using the ‘color’ module (library) # You Won from livewires import games, color games.init(screen_width = 640, screen_height = 480, fps = 50) wall_image = games.load_image(“wall.jpg”, transparent = False) games.screen.background = wall_image won_message = games.Message(value = “You Won!”, size = 100, color = color.red, x = games.screen.width/2, y = games.screen.height/2, lifetime = 250, after_death = games.screen.quit) games.screen.add(won_message) games.screen.mainloop()

18. Lifetime & After_death • Note that we set the variable ‘lifetime’ in the Message method • We set it to 250 (frames) • Remember, when we created our screen we set fps (frames per second) to 50 • So… 250 / 50 ~= 5 seconds • Therefore, the message will be displayed for (approximately) 5 seconds • Note that ‘after_death’ is the function (or method) to reference when the Message disappears!

19. Moving Sprites # Moving Pizza from livewires import games game.init(screen_width = 640, screen_heigth = 480, fps = 50) wall_image = games.load_image(“wall.jpg”, transparent = False) games.screen.background = wall_image pizza_image = games.load_image(“pizza.bmp) pizza = games.Sprite(image = pizza_image, x = games.screen.width/2, y = games.screen.height/2, dx = 1, dy = 1) games.screen.add(pizza) games.screen.mainloop()

20. Bouncing Pizza • When we run the moving pizza program the pizza ‘falls off’ the bottom of the screen • We can control the pizza (if we want) to keep it on the screen • One way to do this is to have the pizza ‘bounce’ off the sides (walls) of the graphics screen

21. Bouncing Pizza Program # Bouncing Pizza from livewires import games game.init(screen_width = 640, screen_heigth = 480, fps = 50) class Pizza(games.Sprite): “”” A Bouncing Pizza””” def update(self): if self.right > games.screen.width or self.left < 0: self.dx = -self.dx if self.bottom > games.screen.height or self.up < 0: self.dy = -self.dy def main(): wall_image = games.load_image(“wall.jpg”, transparent = False) games.screen.background = wall_image pizza_image = games.load_image(“pizza.bmp) pizza = games.Sprite(image = pizza_image, x = games.screen.width/2, y = games.screen.height/2, dx = 1, dy = 1) games.screen.add(pizza) games.screen.mainloop() # Main program Main()

22. The Game loop • Remember that there is a ‘game loop’ (‘games.screen.mainloop()’) that will automatically loop the program • Every time the graphics window is updated by the ‘mainloop()’ the following happens: • Each sprite’s position is updated by its dx & dy properties • Each sprite’s ‘update()’ method is called • We inserted code into the update method to make the pizza ‘bounce’ off the sides of the graphics window • This is how users (game players) ‘see’ animation fo characters!

23. Mouse Input • We will develop a simple sample game to allow us to get input from our mouse

24. Moving Pan Program # Moving Pan from livewires import games games.init(screen_width = 640, screen_height = 480, fps = 50) class Pan(games.Sprite): “”” A Pizza Pan controlled by the mouse “”” def update(self): self.x = games.mouse.x self.y = games.mouse.y def main(): wall_image = games.load_image(“wall.jpg”, transparent = False) games.screen.background = wall.image pan_image = games.load_image(“pan.bmp”) the_pan = Pan(image = pan_image, x = games.mouse.x, y = games.mouse.y) games.screen.add(the_pan) games.mouse.is_visible = False games.screen.event_grab = True games.screen.mainloop() # Main main()

25. Homework • Due week 13 • Write a Python Program: • See problem #1 on page 326 of textbook. • In other words, modify the Mad Lib program. Use DIFFERENT ‘adjective(s)’, use DIFFERENT ‘Body Part’, AND ADD a new RadioButton with some news words to add to the story!! • Include: • Simple Specification Document • Simple Pseudocode • Python code • Demonstrate program in class