Programmeren met Grafische Objecten Inleiding Programmeren II Hoorcollege 1 prof. dr. van Noord en dr. L.M. Bosveld-de Smet

Onderwerpen van vandaag Programming Paradigms Imperatief programmeren Object-georiënteerd programmeren Grafisch objecten in Python grafische module: graphics.py instantievariabelen en methoden Coördinaten ‘Event-driven Programming’ 09-11-2015 2

09-11-2015 3

09-11-2015 4

Interfaces Command-line versus Graphical User Interface Tekst-gebaseerd versus Graphics-gebaseerd 09-11-2015 5

Grafische Objecten 09-11-2015 6

Grafische Objecten window 09-11-2015 7

Grafische Objecten window combobox 09-11-2015 8

Grafische Objecten window combobox text entry 09-11-2015 9

Grafische Objecten window combobox text entry button 09-11-2015 10

Datatypes en operaties Numbers: optellen Strings en Lists: concatenatie Lists: append(<object>) 09-11-2015 11

Datatypes en operaties >>> sum = 16734 + 34098 >>> sum 50832 >>> composite = "student" + "en" + "vereniging" >>> composite 'studentenvereniging' >>> word_list = ["aap","noot"] + ["mies","zus"] + ["jet"] >>> word_list ['aap', 'noot', 'mies', 'zus', 'jet'] >>> word_list.append("wim") ['aap', 'noot', 'mies', 'zus', 'jet', 'wim'] 09-11-2015 12

Programmeerparadigma’s 09-11-2015 13

Nieuw datatype en nieuw programmeerparadigma Grafische objecten Object-georiënteerd programmeren Objecten zijn actief Objecten worden verzocht om operaties op zichzelf uit te voeren 09-11-2015 14

Objecten in het algemeen Zelle (p 81): “Objects know stuff (they contain data) and objects can do stuff (they have operations)” 09-11-2015 15

Programmeren met grafische objecten vereist een grafische bibliotheek Pythonbibliotheken: Tkinter: standaard PyQt: geavanceerd Zelle’s eigen graphics.py: simpel 09-11-2015 16

win = graphics.GraphWin("My first window") win.close() import graphics win = graphics.GraphWin("My first window") win.close() 09-11-2015 17

win = GraphWin("My first window") win.close() from graphics import * win = GraphWin("My first window") win.close() 09-11-2015 18

win = GraphWin("Geometric Shapes", 200, 200) center = Point(100, 100) circ = Circle(center, 60) rect = Rectangle(Point(60, 60), Point(140, 140)) line = Line(Point(30, 30), Point(170, 170)) <object name> = <class name>(<instance parameters>) 09-11-2015 19

win = GraphWin("Geometric Shapes", 200, 200) center = Point(100, 100) circ = Circle(center, 60) circ.setFill('yellow') circ.draw(win) rect = Rectangle(Point(60, 60), Point(140, 140)) rect.setFill('blue') rect.draw(win) line = Line(Point(30, 30), Point(170, 170)) line.setArrow('first') line.draw(win) win.close() <object name>.<method name>(<method parameters>) 09-11-2015 20

win = GraphWin("Geometric Shapes", 200, 200) center = Point(100, 100) circ = Circle(center, 60) circ.setFill('yellow') circ.draw(win) rect = Rectangle(Point(60, 60), Point(140, 140)) rect.setFill('blue') rect.draw(win) line = Line(Point(30, 30), Point(170, 170)) line.setArrow('first') line.draw(win) win.close() 09-11-2015 21

09-11-2015 22

Objecten en klassen Object = informal def. active data type that knows stuff and can do stuff (Zelle, p. 297) Object = formal def. A collection of related information A set of operations to manipulate that information Object attributes = Instance variables: relevant information stored inside the object Methods: functions that “live” inside the object Elk object is een instantie van een of andere klasse. 09-11-2015 23

dog object 09-11-2015 24

dog class  dog object 09-11-2015 25

teacher class  teacher object 09-11-2015 26

GrahpWin objects 09-11-2015 27

09-11-2015 28

click.py win = GraphWin(" Click me!") for i in range (10): p = win.getMouse() p.draw(win) print("Your click {0} was at ({1}, {2})." .format(i+1, p.getX(), p.getY())) win.getMouse() win.close 09-11-2015 29

Your click 1 was at (17, 15). Your click 2 was at (32, 32). 09-11-2015 30

Maak je eigen coördinatenstelsel met methode van GraphWin: setCoords(xll, yll, xur, yur) 09-11-2015 31

tictactoe.py # create a default sized window with title Tic-Tac-Toe win = GraphWin("Tic-Tac-Toe") # set coordinates that go from (0,0) in lower left corner # to (3,3) in upper right corner of window win.setCoords(0.0, 0.0, 3.0, 3.0) # draw vertical lines Line(Point(1, 0), Point(1, 3)).draw(win) Line(Point(2, 0), Point(2, 3)).draw(win) # draw horizontal lines Line(Point(0, 1), Point(3, 1)).draw(win) Line(Point(0, 2), Point(3, 2)).draw(win) # on mouse click close window win.getMouse() win.close() 09-11-2015 32

09-11-2015 33

Event-driven Programming Steve Ferg (2006) 09-11-2015 34

Event loop algorithm (Ferg, 2006) 09-11-2015 35

graphics.py staat slechts afhandeling toe van: mouse clicks text entry 09-11-2015 36

09-11-2015 37

shapes.py def within_rectangle(point, rect): x1 = rect.getP1().getX() y1 = rect.getP1().getY() x2 = rect.getP2().getX() y2 = rect.getP2().getY() if (x1 > x2) : (x1,x2) = (x2,x1) if (y1 > y2) : (y1,y2) = (y2,y1) return( (x1 < point.getX() < x2) and (y1 < point.getY() < y2)) 09-11-2015 38

shapes.py def main(): ... click = win.getMouse() if within_rectangle(click, rect1): rect1.undraw() elif within_rectangle(click, rect2): rect2.undraw() else: output.setText("Goodbye.") 09-11-2015 39

Weekoverzicht Weeknummers Onderwerp Literatuur 1 Grafische klassen en objecten. Zelle, ch. 4 Objects and Graphics. 2 'File handlers', 'decisions' en verschillende soorten 'loops'. Zelle, ch. 8 Loop Structures and Booleans. Zelle, ch. 7 Decision Structures; 3 Recursie, datastructuren, en Python datacollecties. Brookshear & Brylow, ch. 8 Data Abstractions, Sections 8.1 and 8.6 4 Simulaties, 'pseudo random numbers', en spelletjes. Zelle, ch. 9 Simulation and Design (behalve voorbeeld Racquetball). 5 Klassen en objecten in het algemeen, en OOP. Zelle, ch. 10 Defining Classes (behalve voorbeeld Cannonball) Brookshear & Brylow, ch. 6 Programming Languages; 6 Nogmaals Python datacollecties, en ihb. 'dictionaries'. Zelle, ch. 11 Data Collections. 7 Course Summary. Voorbeelden van tentamenvragen. Voorbereiding tentamen. 09-11-2015 40