static.wiai.de/mut-2024/sections/03-turtle-graphics.md
Jochen Mehlich c82d94b22e added mut done() instructions to examples
Signed-off-by: Jochen Mehlich <coding@jochenmehlich.de>
2024-10-28 09:23:21 +01:00

138 lines
3.1 KiB
Markdown

<h1 class="emoji">🐢</h1>
# Turtle Graphics
Einführung in die Schildkrötenwelt
---
<h1 class="emoji">🖌</h1>
- Turtle: englisch für **Schildkröte**
- vorhandener Baustein in Python
- Prinzip eines **programmierbaren Pinsels**: es wird eine Schildkröte bewegt, die Linien zieht
Note:
- Vorteil: man kann mit wenig Aufwand Zeichenschritte sehr oft hintereinander wiederholen lassen (z. B. fünzig Kreise zeichnen)
- Ursprung: vor vierzig Jahren hat ein Mathematiker sich diese Grafiken ausgedacht, wahrscheinlich weil es toll fand wie sich Schildkröten bewegen und wie sie dabei Spuren im Sand hinterlassen
---
## Lasst die Schildkröten frei!
```python
# Schildkrötenwelt laden
from turtle import *
# Aussehen festlegen
shape("turtle")
```
Note:
- Diese Befehle werden immer gebraucht, um mit der Schildkröte malen zu können
- Raute, "Gatter", "Gartenzaun": Leitet Kommentar ein (alls dahinter wird vom Compiler ignoriert)
---
## Die leere Schildkrötenwelt
![](images/09-extras/turtle_world.png) <!-- .element style="max-height: 500px" -->
---
## Beispiel
```python
# Schildkrötenwelt laden
from turtle import *
# Aussehen festlegen
shape("turtle")
# 100 Schritte nach vorn gehen
forward(100)
```
---
## Befehle (1)
- <!-- .element class="fragment" --> 50 Schritte geradeaus gehen:
`forward(50)`
- <!-- .element class="fragment" --> Um 90° nach links drehen:
`left(90)`
- <!-- .element class="fragment" --> Um 90° nach rechts drehen:
`right(90)`
Note:
- Zahlen bei forward() haben andere Bedeutung (Semantik) als bei left() und right()
---
## Achtung, Drehwurm!
<iframe src="https://wiai.de/mut/includes/angle-demo/" width="400px" height="400px"></iframe>
---
## Befehle (2)
- <!-- .element class="fragment" --> Schildkröte **auf Startpunkt** (Koordinatenursprung) zurücksetzen:
`home()`
- <!-- .element class="fragment" --> Einen Schritt **rückgängig** machen:
`undo()`
- <!-- .element class="fragment" --> Zeichnung leeren und Position der Schildkröte **zurücksetzen**:
`reset()`
---
# Aufgabe 1
---
## Ein Quadrat malen
<ol>
<li class="fragment"> Verwendet die Befehle, um die Welt für die Schildkröte zu laden:</li>
</ol>
```python
from turtle import *
shape("turtle")
```
<!-- .element class="fragment" -->
<ol start="2">
<li class="fragment" style="counter-increment: inherit"> Nutzt die Befehle `forward(`<span class="variable">Schritte</span>`)`, `left(`<span class="variable">Winkel</span>`)` oder `right(`<span class="variable">Winkel</span>`)`, um ein Quadrat zu zeichnen.
Ersetzt dabei <span class="variable">Schritte</span> und <span class="variable">Winkel</span> durch eine beliebige Zahl.</li>
</ol>
Note:
- was ist ein Quadrat? Was macht ein Quadrat aus?
- weiterführende Aufgabe: Rechteck, mehrere Vierecke ineinander verschachteln (immer wieder zu home() zurückkehren und verschiedene Seitenlängen ausprobieren)
---
## Lösungsbeispiel
```python
from turtle import *
shape("turtle")
forward(100)
left(90)
forward(100)
left(90)
forward(100)
left(90)
forward(100)
done()
```
Note:
- Frage: Was verändert sich, wenn man right(90) statt left(90) verwendet?