Arbeitsauftrag 5


Bewegung

Klasse: 11 Fach: Informatik

     


Die Struktur eines Processing-Programms erlaubt es uns, Programme zu schreiben, die in mehreren Teilen gruppiert sind. Das erlaubt uns die Programme übersichtliche zu halten, damit eine Modifikation bzw. Weiterentwicklung des Programms sowie die Übernahme eines Teils, um ein neues Programms zu schreiben. Diese sind:

1. Globale Variablen: Hier werden alle Größen, die durch das Programms benötigt werden definiert. Es gibt in Processing viele Zahlarten, die man definieren kann. Für uns sind erstmal nur zwei interessant. Nämlich Ganzzahlen und Dezimalzahlen. Um Größen zu definieren, soll als erstes der Typ der Zahl (Ganzzahl oder ezimalzahl) definiert werden. Anschließend soll der Name des Variablen und dessen Wert erfolgen. Für eine Ganzzahl braucht man den Zahl-Typ int und für eine Dezimalzahl braucht man den Zahl-Typ float. Beispiel:


var Name_Meiner_Ganzzahl=10;
var Name_Meiner_Dezimalzahl=10.021;

2. Einstellung des Programms

function setup()
{
	// ….Hier kommen die Einstellungen des Programms ausgeführt. In der
	// Programmierung spricht man von der Initialisierung eines Programms. Processing
	// führt dieses Teil nur einmal aus. Also hier sollen alle Befehle kommen, die nur einmal
	// ausgeführt werden müssen, wie beispielerweise:

	createCanvas(200, 500);
	// da sich die Fenster-Größe eines Programms in der Regel nicht ändert….
}

3. Körper des Programms, der in einer endlosen Schleife ausgeführt wird.


void draw(){
	// …Hier kommen die Befehle, die Processing in einer endlosen Schleife
	// ausführt. Dieses Teil wird für die Aktivität des Programms sorgen, weshalb man von
	// der Active-Mode spricht. Also hier sollen alle Befehle kommen, die immer wieder
	// ausgeführt werden müssen, wie beispielerweise:

	x=x+1; // hier wird der Variable x um 1 vermehrt jedes Mal dieses Teil erneut ausgeführt wird… .
}

Wichtig:

Wie alle Programmierungssprachen ist Processing case-sensitive. Das bedeutet, dass Processing das Programm nur dann ausführen kann, wann es fehlerfrei getippt wird. Also das Programm lässt sich erst ausführen, wenn es fehlerfrei implementiert wird.

Viele Objekt-Befehle in Processing (wie rect und ellipse) brauchen den Zahl- Typ float. Wenn man eine Variable als Ganzzahl definiert und in rect ausführen möchte, streikt Processing

Processing gibt Hinweise über mögliche Tipps bzw. Syntax-Fehler. Diese Hinweise sind sehr hilfreich, um herauszufinden, warum das Programm nicht funktioniert. Typische Fehler sind u.a.:

Beispiel

Anwendungsbeispiel der Strukturierung eines Processing-Programms. Betrachten wir den Pseudo-Code für ein einfaches Programm, mit der ein Rechteck horizontal über das Fenster verschoben wird (wir betrachten dieses Rechteck als "Auto").


// Setup (Einstellung)
Fenster-Größe festlegen
// Globale Variablen:
// Autodimension definieren und festlegen

AB=Autobreite
AH=Autohöhe

// Ort des Autos definieren und festlegen

x=X-Koordinaten
y=Y-Koordinaten

// Draw (Endlose Schleife):
Hintergrund immer wieder neu füllen.
Fahrzeug vor Ort farbig darstellen.
Erhöhen Sie die Position des Autos durch die Geschwindigkeit.


// Global-Variablen
var x = 0;
var y = 100;
var speed = 1;

// Programmeinstellungen (Nur einmal auszuführen)
function setup() {
  createCanvas(200,200);
}

// Programmkörper (In endlosen Schleife auszuführen)
function draw() {
  background(255);
  rect(x,y,AB,AH);
  x=x+1;
}

Arbeitsauftrag 5

  1. Übertrage das Programm in den Processing-Editor und führe es aus.
  2. Kommentiere abschließend das Programm.
  3. Korrigiere die Fehler in dem Programm.
  4. Ändere die Autodimensionen und Geschwindigkeit.
  5. Modifiziere das Programm, sodass die Bewegung des Autos gespiegelt wird. Also Start rechts in Fahrtrichtung links.
  6. Lasse das Auto von diagonal fahren.
  7. Versuche zwei Autos nebeneinander fahren zu lassen.
  8. Versuche zwei Autos in unterschiedliche Richtungen fahren zu lassen.
  9. Erstelle eine Straße auf der das Auto fährt und verschönere das Auto.
  10. Processing Online Editor - Javascript