Programmeren met Grafische Objecten

Presentatie over: "Programmeren met Grafische Objecten"— Transcript van de presentatie:

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

2 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’ 2

3 3

4 4

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

6 Grafische Objecten 6

7 Grafische Objecten window 7

8 Grafische Objecten window combobox 8

9 Grafische Objecten window combobox text entry 9

10 Grafische Objecten window combobox text entry button 10

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

12 Datatypes en operaties
>>> sum = >>> 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'] 12

13 Programmeerparadigma’s
13

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

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

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

17 win = graphics.GraphWin("My first window") win.close()
import graphics win = graphics.GraphWin("My first window") win.close() 17

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

19 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>) 19

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() <object name>.<method name>(<method parameters>) 20

21 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() 21

22 22

23 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. 23

24 dog object 24

25 dog class  dog object 25

26 teacher class  teacher object
26

27 GrahpWin objects 27

28 28

29 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 29

30 Your click 1 was at (17, 15). Your click 2 was at (32, 32).
30

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

32 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() 32

33 33

34 Event-driven Programming
Steve Ferg (2006) 34

35 Event loop algorithm (Ferg, 2006)
35

36 graphics.py staat slechts afhandeling toe van: mouse clicks text entry
36

37 37

38 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)) 38

39 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.") 39

40 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. 40