Learning Processing: Chapter 4: Variables: Exercise 4-6: Zoog shakes horizontally

Revise Example 4-8 so that Zoog shakes left and right as Zoog moves upward. Hint: this requires the use of random() in combination with zoogX.

zoogX = _____________________________;

Example

exercise_4_6

// Learning Processing
// Daniel Shiffman
// http://www.learningprocessing.com

// Exercise 4-6: Revise Example 4-8 so that Zoog shakes left and right as Zoog moves upward. 
// Hint: this requires the use of random() in combination with zoogX.
// zoogX = ____________________________;

// Declaring Variables.  
// zoogX and zoogY are for feature #1.  eyeR, eyeG, eyeB are for feature #2.
float zoogX;
float zoogY;

float eyeR;
float eyeG;
float eyeB;

void setup() {
  size(200,200);        // Set the size of the window
  // Feature #1.  zoogX and zoogY are initialized based on the size of the window.  
  // Note we cannot initialize these variables before the size() function is called 
  // since we are using the built-in variables width and height.
  zoogX = width/2;      // Zoog always starts in the middle
  zoogY = height + 100; // Zoog starts below the screen
  smooth();
}

void draw() {

  background(255);  // Draw a white background 
  
  // Set ellipses and rects to CENTER mode
  ellipseMode(CENTER);
  rectMode(CENTER); 
  
  // Draw Zoog's body
  stroke(0);
  fill(150);
  // Feature #1.  zoogX and zoogY are used for the shape locations.
  rect(zoogX,zoogY,20,100);

  // Draw Zoog's head
  stroke(0);
  fill(255);
  ellipse(zoogX,zoogY-30,60,60); 

  // Draw Zoog's eyes
  // Feature #2.  eyeR, eyeG, and eyeB are given random values and used in the fill() function.
  eyeR = random(255);
  eyeG = random(255);
  eyeB = random(255);
  fill(eyeR,eyeG,eyeB);
  
  ellipse(zoogX-19,zoogY-30,16,32); 
  ellipse(zoogX+19,zoogY-30,16,32); 

  // Draw Zoog's legs
  stroke(150);
  line(zoogX-10,zoogY+50,zoogX-10,height);
  line(zoogX+10,zoogY+50,zoogX+10,height);
  
  // Zoog moves up
  zoogY = zoogY - 1;
  
  // EXERCISE SOLUTION
  zoogX = zoogX + random(-5,5);
}

Comments (6)

Nuno Araujo

There’s a small error on the code of the answer, in is legs…
It says:
// Draw Zoog’s legs
stroke(150);
line(zoogX-10,zoogY+50,zoogX-10,height);
line(zoogX+10,zoogY+50,zoogX+10,height);

I belive it should be something like:
line(zoogX-10,zoogY+50,zoogX-15,zoogY+65);
line(zoogX+10,zoogY+50,zoogX+15,zoogY+65);

PS: Thanks for this exercises!
http://www.learningprocessing.com Daniel Shiffman

Thanks for the comment. For some reason I made this example (and exercise) have Zoog’s legs attached to the bottom of the window. But there’s no particular reason for this so your alternative is a good one!
flor

Why the solution of this exercise is zoogX = zoogX + random(-5,5);?
Anonymous

zoogX is the variable that controls the horizontal position of Zoog. If you change zoogX by a random value (positive or negative) every frame, Zoog’s horizontal location will appear to shake (randomly moving left and right).
http://twitter.com/stani101 stani

This is what I tried…obviously not correct :

zoogX = random(zoogY-zoogX);
Berthalaban

Zoog would still shake horizontally if you wrote ‘zoogX=random(5)’

But the answer is ‘=zoogX+random(-5,5)’
because first,
you would want zoog to start shaking in the middle of the canvas
(this is done by adding zoogX in the equation again)

and then second,
you would want to control the boundary of the random number.
(from -5 to 5)