Programmieren lernen mit Computergrafik

Transkript

1 Programmieren lernen mit Computergrafik

2

3 Oliver Deussen Thomas Ningelgen Programmieren lernen mit Computergrafik Eine Einführung mit Java und Processing

4 Oliver Deussen Universität Konstanz Konstanz, Deutschland Thomas Ningelgen Konstanz, Deutschland ISBN ISBN (ebook) Die Deutsche Nationalbibliothek verzeichnet diese Publikation in der Deutschen Nationalbibliografie; detaillierte bibliografische Daten sind im Internet über abrufbar. Springer Vieweg Springer Fachmedien Wiesbaden GmbH, ein Teil von Springer Nature 2018 Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Jede Verwertung, die nicht ausdrücklich vom Urheberrechtsgesetz zugelassen ist, bedarf der vorherigen Zustimmung des Verlags. Das gilt insbesondere für Vervielfältigungen, Bearbeitungen, Übersetzungen, Mikroverfilmungen und die Einspeicherung und Verarbeitung in elektronischen Systemen. Die Wiedergabe von Gebrauchsnamen, Handelsnamen, Warenbezeichnungen usw. in diesem Werk berechtigt auch ohne besondere Kennzeichnung nicht zu der Annahme, dass solche Namen im Sinne der Warenzeichen- und Markenschutz-Gesetzgebung als frei zu betrachten wären und daher von jedermann benutzt werden dürften. Der Verlag, die Autoren und die Herausgeber gehen davon aus, dass die Angaben und Informationen in diesem Werk zum Zeitpunkt der Veröffentlichung vollständig und korrekt sind. Weder der Verlag, noch die Autoren oder die Herausgeber übernehmen, ausdrücklich oder implizit, Gewähr für den Inhalt des Werkes, etwaige Fehler oder Äußerungen. Der Verlag bleibt im Hinblick auf geografische Zuordnungen und Gebietsbezeichnungen in veröffentlichten Karten und Institutionsadressen neutral. Gedruckt auf säurefreiem und chlorfrei gebleichtem Papier Springer Vieweg ist ein Imprint der eingetragenen Gesellschaft Springer Fachmedien Wiesbaden GmbH und ist ein Teil von Springer Nature. Die Anschrift der Gesellschaft ist: Abraham-Lincoln-Str. 46, Wiesbaden, Germany

5 Vorwort Programmierung ist die Kunst, einen Computer genau das tun zu lassen, was man möchte. Programmieren zu können heißt aber auch, Computer wirklich zu verstehen. Es ist eine faszinierende Fertigkeit, mit der sich auch viele Probleme des Alltags lösen lassen. Man ist nicht mehr gezwungen, nach fertigen Computerprogrammen für ein Problem zu suchen, sondern kann oft selbst eine Lösung herstellen. Die Frage, welche der vielen Programmiersprachen für Anfänger oder Fortgeschrittene am besten geeignet ist, ist kaum zu beantworten. Man kann aber sehr wohl eine Liste von erwünschten Eigenschaften an die Programmiersprache erstellen. Beispielsweise den Wunsch nach Plattformunabhängigkeit, d. h. das erstellte Programm soll auf Microsoft, Android und OS X (Apple) ausführbar sein. Damit verkleinert man die Anzahl der zur Wahl stehenden Sprachen erheblich. Leider herrscht auch keine Einigkeit darüber, welches Programmierparadigma bzw. welcher Programmierstil am Anfang zu wählen ist. Objektorientierte Programmierung beschreibt alle Probleme über Objekte und deren Interaktion. Anhänger dieses Programmierparadigmas geben das Motto aus: Objects first! Vor dem Erlernen einer Programmiersprache sei zuerst das Konzept der Objektorientierung zu erlernen. Leider funktioniert das unserer Erfahrung nach jedoch nicht, ohne konkreten Programmcode zu schreiben und beides auf einmal zu lernen, überfordert viele. Daher verzichten wir bewusst auf den Einstieg über die Objektorientierung, sondern beschreiben zuerst die Grundlagen der normalen (imperativen) Programmierung über eine Reihe hoffentlich spannender Computergrafik-Beispiele. Später dann folgt eine Einführung in die Objektorientierung. Im Gegensatz zu anderen Büchern haben wir uns entschieden, die auf Java aufbauende Programmiersprache Processing zu verwenden, weil sie alle wichtigen Konzepte von Java und außerdem eine einfache und dennoch sehr vielfältige Grafikumgebung bietet. Eine Sprache wie Pascal, die in den 80-er Jahren ihren Siegeszug an deutschen Schulen und Universitäten antrat, wäre heute als Einstieg nicht mehr optimal, weil man damit weder eine Grafik erzeugen kann, noch ohne Weiteres ein Interaktionsfenster (Window) zu sehen bekommt. Das Ergebnis eines Pascal-Programms ist im weitesten Sinne immer nur Text. Hier bietet die Programmiersprache Processing einen Ausweg. Sie besteht im Kern aus der Programmiersprache Java, die sich als Industriestandard durchgesetzt hat, erweitert diese aber durch Funktionen V

6 zur Erzeugung von Grafikelementen, einen einfach zu bedienenden Editor und die Möglichkeit, erst einmal ohne objektorientierten Ballast zu programmieren. Dieses Buch bietet auf dieser Basis eine Einführung in die Programmierung mit grafischen Beispielen. Ausgehend von einfachen Bausteinen werden immer kompliziertere Probleme gelöst und auf diese Weise die wichtigsten Konzepte der Programmierung behandelt. Das Schöne an der Computergrafik ist, dass man nebenbei viele Bilder erzeugt und seine Fertigkeiten auch dazu benutzen kann, aus kleinen Beispielen große Computergrafiken mit komplexen Inhalten zu machen. Meist genügen nur ein paar kleine Änderungen an den im Buch gezeigten Beispielen. Alle diese Beispiele lassen sich sogar mit einem Laptop durchführen. Voraussetzung ist nur, dass sich die Programmierumgebung Processing dort installieren und ausführen lässt. Das sollten Sie vorab testen, laden Sie die für Ihren Computer geeignete Version der Programmierumgebung von herunter. Mehr dazu im Einführungskapitel. Processing wurde übrigens am MIT (Massachusetts Institute of Technology) entwickelt, um möglichst schnell Programme mit grafischer Ausgabe schreiben zu können. Wir verwenden es, weil sich die Grundlagen der Programmierung damit besonders einfach veranschaulichen lassen und es vielen Menschen Freude macht, damit zu arbeiten. Processing kann aber nicht nur interessante Bilder und Animationen erzeugen, es erlaubt auch die Interaktion mit dem Computer, das Erzeugen von Musik und Sound und vieles mehr. Es ist ein kleines Universum mit schier unbegrenzten Möglichkeiten. Viele kreative Menschen auf der Welt verwenden es, um ihre Ideen umzusetzen. Neben der Standardversion gibt es Varianten zur Programmierung von Android-Apps oder zur Erzeugung von interaktiven Webinhalten, auch zur Ansteuerung von Hardware über Arduino-Boards. Das sind kleine Computer, die man an den eigenen Rechner anschließt und die nach geeigneter Programmierung alle möglichen Aufgaben zur Steuerung und Regelung z. B. im Haushalt übernehmen können. Wir leben in einer Epoche, die später einmal als die Epoche der Digitalisierung in den Geschichtsbüchern stehen wird. Der Computer ist das dominierende Gerät dieser Epoche. Programmieren heißt sich dieser Welt zu öffnen, die Programmierung ist das Handwerkszeug unserer Zeit, Programmierer sind heute die wirklichen Veränderer unserer Gesellschaft. Wir sollten nicht nur darüber reden, sondern versuchen, es zu verstehen. VI

7 Webseite zum Buch: Auf dieser Seite finden Sie alle im Buch verwendeten Processing-Beispiele und Musterlösungen für die Aufgaben. Webseiten der Autoren: Thomas Ningelgen: (Ergänzungsprogramme in Processing, Material für Lehrer) Oliver Deussen: graphics.uni-konstanz.de (Computergrafik aus wissenschaftlicher Sicht) VII

8 Inhalt 1 Einführung 1 Computergrafik mit Processing 1.1 Los geht s! Robotergesicht Algorithmen und Programme Programmzustände Säufernase Weitere grafische Formen 7 2 Zutaten 9 Typen, Variablen, Ausdrücke und Funktionen 2.1 Einfache Datentypen Farbe: Ein spezieller Datentyp Variablen Arrays Strings Ausdrücke Logische Ausdrücke Funktionen 18 3 Kontrollstrukturen 21 If/else- und case-anweisung, Schleifen 3.1 Blöcke Die for -Schleife Zeichenfläche mit bunten Quadraten Zeichenfläche mit bunten Rechtecken Die while- und do-while-schleife Rechtecke mit while-schleife Die if then else -Anweisung Die switch-anweisung 29 IX

9 Inhaltsverzeichnis 4 Mengen 31 Arrays und Felder: Aufbewahren von vielen Dingen 4.1 Eindimensionale Arrays Erzeugen und Verändern von Pixeln Zweidimensionale Arrays 41 5 Bilder 45 Laden, Speichern und Verändern von Bildern 5.1 Ein erstes Objekt: Das Bildobjekt Weitere Eigenschaften des Bildobjekts 50 6 Prozeduren 53 Anweisungsblöcke selber schreiben 6.1 Zufällige Rechtecke mit setup und draw Quadratfunktion Prozedur-Aufrufe in Prozeduren Variable Prozeduren und Funktionen Iterationen Unbeabsichtigte Nebenwirkungen Rekursionen Random versus SecureRandom 73 7 Interaktion 77 Zusammenarbeit mit dem Computer 7.1 Tastatureingabe mit keypressed() Allgemeine Tastatureingabe Interaktion mit der Maus 80 8 Input/Output 83 Daten eingeben, Daten ausgeben X 8.1 Ausgabemöglichkeiten Textdateien lesen, anzeigen, schreiben Allgemeine Dateien lesen und schreiben Informationen in Bilddateien 90

10 9 Game of Life 97 Komplexes Systemverhalten Inhaltsverzeichnis 9.1 Eindimensionale zelluläre Automaten Game of Life Abgewandelte Regeln Räuber-Beute-Simulation Fraktale 107 Mathematische Schönheit und Komplexität 10.1 Die Mandelbrotmenge Seltsame Attraktoren Dynamische Systeme Ein fraktales Gebirge Turtle-Grafik 129 Komplexe natürliche Objekte 11.1 Rekursionen mit Turtle-Grafik Ein rekursiver Baum Lindenmayer-Systeme Objektorientierung 141 Objekte, Klassen und Vererbung 12.1 Objektklassen Punkte Ein Geometrie-Editor Klassen ableiten Abstrakte Klassen Physikalische Simulation 159 Pendel und mehr 13.1 Billard: Gleichförmige Bewegung Billard mit Hindernissen Gleichmäßig beschleunigte Bewegung Harmonische Schwingungen 170 XI

11 Inhaltsverzeichnis 14 Räumliche Formen 175 2D- und 3D-Computergrafik 14.1 Polygone Kurven Komplexe Formen mit PShape Dreidimensionale Objekte Nebenläufige Programmierung 191 Prozessorkerne und Threads 15.1 Threads Unerwünscht bunte Quadrate Parallele Erzeugung eines Bildes Unabhängige Objekte Frequenzzerlegung Bild einlesen Bildverarbeitung 209 Bilder verändern mit Filtern 16.1 Unscharf maskieren Kanten- und Relieffilter Filter mit Fouriertransformation Bibliotheken 221 Processing erweitern 17.1 PDF-Export Ein graphisches Benutzerinterface Physik in der Box Musik hören und bearbeiten mit Minim Mathematik mit Toxiclibs Zum Schluss 240 Literatur 241 Index 243 XII