JumpNRun 02


Objekte einsammeln


Erklärungen zum Quellcode

Festlegung der Variablen

    let randAussen;
    let figur;
    let boden;
    let plattform01;

    let sammelobjekt01;
    let sammelobjekt02;
    let sammelobjekte;
    let sammelzaehler = 0;

    let geschwindigkeit = 5;

    let SCHWERKRAFT = 1;
    let SPRUNG = 15;

Neu sind die Variablen für die Sammelobjekte. Damit nicht zu viel programmiert werden muss, werden einzelne Sammelobjekte zu einer Gruppe zusammengefasst. Sobald die Figur ein Sammelobjekt berührt wird eine Aktion ausgelöst, in unserem Fall wird ein Zähler um eins vergrößert und das Sammelobjekt gelöscht.


Die Methode setup()

function setup() {
  //Anweisungen
}

Die Anweisungen in setup() werden genau einmal zu Beginn des Programms ausgeführt.

let cnv = createCanvas(800, 600);
cnv.position(10,10);

Damit wird ein Spielfeld (cnv) angelegt, das 800x600 Pixel groß ist. Das Spielfeld wird an die Koordinate (10, 10) von oben links aus gesehen gesetzt.

  randAussen = new Group();
  sammelobjekte = new Group();

Die 3 oberen Spielfeldränder werden in einer Gruppe (randAussen) zusammengefasst. Die Sammelobjekte werden in einer Gruppe (sammelobjekte) zusammengefasst.

  sammelobjekt01 = createSprite(plattform01.position.x-20, plattform01.position.y-35, 20, 20);
  sammelobjekt01.shapeColor = color("yellow");
  sammelobjekte.add(sammelobjekt01);

  sammelobjekt02 = createSprite(plattform01.position.x+120, plattform01.position.y-35, 20, 20);
  sammelobjekt02.shapeColor = color("green");  
  sammelobjekte.add(sammelobjekt02);

  figur = createSprite(50, height-50, 20, 50);
  figur.shapeColor = color("red");  

Die Sammelobjekte werden festgelegt, gefärbt, als unbeweglich festgelegt (immovable) und zur sammelobjekte-Gruppe hinzugefügt. Die Position ist so berechnet, dass si auf der Plattform liegen. Die Figur wird nach dem Erzeugen mit der gewünschten Farbe gefärbt.


Die Methode draw()

function draw() {
  //Anweisungen
}

Die Anweisungen in draw() werden 60 mal pro Sekunde ausgeführt.

background(252);

Der Hintergrund des Spielfelds wird hellgrau gefärbt.

figur.collide(randAussen,stopp);

Wenn die Figur mit dem Rand kollidiert, wird die Methode stopp aufgerufen, die am Ende des Quellcodes steht.

sammelobjekte.collide(figur,sammeln);

Wenn die Figur ein Sammelobjekt berührt wird die Methode sammeln aufgerufen, die am Ende des Quellcodes steht.

figur.velocity.y += SCHWERKRAFT;

Sobald die Tasten losgelassen werden, fällt die Figur beschleunigt nach unten.

  if(figur.collide(boden)) {
    figur.velocity.y = 0;
  }

Sobald die Figur mit dem Boden kollidiert, wird die Geschwindigkeit in y-Richtung Null.

  if(figur.collide(plattform01)) {
    figur.velocity.y = 0;
  }

Sobald die Figur mit der Plattform kollidiert, wird die Geschwindigkeit in y-Richtung Null.

  if(keyWentDown('d')) {
      figur.velocity.x = geschwindigkeit;
  }
  if(keyWentUp('d')) {
      figur.velocity.x = 0;
  }
  if(keyWentDown('a')) {
      figur.velocity.x = -geschwindigkeit;
  }
  if(keyWentUp('a')) {
      figur.velocity.x = 0;
  }  
  if(keyWentDown('w')) {
      figur.velocity.y = -SPRUNG;
  }

Die Figur wird mit den Tasten D, A und W gesteuert. Mit W springt die Figur nach oben.

drawSprites();

Die Ränder und die Figur wird gezeichnet.

  fill(0);
  strokeWeight(0);
  textSize(20);
  text("Gesammelt: "+ sammelzaehler.toString(), 30, 50);

Im Spielfeld wird oben links der Wert der Sammelvariable geschrieben.


Die Methode stopp()

function stopp() {
  //Anweisungen
}

Die Methode stopp() wird gestartet, sobald die Figur mit einem Rand kollidiert.

function stopp() {
  figur.velocity.x = 0;
  figur.velocity.y = 0;
}

Sobald die Figur mit einem Rand kollidiert, soll sie stehen bleiben. Die Geschwindigkeit wird Null.


Die Methode sammeln()

function stopp() {
  //Anweisungen
}

Die Methode sammeln() wird gestartet, sobald die Figur mit einem Sammelobjekt kollidiert.

function sammeln(objekt) {
  sammelzaehler++;
  objekt.remove();
}

Sobald die Figur mit einem Sammelobjekt kollidiert wird der Sammelzähler um eins größer und das Sammelobjekt wird gelöscht.