Difference between revisions of "CSC111 Lab 12 2014"
(→Adding a Call-Back Function) |
(→Adding a Call-Back Function) |
||
Line 135: | Line 135: | ||
* Make your program generate a colored circle where ever the user clicks the mouse. | * Make your program generate a colored circle where ever the user clicks the mouse. | ||
* Make the program generate red circles on the left side of the canvas, and green circles on the right side of the canvas. | * Make the program generate red circles on the left side of the canvas, and green circles on the right side of the canvas. | ||
+ | <br /> | ||
+ | <br /> | ||
+ | <br /> | ||
+ | <br /> | ||
+ | <br /> | ||
+ | =Activating the Menu= | ||
+ | <br /> | ||
+ | Using the '''menu''' is now fairly easy. All we have to do is call its main method called '''buttonClicked( x, y )''' which returns the name of the symbol clicked if the user pressed one, or '''None''' if the mouse was not clicked on the menu. | ||
+ | <br /> | ||
+ | ::<source lang="python" highlight="2,16"> | ||
+ | def mouseEvent( win, canvas, x, y ): | ||
+ | global menu | ||
+ | button = menu.buttonClicked( x, y ) | ||
+ | |||
+ | if button == "LeftArrow": | ||
+ | print( "left-arrow clicked!" ) | ||
+ | return | ||
+ | if button == "RightArrow": | ||
+ | print( "right-arrow clicked!" ) | ||
+ | return | ||
+ | if button == "Minus": | ||
+ | print( "minus clicked!" ) | ||
+ | return | ||
+ | if button == "Plus": | ||
+ | print( "plus clicked!" ) | ||
+ | return | ||
+ | |||
+ | </source> |
Revision as of 19:19, 21 April 2014
--D. Thiebaut (talk) 18:47, 21 April 2014 (EDT)
Contents
Building a car using the Graphics111 library
- Get a copy of the graphics111.py library
- Save it in your main directory (where you keep you python programs) and save it as graphics111.py
- Create a car using the new classes now available in the graphics111 library. Call it lab12.py.
from graphics111 import * MAXWIDTH = 600 MAXHEIGHT = 400 class Car: def __init__(self, x, y, w, h, color ): self._body = Rectangle( x, y, w, h, color ) self._w1 = Wheel( x+w//4, y+h, w//4 ) self._w2 = Wheel( x+3*w//4, y+h, w//4 ) def draw( self, canvas ): self._body.draw( canvas ) self._w1.draw( canvas ) self._w2.draw( canvas ) def main(): win = GraphicsWindow(MAXWIDTH, MAXHEIGHT) canvas = win.canvas() p1 = Car( 100, 100, 50, 20, (250, 250, 0) ) p1.draw( canvas ) win.wait() win.close() main()
- Notice how short the program is now that the classes for the wheels and rectangles are in the graphics111 library!
Adding A Menu
- Add a menu at the top left of the window. Don't try to activate it, it won't respond yet...
from graphics111 import * MAXWIDTH = 600 MAXHEIGHT = 400 class Car: def __init__(self, x, y, w, h, color ): self._body = Rectangle( x, y, w, h, color ) self._w1 = Wheel( x+w//4, y+h, w//4 ) self._w2 = Wheel( x+3*w//4, y+h, w//4 ) def draw( self, canvas ): self._body.draw( canvas ) self._w1.draw( canvas ) self._w2.draw( canvas ) def main(): win = GraphicsWindow(MAXWIDTH, MAXHEIGHT) canvas = win.canvas() menu = Menu() menu.draw( canvas ) p1 = Car( 100, 100, 50, 20, (250, 250, 0) ) p1.draw( canvas ) win.wait() win.close() main()
A Bit of Hacking
- Figure out where the menu is located in the graphics111.py program, and change its color to red. All the symbols should show up in red when your modification is over.
Adding a Call-Back Function
- Modify your program and add a call-back function as shown below.
- Run it and click the mouse on the window, several times. Make sure you check the output in the console.
from graphics111 import * MAXWIDTH = 600 MAXHEIGHT = 400 class Car: def __init__(self, x, y, w, h, color ): self._body = Rectangle( x, y, w, h, color ) self._w1 = Wheel( x+w//4, y+h, w//4 ) self._w2 = Wheel( x+3*w//4, y+h, w//4 ) def draw( self, canvas ): self._body.draw( canvas ) self._w1.draw( canvas ) self._w2.draw( canvas ) def mouseEvent( win, canvas, x, y ): print( "Caught an event. Received x=%d, y=%d" % (x,y) ) def main(): global menu win = GraphicsWindow(MAXWIDTH, MAXHEIGHT) canvas = win.canvas() canvas.setCallbackFunction( mouseEvent ) menu = Menu() menu.draw( canvas ) p1 = Car( 100, 100, 50, 20, (250, 250, 0) ) p1.draw( canvas ) win.wait() win.close() main()
Challenge 1: Circles on Mouse-Clicks |
- Make your program generate a colored circle where ever the user clicks the mouse.
- Make the program generate red circles on the left side of the canvas, and green circles on the right side of the canvas.
Activating the Menu
Using the menu is now fairly easy. All we have to do is call its main method called buttonClicked( x, y ) which returns the name of the symbol clicked if the user pressed one, or None if the mouse was not clicked on the menu.
def mouseEvent( win, canvas, x, y ): global menu button = menu.buttonClicked( x, y ) if button == "LeftArrow": print( "left-arrow clicked!" ) return if button == "RightArrow": print( "right-arrow clicked!" ) return if button == "Minus": print( "minus clicked!" ) return if button == "Plus": print( "plus clicked!" ) return